Toni grbic/backend profile leaderboard

apps/api/src/app.module.ts

@@ -16,6 +16,7 @@ import { EventModule } from './event/event.module';
 import { FrequentlyAskedQuestionModule } from './frequently-asked-question/frequently-asked-question.module';
 import { InterestModule } from './interest/interest.module';
 import { JobModule } from './job/job.module';
+import { LeaderboardModule } from './leaderboard/leaderboard.module';
 import { NotificationModule } from './notification/notification.module';
 import { PrismaService } from './prisma.service';
 import { RewardModule } from './reward/reward.module';
@@ -65,6 +66,7 @@ import { UserModule } from './user/user.module';
     BoothModule,
     ShopModule,
     UserModule,
+    LeaderboardModule,
     RewardModule,
     AvatarModule,
   ],

apps/api/src/leaderboard/leaderboard.controller.ts

@@ -0,0 +1,51 @@
+import {
+  LeaderboardEntryDto,
+  LeaderboardQueryDto,
+  LeaderboardResponseDto,
+  UserRankResponseDto,
+} from '@ddays-app/types/src/dto/leaderboard';
+import {
+  Controller,
+  Get,
+  Param,
+  ParseIntPipe,
+  Query,
+  Req,
+  UseGuards,
+} from '@nestjs/common';
+
+import { UserGuard } from '../auth/user.guard';
+import { LeaderboardService } from './leaderboard.service';
+
+@Controller('leaderboard')
+export class LeaderboardController {
+  constructor(private readonly leaderboardService: LeaderboardService) {}
+
+  @Get()
+  @UseGuards(UserGuard)
+  async getLeaderboard(
+    @Query() query: LeaderboardQueryDto,
+  ): Promise<LeaderboardResponseDto> {
+    return this.leaderboardService.getLeaderboard(query);
+  }
+
+  @Get('top')
+  @UseGuards(UserGuard)
+  async getTopUsers(): Promise<LeaderboardEntryDto[]> {
+    return this.leaderboardService.getTopUsers(3);
+  }
+
+  @Get('user/:id')
+  @UseGuards(UserGuard)
+  async getUserRank(
+    @Param('id', ParseIntPipe) userId: number,
+  ): Promise<UserRankResponseDto> {
+    return this.leaderboardService.getUserRank(userId);
+  }
+
+  @Get('me')
+  @UseGuards(UserGuard)
+  async getCurrentUserRank(@Req() { user }): Promise<UserRankResponseDto> {
+    return this.leaderboardService.getUserRank(user.id);
+  }
+}

apps/api/src/leaderboard/leaderboard.helper.ts

@@ -0,0 +1,33 @@
+export const levelPoints: Record<number, number> = {
+  0: 1,
+  200: 2,
+  600: 3,
+  1200: 4,
+  1900: 5,
+};
+
+export function getLevelFromPoints(points: number): {
+  level: number;
+  exceeded: number;
+} {
+  const thresholds = Object.keys(levelPoints)
+    .map(Number)
+    .sort((a, b) => a - b);
+
+  let level = 1;
+  let currentThreshold = 0;
+
+  for (const threshold of thresholds) {
+    if (points >= threshold) {
+      level = levelPoints[threshold];
+      currentThreshold = threshold;
+    } else {
+      break;
+    }
+  }
+
+  return {
+    level,
+    exceeded: points - currentThreshold,
+  };
+}

apps/api/src/leaderboard/leaderboard.module.ts

@@ -0,0 +1,11 @@
+import { Module } from '@nestjs/common';
+import { PrismaService } from 'src/prisma.service';
+
+import { LeaderboardController } from './leaderboard.controller';
+import { LeaderboardService } from './leaderboard.service';
+
+@Module({
+  controllers: [LeaderboardController],
+  providers: [LeaderboardService, PrismaService],
+})
+export class LeaderboardModule {}

apps/api/src/leaderboard/leaderboard.service.ts

