FE-89 ♻️ 필요없는 count 상태 삭제

epigram5-9 · Aug 9, 2024 · 4f8311a · 4f8311a
1 parent 296874d
commit 4f8311a
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 30 deletions.
diff --git a/src/hooks/useMyContentState.tsx b/src/hooks/useMyContentState.tsx
@@ -11,26 +11,31 @@ export default function useMyContentState(user: UserInfo) {
   const limit = 3;
   const [isLoadingMore, setIsLoadingMore] = useState(false);
   const [selectedTab, setSelectedTab] = useState<'epigrams' | 'comments'>('epigrams');
-  const [epigramCount, setEpigramCount] = useState(0);
-  const [commentCount, setCommentCount] = useState(0);
+
   const [epigramCursor, setEpigramCursor] = useState<number>(0);
   const [commentCursor, setCommentCursor] = useState<number>(0);
   const [epigrams, setEpigrams] = useState<EpigramsResponse>({ totalCount: 0, nextCursor: null, list: [] });
   const [comments, setComments] = useState<CommentResponseType>({ totalCount: 0, nextCursor: null, list: [] });
 
-  const { data: count } = useGetMyContentHook({ id: user.id });
+  const { data: countData } = useGetMyContentHook({ id: user.id });
   const epigramsRequest = { limit, cursor: epigramCursor, writerId: user.id };
   const commentsRequest = { limit, cursor: commentCursor, id: user.id };
 
   const { data: epigramsData, isLoading: isEpigramsLoading, error: epigramsError } = useGetEpigrams(epigramsRequest);
   const { data: commentData, isLoading: isCommentsLoading, error: commentsError, refetch: refetchComments } = useCommentsHook(commentsRequest);
 
   useEffect(() => {
-    if (count) {
-      setEpigramCount(count.epigramCount);
-      setCommentCount(count.commentCount);
+    if (countData) {
+      setEpigrams((prev) => ({
+        ...prev,
+        totalCount: countData.epigramCount,
+      }));
+      setComments((prev) => ({
+        ...prev,
+        totalCount: countData.commentCount,
+      }));
     }
-  }, [count]);
+  }, [countData]);
 
   useEffect(() => {
     if (selectedTab === 'epigrams' && epigramsData) {
@@ -85,8 +90,6 @@ export default function useMyContentState(user: UserInfo) {
   return {
     isLoadingMore,
     selectedTab,
-    epigramCount,
-    commentCount,
     epigrams,
     comments,
     isEpigramsLoading,
@@ -95,7 +98,6 @@ export default function useMyContentState(user: UserInfo) {
     commentsError,
     handleMoreLoad,
     handleTabClick,
-    setCommentCount,
     setComments,
     refetchComments,
   };

diff --git a/src/pageLayout/MypageLayout/MyContent.tsx b/src/pageLayout/MypageLayout/MyContent.tsx
@@ -14,23 +14,8 @@ interface MyContentProps {
 
 export default function MyContent({ user }: MyContentProps) {
   const { toast } = useToast();
-  const {
-    isLoadingMore,
-    selectedTab,
-    epigramCount,
-    commentCount,
-    epigrams,
-    comments,
-    isEpigramsLoading,
-    isCommentsLoading,
-    epigramsError,
-    commentsError,
-    handleMoreLoad,
-    handleTabClick,
-    setComments,
-    setCommentCount,
-    refetchComments,
-  } = useMyContentState(user);
+  const { isLoadingMore, selectedTab, epigrams, comments, isEpigramsLoading, isCommentsLoading, epigramsError, commentsError, handleMoreLoad, handleTabClick, setComments, refetchComments } =
+    useMyContentState(user);
 
   const deleteCommentMutation = useDeleteCommentMutation({
     onSuccess: ({ commentId }) => {
@@ -39,7 +24,6 @@ export default function MyContent({ user }: MyContentProps) {
         nextCursor: prev.nextCursor,
         list: prev.list.filter((comment) => comment.id !== commentId),
       }));
-      setCommentCount((prev) => prev - 1);
     },
   });
 
@@ -75,14 +59,14 @@ export default function MyContent({ user }: MyContentProps) {
           onClick={() => selectedTab !== 'epigrams' && handleTabClick('epigrams')}
           disabled={selectedTab === 'epigrams'}
         >
-          내 에피그램({epigramCount})
+          내 에피그램({epigrams.totalCount})
         </Button>
         <Button
           className={`font-semibold text-2xl ${selectedTab === 'comments' ? 'cursor-default text-black-600 disabled:opacity-1 ' : 'cursor-pointer text-neutral-400'}`}
           onClick={() => selectedTab !== 'comments' && handleTabClick('comments')}
           disabled={selectedTab === 'comments'}
         >
-          내 댓글({commentCount})
+          내 댓글({comments.totalCount})
         </Button>
       </div>
       <div className='w-full py-[36px]'>