게스트 모집에 참여 신청 혹은 확정된 사용자 정보 목록 조회 api mocking (#82)

* feat: CommonErrorResponse 타입 선언

* fix: getGameMembers 함수명 수정

* feat: pendingMembersMap mock data 추가

* feat: useGameMembersQuery 훅 작성

* feat: mockGetGameMembers mock api handler 작성

Author: dlwl98

src/api/games/getGameMembers.ts

@@ -3,13 +3,15 @@ import { axiosInstance } from '@api/axiosInstance';
 import { GetGameMembersResponse } from '@type/api/games';
 import { Game } from '@type/models';
 
-export const getGameMebers = async ({
-  gameId,
-  status,
-}: {
+export type getGameMembersProps = {
   gameId: Game['id'];
   status: '대기' | '확정';
-}) => {
+};
+
+export const getGameMembers = async ({
+  gameId,
+  status,
+}: getGameMembersProps) => {
   const { data } = await axiosInstance.get<GetGameMembersResponse>(
     `/api/games/${gameId}/members`,
     {

src/hooks/queries/useGameMembersQuery.ts

@@ -0,0 +1,13 @@
+import { useSuspenseQuery } from '@tanstack/react-query';
+
+import { getGameMembers, getGameMembersProps } from '@api/games/getGameMembers';
+
+export const useGameMembersQuery = ({
+  gameId,
+  status,
+}: getGameMembersProps) => {
+  return useSuspenseQuery({
+    queryKey: ['game-members', gameId, status],
+    queryFn: () => getGameMembers({ gameId, status }),
+  });
+};

src/mocks/data/game.ts

@@ -1,4 +1,4 @@
-import { Game } from '@type/models';
+import { Game, Member } from '@type/models';
 
 export const games: Game[] = Array(100)
   .fill({
@@ -63,3 +63,25 @@ export const games: Game[] = Array(100)
     ...game,
     id: index + 1,
   }));
+
+export const pendingMembers: Member[] = Array(5)
+  .fill({
+    id: 0,
+    email: '[email protected]',
+    nickname: 'james123',
+    introduction: '안녕하십니까. 제임스입니다. 아이고~ 사장님~~',
+    profileImageUrl: 'https://s3.amazonaws.com/pickple/james123.jpg',
+    mannerScore: 21,
+    mannerScoreCount: 30,
+    addressDepth1: '서울시',
+    addressDepth2: '강남구',
+    positions: ['C', 'PF'],
+  })
+  .map((member: Member, index) => ({
+    ...member,
+    id: index + 1,
+  }));
+
+export const pendingMembersMap: Member[][] = Array(101)
+  .fill(null)
+  .map(() => pendingMembers);

src/mocks/handlers/game.ts

@@ -3,12 +3,13 @@ import { DefaultBodyType, HttpResponse, PathParams, http } from 'msw';
 import { CommonErrorResponse } from '@type/api/error';
 import {
   GetGameDetailResponse,
+  GetGameMembersResponse,
   PostGameRequest,
   PostGameResponse,
 } from '@type/api/games';
 import { Game, Member } from '@type/models';
 
-import { games } from '@mocks/data/game';
+import { games, pendingMembersMap } from '@mocks/data/game';
 
 const mockPostGame = http.post<
   PathParams,
@@ -64,6 +65,32 @@ const mockGetGames = http.get('/api/games', ({ request }) => {
   return HttpResponse.json(games.slice(startIndex, startIndex + size));
 });
 
+const mockGetGameMembers = http.get<
+  { gameId: string },
+  DefaultBodyType,
+  GetGameMembersResponse | CommonErrorResponse
+>('/api/games/:gameId/members', ({ params, request }) => {
+  const { searchParams } = new URL(request.url);
+  const status = searchParams.get('status');
+  const gameId = Number(params.gameId);
+
+  if (!status || (status !== '대기' && status !== '확정')) {
+    return HttpResponse.json({ code: 'COM-002' }, { status: 400 });
+  }
+  const game = games.find((game) => game.id === gameId);
+  if (!game) {
+    return HttpResponse.json({ code: 'COM-004' }, { status: 400 });
+  }
+
+  if (status === '대기') {
+    return HttpResponse.json({
+      ...game,
+      members: pendingMembersMap[gameId],
+    });
+  }
+  return HttpResponse.json(game);
+});
+
 const mockGetGameDetail = http.get<
   { gameId: string },
   DefaultBodyType,
@@ -79,4 +106,4 @@ const mockGetGameDetail = http.get<
   return HttpResponse.json(game);
 });
 
-export const gameHandlers = [mockPostGame, mockGetGames, mockGetGameDetail];
+export const gameHandlers = [mockPostGame, mockGetGames, mockGetGameDetail, mockGetGameMembers];