@@ -0,0 +1,145 @@
+import {
+  LeaderboardEntryDto,
+  LeaderboardQueryDto,
+  LeaderboardResponseDto,
+  UserRankResponseDto,
+} from '@ddays-app/types/src/dto/leaderboard';
+import { Injectable } from '@nestjs/common';
+
+import { PrismaService } from '../prisma.service';
+import { getLevelFromPoints } from './leaderboard.helper';
+
+@Injectable()
+export class LeaderboardService {
+  constructor(private prisma: PrismaService) {}
+
+  async getLeaderboard(
+    query: LeaderboardQueryDto,
+  ): Promise<LeaderboardResponseDto> {
+    const { page, pageSize = 5, includeDeleted = false } = query;
+
+    const pageNum = Number(page) || 1;
+    const skip = (pageNum - 1) * pageSize;
+
+    const where = {
+      ...(includeDeleted ? {} : { isDeleted: false }),
+      points: { not: null },
+      isConfirmed: true,
+    };
+
+    const totalEntries = await this.prisma.user.count({ where });
+
+    const users = await this.prisma.user.findMany({
+      where,
+      select: {
+        id: true,
+        firstName: true,
+        lastName: true,
+        points: true,
+        profilePhotoUrl: true,
+      },
+      orderBy: [
+        { points: 'desc' },
+        { id: 'asc' }, // Add secondary sort by ID to match tie-breaking rule
+      ],
+      skip,
+      take: Number(pageSize),
+    });
+
+    const entries = users.map((user, index) => {
+      const rank = skip + index + 1;
+
+      return {
+        id: user.id,
+        name: `${user.firstName} ${user.lastName}`,
+        level: getLevelFromPoints(user.points || 0).level,
+        points: user.points || 0,
+        rank,
+        profilePhotoUrl: user.profilePhotoUrl,
+      };
+    });
+
+    return {
+      entries,
+      totalEntries,
+      page,
+      pageSize,
+    };
+  }
+
+  async getUserRank(userId: number): Promise<UserRankResponseDto> {
+    const user = await this.prisma.user.findUnique({
+      where: { id: userId, isDeleted: false },
+      select: {
+        id: true,
+        firstName: true,
+        lastName: true,
+        points: true,
+        profilePhotoUrl: true,
+      },
+    });
+
+    if (!user) {
+      throw new Error('User not found');
+    }
+
+    const usersAbove = await this.prisma.user.count({
+      where: {
+        isDeleted: false,
+        isConfirmed: true,
+        OR: [
+          { points: { gt: user.points || 0 } },
+          {
+            AND: [
+              { points: user.points || 0 }, // Same points
+              { id: { lt: user.id } }, // But created earlier (lower ID)
+            ],
+          },
+        ],
+      },
+    });
+
+    const rank = usersAbove + 1;
+
+    const formatUser = (u, r): LeaderboardEntryDto => ({
+      id: u.id,
+      name: `${u.firstName} ${u.lastName}`,
+      points: u.points || 0,
+      rank: r,
+      level: getLevelFromPoints(u.points || 0).level,
+      profilePhotoUrl: u.profilePhotoUrl,
+    });
+
+    return {
+      user: formatUser(user, rank),
+    };
+  }
+
+  async getTopUsers(count = 3): Promise<LeaderboardEntryDto[]> {
+    const topUsers = await this.prisma.user.findMany({
+      where: {
+        isDeleted: false,
+        isConfirmed: true,
+        points: { not: null },
+      },
+      orderBy: [{ points: 'desc' }, { id: 'asc' }],
+      take: count,
+      select: {
+        id: true,
+        firstName: true,
+        lastName: true,
+        points: true,
+        profilePhotoUrl: true,
+      },
+    });
+
+    return topUsers.map((user, index) => ({
+      id: user.id,
+      name: `${user.firstName} ${user.lastName}`,
+      level: getLevelFromPoints(user.points || 0).level,
+      points: user.points || 0,
+      rank: index + 1,
+      profilePhotoUrl: user.profilePhotoUrl,
+    }));
+  }
+}

apps/app/src/api/achievement/useAchievementCompleteByName.tsx

@@ -38,11 +38,9 @@ export const useAchievementCompleteByName = () => {
             whiteSpace: 'nowrap',
           },
           duration: 3000,
+          position: 'top-center',
         });
       },
-      onError: (error) => {
-        console.error('Achievement error:', error);
-      },
     },
   );
 };

