chore(services): recomment 관련 로직 추가정의

Ubinquitous · Ubinquitous · commit bd7f81842aa9 · 2023-09-27T11:54:00.000+09:00
diff --git a/src/page/forum-post/services/api.service.ts b/src/page/forum-post/services/api.service.ts
@@ -6,35 +6,18 @@ interface IGetPostCommentListProps {
   pageParam: number;
 }
 
-export const getPostCommentList = async ({
-  id,
-  pageParam: page,
-}: IGetPostCommentListProps) => {
-  const { data } = await httpClient.comment.getById({ params: { id, page } });
-  return data;
-};
-
-interface ICreatePostCommentProps {
-  id: string;
-  detail: string;
+interface IGetRecommentListProps {
+  id: number;
+  pageParam: number;
 }
 
-export const createPostComment = async ({
-  id,
-  detail,
-}: ICreatePostCommentProps) => {
-  const { data } = await httpClient.comment.postById(
-    { detail },
-    { params: { id } },
-  );
-  return data;
-};
-
-interface IUpdatePostCommentProps {
+interface IPostCommentProps {
   id: number;
   detail: string;
 }
 
+// like
+
 export const updatePostLike = async (id: string) => {
   const { data } = await httpClient.like.put({
     type: LIKE.POST,
@@ -59,7 +42,25 @@ export const updateRecommentLike = async (id: number) => {
   return data;
 };
 
-export const updatePostComment = async (comment: IUpdatePostCommentProps) => {
+// comment
+
+export const getPostCommentList = async ({
+  id,
+  pageParam: page,
+}: IGetPostCommentListProps) => {
+  const { data } = await httpClient.comment.getById({ params: { id, page } });
+  return data;
+};
+
+export const createPostComment = async ({ id, detail }: IPostCommentProps) => {
+  const { data } = await httpClient.comment.postById(
+    { detail },
+    { params: { id } },
+  );
+  return data;
+};
+
+export const updatePostComment = async (comment: IPostCommentProps) => {
   const { data } = await httpClient.comment.put(comment);
   return data;
 };
@@ -70,3 +71,35 @@ export const deletePostComment = async (id: number) => {
   });
   return data;
 };
+
+// recomment
+
+export const getRecommentList = async ({
+  id,
+  pageParam: page,
+}: IGetRecommentListProps) => {
+  const { data } = await httpClient.recomment.getById({ params: { id, page } });
+  return data;
+};
+
+export const createRecomment = async ({ id, detail }: IPostCommentProps) => {
+  const { data } = await httpClient.recomment.postById(
+    { detail },
+    {
+      params: { id },
+    },
+  );
+  return data;
+};
+
+export const updateRecomment = async (comment: IPostCommentProps) => {
+  const { data } = await httpClient.recomment.put(comment);
+  return data;
+};
+
+export const deleteRecomment = async (id: number) => {
+  const { data } = await httpClient.recomment.deleteById({
+    params: { id },
+  });
+  return data;
+};
diff --git a/src/page/forum-post/services/mutation.service.ts b/src/page/forum-post/services/mutation.service.ts
@@ -9,46 +9,63 @@ import { useRouter } from "next/navigation";
 import { toast } from "react-toastify";
 import {
   createPostComment,
+  createRecomment,
   deletePostComment,
+  deleteRecomment,
   updateCommentLike,
   updatePostComment,
   updatePostLike,
+  updateRecomment,
+  updateRecommentLike,
 } from "./api.service";
 
-export const useDeletePostMutation = () => {
+interface IUsePostCommentMutationProps {
+  id: number;
+  detail: string;
+}
+
+// like
+
+export const useUpdatePostLikeMutation = () => {
   const apolloClient = useApolloClient();
-  const router = useRouter();
 
-  const mutations = useApolloMutation(DELETE_POST, {
-    onCompleted: () => {
+  return useMutation((id: string) => updatePostLike(id), {
+    onSuccess: () => {
       apolloClient.cache.reset();
-      toast.success("글이 삭제되었습니다!");
-      router.push(ROUTER.POST.LIST);
     },
   });
-  return mutations;
 };
 
-interface IUseCreateCommentMutationProps {
-  id: string;
-  detail: string;
-}
+export const useUpdateCommentLikeMutation = () => {
+  return useMutation((id: number) => updateCommentLike(id));
+};
 
-export const useUpdatePostLikeMutation = () => {
+export const useUpdateRecommentLikeMutation = () => {
+  return useMutation((id: number) => updateRecommentLike(id));
+};
+
+// post
+export const useDeletePostMutation = () => {
   const apolloClient = useApolloClient();
+  const router = useRouter();
 
-  return useMutation((id: string) => updatePostLike(id), {
-    onSuccess: () => {
+  const mutations = useApolloMutation(DELETE_POST, {
+    onCompleted: () => {
       apolloClient.cache.reset();
+      toast.success("글이 삭제되었습니다!");
+      router.push(ROUTER.POST.LIST);
     },
   });
+  return mutations;
 };
 
+// comment
+
 export const useCreatePostCommentMutation = () => {
   const queryClient = useQueryClient();
 
   return useMutation(
-    (props: IUseCreateCommentMutationProps) => createPostComment(props),
+    (comment: IUsePostCommentMutationProps) => createPostComment(comment),
     {
       onSuccess: () => {
         toast.success("댓글을 작성했어요!");
@@ -58,16 +75,11 @@ export const useCreatePostCommentMutation = () => {
   );
 };
 
-interface IUseUpdatePostCommentMutationProps {
-  id: number;
-  detail: string;
-}
-
 export const useUpdatePostCommentMutation = () => {
   const queryClient = useQueryClient();
 
   return useMutation(
-    (comment: IUseUpdatePostCommentMutationProps) => updatePostComment(comment),
+    (comment: IUsePostCommentMutationProps) => updatePostComment(comment),
     {
       onSuccess: () => {
         toast.success("댓글이 수정되었어요!");
@@ -88,6 +100,44 @@ export const useDeletePostCommentMutation = () => {
   });
 };
 
-export const useUpdateCommentLikeMutation = () => {
-  return useMutation((id: number) => updateCommentLike(id));
+// recomment
+
+export const useCreateRecommentMutation = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation(
+    (comment: IUsePostCommentMutationProps) => createRecomment(comment),
+    {
+      onSuccess: () => {
+        toast.success("답글을 작성했어요!");
+        queryClient.invalidateQueries([KEY.RECOMMENT]);
+        queryClient.invalidateQueries([KEY.COMMENT]);
+      },
+    },
+  );
+};
+
+export const useUpdateRecommentMutation = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation(
+    (comment: IUsePostCommentMutationProps) => updateRecomment(comment),
+    {
+      onSuccess: () => {
+        toast.success("답글이 수정되었어요!");
+        queryClient.invalidateQueries([KEY.RECOMMENT]);
+      },
+    },
+  );
+};
+
+export const useDeleteRecommentMutation = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation((id: number) => deleteRecomment(id), {
+    onSuccess: () => {
+      toast.success("답글이 삭제되었어요.");
+      queryClient.invalidateQueries([KEY.RECOMMENT]);
+    },
+  });
 };
diff --git a/src/page/forum-post/services/query.service.ts b/src/page/forum-post/services/query.service.ts
@@ -3,7 +3,7 @@ import { GET_POST } from "@/gql/post/queries";
 import { useQuery as useApolloQuery } from "@apollo/client";
 import { useInfiniteQuery } from "@tanstack/react-query";
 import { KEY } from "@/constants";
-import { getPostCommentList } from "./api.service";
+import { getPostCommentList, getRecommentList } from "./api.service";
 
 export const usePostQuery = ({ id }: IPostQuery) => {
   const { data, ...queryRest } = useApolloQuery(GET_POST({ id }), {
@@ -17,6 +17,10 @@ interface IUseCommentListQueryProps {
   postId: string;
 }
 
+interface IUseRecommentQueryProps {
+  commentId: number;
+}
+
 export const useCommentListQuery = ({
   postId: id,
 }: IUseCommentListQueryProps) => {
@@ -31,3 +35,18 @@ export const useCommentListQuery = ({
   });
   return { data: data?.pages, ...queryRest };
 };
+
+export const useRecommentListQuery = ({
+  commentId: id,
+}: IUseRecommentQueryProps) => {
+  const { data, ...queryRest } = useInfiniteQuery({
+    queryKey: [KEY.RECOMMENT],
+    queryFn: ({ pageParam = 0 }) => getRecommentList({ id, pageParam }),
+    getNextPageParam: (lastPage) => {
+      return lastPage.currentPage !== lastPage.totalPage - 1
+        ? lastPage.currentPage + 1
+        : undefined;
+    },
+  });
+  return { data: data?.pages, ...queryRest };
+};
