경기(매치) 관련 api 함수 구현 (#78)

* feat: 게임 도메인 관련 요청, 응답 타입 선언

Co-authored-by: Minjae Kim <[email protected]>

* feat: games mock 데이터 추가

Co-authored-by: Minjae Kim <[email protected]>

* feat: postGame api 함수 작성

Co-authored-by: Minjae Kim <[email protected]>

* feat: 게스트 모집글 생성 mutation 작성
- useGameMutation 함수 작성

Co-authored-by: Minjae Kim <[email protected]>

* feat: 게스트 모집글 작성 api msw handler 작성
- mockPostGame 함수 작성

Co-authored-by: Minjae Kim <[email protected]>

* feat: 경기 목록 가져오는 api 작성
- getGames 함수 작성

* feat: 경기 목록 가져오는 Query 작성
- useGamesQuery 훅 작성

* feat: 경기 목록 가져오는 mock api handler 작성
- mockGetGames 작성

* feat: 경기(매치)관련 api 함수 작성

Co-authored-by: Minjae Kim <[email protected]>

---------

Co-authored-by: Minjae Kim <[email protected]>

Author: dlwl98

src/api/games/deleteGameParticipate.ts

@@ -0,0 +1,10 @@
+import { axiosInstance } from '@api/axiosInstance';
+
+import { DeleteGameParticipateRequest } from '@type/api/games';
+
+export const deleteGameParticipate = async ({
+  gameId,
+  memberId,
+}: DeleteGameParticipateRequest) => {
+  await axiosInstance.delete(`/api/games/${gameId}/members/${memberId}`, {});
+};

src/api/games/getGameDetail.ts

@@ -0,0 +1,13 @@
+import { axiosInstance } from '@api/axiosInstance';
+
+import { GetGameDetailResponse } from '@type/api/games';
+import { Game } from '@type/models';
+
+export const getGameDetail = async ({ gameId }: { gameId: Game['id'] }) => {
+  const { data } = await axiosInstance.get<GetGameDetailResponse>(
+    `api/games/${gameId}`,
+    {}
+  );
+
+  return data;
+};

src/api/games/getGameMembers.ts

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

src/api/games/getGames.ts

@@ -0,0 +1,21 @@
+import { axiosInstance } from '@api/axiosInstance';
+
+import { GetGamesResponse } from '@type/api/games';
+
+export const getGames = async ({
+  category,
+  value,
+  page,
+  size,
+}: {
+  category?: string;
+  value?: string;
+  page: number;
+  size: number;
+}) => {
+  const { data } = await axiosInstance.get<GetGamesResponse>('/api/games', {
+    params: { category, value, page, size },
+  });
+
+  return data;
+};

src/api/games/patchGameParticipate.ts

@@ -0,0 +1,19 @@
+import { axiosInstance } from '@api/axiosInstance';
+
+import { PatchGameParticipateApplyRequest } from '@type/api/games';
+import { Game, Member } from '@type/models';
+
+export const patchMannerScoreReview = async ({
+  payload,
+  gameId,
+  memberId,
+}: {
+  payload: PatchGameParticipateApplyRequest;
+  gameId: Game['id'];
+  memberId: Member['id'];
+}) => {
+  await axiosInstance.patch(`api/games/${gameId}/members/${memberId}`, {
+    data: payload,
+  });
+  return;
+};

src/api/games/patchMannerScoreReview.ts

@@ -0,0 +1,17 @@
+import { axiosInstance } from '@api/axiosInstance';
+
+import { PatchGameMannerScoreReviewRequest } from '@type/api/games';
+import { Game } from '@type/models';
+
+export const patchMannerScoreReview = async ({
+  payload,
+  gameId,
+}: {
+  payload: PatchGameMannerScoreReviewRequest;
+  gameId: Game['id'];
+}) => {
+  await axiosInstance.patch(`api/games/${gameId}/members/manner-scores`, {
+    data: payload,
+  });
+  return;
+};

src/api/games/postGame.ts

@@ -0,0 +1,11 @@
+import { axiosInstance } from '@api/axiosInstance';
+
+import { PostGameRequest, PostGameResponse } from '@type/api/games';
+
+export const postGame = async (payload: PostGameRequest) => {
+  const { data } = await axiosInstance.post<PostGameResponse>('/api/games', {
+    data: payload,
+  });
+
+  return data;
+};

src/api/games/postGameParticipate.ts

@@ -0,0 +1,16 @@
+import { axiosInstance } from '@api/axiosInstance';
+
+import { PostGameParticipateRequest } from '@type/api/games';
+import { Game } from '@type/models';
+
+export const postGameParticipate = async ({
+  payload,
+  gameId,
+}: {
+  payload: PostGameParticipateRequest;
+  gameId: Game['id'];
+}) => {
+  await axiosInstance.post(`/api/games/${gameId}/members`, {
+    data: payload,
+  });
+};

src/hooks/mutations/useGameMutation.ts

@@ -0,0 +1,9 @@
+import { useMutation } from '@tanstack/react-query';
+
+import { postGame } from '@api/games/postGame';
+
+export const useGameMutation = () => {
+  return useMutation({
+    mutationFn: postGame,
+  });
+};

src/hooks/queries/useGamesQuery.ts

@@ -0,0 +1,23 @@
+import { useSuspenseInfiniteQuery } from '@tanstack/react-query';
+
+import { getGames } from '@api/games/getGames';
+
+const FETCH_SIZE = 20;
+
+export const useGamesQuery = ({
+  category,
+  value,
+}: {
+  category?: string;
+  value?: string;
+}) => {
+  return useSuspenseInfiniteQuery({
+    queryKey: ['games', category, value],
+    queryFn: ({ pageParam }) =>
+      getGames({ category, value, page: pageParam, size: FETCH_SIZE }),
+    getNextPageParam: (page) => {
+      return page.length / FETCH_SIZE;
+    },
+    initialPageParam: 0,
+  });
+};