apps/app/src/api/leaderboard/useGetTopUsers.ts

@@ -0,0 +1,19 @@
+import { useQuery } from 'react-query';
+import axios from '../base';
+import { LeaderboardEntryDto } from '@ddays-app/types/src/dto/leaderboard';
+import { QUERY_KEYS } from '@/constants/queryKeys';
+
+const getTopUsers = async (): Promise<LeaderboardEntryDto[]> => {
+  return axios.get<never, LeaderboardEntryDto[]>('/leaderboard/top');
+};
+
+export const useGetTopUsers = () => {
+  return useQuery<LeaderboardEntryDto[]>(
+    QUERY_KEYS.leaderboardTop,
+    getTopUsers,
+    {
+      refetchOnWindowFocus: false,
+      staleTime: 60000, // 1 minute
+    },
+  );
+};

apps/app/src/api/leaderboard/useGetUserRank.ts

@@ -0,0 +1,19 @@
+import { useQuery } from 'react-query';
+import axios from '../base';
+import { UserRankResponseDto } from '@ddays-app/types/src/dto/leaderboard';
+import { QUERY_KEYS } from '@/constants/queryKeys';
+
+const getUserRank = async (): Promise<UserRankResponseDto> => {
+  return axios.get<never, UserRankResponseDto>('leaderboard/me');
+};
+
+export const useGetUserRank = () => {
+  return useQuery<UserRankResponseDto>(
+    QUERY_KEYS.leaderboardUserRank,
+    getUserRank,
+    {
+      refetchOnWindowFocus: true,
+      staleTime: 60000, // 1 minute
+    },
+  );
+};

apps/app/src/api/leaderboard/useInfiniteLeaderboard.ts

@@ -0,0 +1,45 @@
+import { useInfiniteQuery } from 'react-query';
+import axios from '../base';
+import { LeaderboardResponseDto } from '@ddays-app/types/src/dto/leaderboard';
+import { QUERY_KEYS } from '@/constants/queryKeys';
+
+interface LeaderboardParams {
+  pageSize?: number;
+  includeDeleted?: boolean;
+}
+
+export const useInfiniteLeaderboard = ({
+  pageSize,
+  includeDeleted = false,
+}: LeaderboardParams = {}) => {
+  const getLeaderboard = async ({
+    pageParam = 1,
+  }): Promise<LeaderboardResponseDto> => {
+    return axios.get<never, LeaderboardResponseDto>('leaderboard', {
+      params: {
+        page: pageParam,
+        pageSize,
+        includeDeleted,
+      },
+    });
+  };
+
+  return useInfiniteQuery<
+    LeaderboardResponseDto,
+    Error,
+    LeaderboardResponseDto
+  >([QUERY_KEYS.leaderboard, pageSize, includeDeleted], getLeaderboard, {
+    getNextPageParam: (lastPage) => {
+      const currentPage = Number(lastPage.page);
+      const totalPages = Math.ceil(lastPage.totalEntries / lastPage.pageSize);
+
+      if (currentPage < totalPages) {
+        return currentPage + 1;
+      }
+
+      return undefined;
+    },
+    keepPreviousData: true,
+    refetchOnWindowFocus: true,
+  });
+};

apps/app/src/components/ErrorMessage/ErrorMessage.module.scss

@@ -0,0 +1,15 @@
+.errorMessageContainer {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 5;
+
+}
+
+.errorMessage {
+  @include heading-2;
+  color: $primary-black;
+  margin: 0 2rem;
+  text-align: center;
+}
+

apps/app/src/components/ErrorMessage/ErrorMessage.tsx

@@ -0,0 +1,15 @@
+import styles from './ErrorMessage.module.scss';
+
+interface ErrorMessageProps {
+  message: string;
+}
+
+const ErrorMessage = ({ message }: ErrorMessageProps) => {
+  return (
+    <div className={styles.errorMessageContainer}>
+      <p className={styles.errorMessage}>{message}</p>
+    </div>
+  );
+};
+
+export default ErrorMessage;

apps/app/src/components/ErrorMessage/index.ts

@@ -0,0 +1,3 @@
+import ErrorMessage from './ErrorMessage';
+
+export default ErrorMessage;