From 4f8311a7d7e4cf48d42f5ae10e0ae9aa015d7ccf Mon Sep 17 00:00:00 2001
From: JeonYumin94 <xosle94@gmail.com>
Date: Fri, 9 Aug 2024 12:17:23 +0900
Subject: [PATCH] =?UTF-8?q?FE-89=20:recycle:=20=ED=95=84=EC=9A=94=EC=97=86?=
 =?UTF-8?q?=EB=8A=94=20count=20=EC=83=81=ED=83=9C=20=EC=82=AD=EC=A0=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/hooks/useMyContentState.tsx           | 22 +++++++++++----------
 src/pageLayout/MypageLayout/MyContent.tsx | 24 ++++-------------------
 2 files changed, 16 insertions(+), 30 deletions(-)

diff --git a/src/hooks/useMyContentState.tsx b/src/hooks/useMyContentState.tsx
index adc74fc..a38be64 100644
--- a/src/hooks/useMyContentState.tsx
+++ b/src/hooks/useMyContentState.tsx
@@ -11,14 +11,13 @@ 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 };
 
@@ -26,11 +25,17 @@ export default function useMyContentState(user: UserInfo) {
   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
index 42198d8..6dabf92 100644
--- 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]'>