From 740565f382792c7fcec8824a1997d80a2bd85a39 Mon Sep 17 00:00:00 2001
From: pearpearB <smilyoung@gmail.com>
Date: Thu, 7 Apr 2022 17:15:02 +0900
Subject: [PATCH] =?UTF-8?q?[Fix]=20=EA=B2=8C=EC=8B=9C=EA=B8=80=20=EC=A2=8B?=
 =?UTF-8?q?=EC=95=84=EC=9A=94=20=EB=88=84=EB=A5=BC=20=EB=95=8C=EB=A7=88?=
 =?UTF-8?q?=EB=8B=A4=20=EC=83=88=EB=A1=9C=EA=B3=A0=EC=B9=A8=20=EB=90=98?=
 =?UTF-8?q?=EB=8A=94=20=EB=AC=B8=EC=A0=9C=20Close=20#610?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/pages/Detail/Detail.tsx | 13 +++++++++----
 1 file changed, 9 insertions(+), 4 deletions(-)

diff --git a/client/src/pages/Detail/Detail.tsx b/client/src/pages/Detail/Detail.tsx
index e7d218e..f34f4e5 100644
--- a/client/src/pages/Detail/Detail.tsx
+++ b/client/src/pages/Detail/Detail.tsx
@@ -81,7 +81,8 @@ export default function Detail() {
   const [commentData, setCommentData] = useState([]);
   const [commentsUserList, setCommentsUserList] = useState([-1]);
   const [commentTotalCnt, setCommentTotalCnt] = useState(0);
-  const [boxState, setBoxState] = useState(isLiked);
+  const [boxState, setBoxState] = useState(false);
+  const [usersLikeCnt, setUsersLikeCnt] = useState(0);
   const [openEditor, setOpenEditor] = useState(false);
   const currentUrl = window.location.href;
   const postUrl = currentUrl.split('postId=')[1];
@@ -102,10 +103,12 @@ export default function Detail() {
   );
   const results = useQueries([
     {
-      queryKey: ['detail_key', postUrl, boxState],
+      queryKey: ['detail_key', postUrl],
       queryFn: () => {
         instance.get(`/post?postId=${postUrl}`).then((res) => {
           setDetailData(res.data);
+          setBoxState(res.data.isLiked);
+          setUsersLikeCnt(res.data.likeCnt);
         });
       },
       retry: 0,
@@ -219,6 +222,8 @@ export default function Detail() {
       { path: `/post/like?postId=${postUrl}`, data: undefined },
       {
         onSuccess: () => {
+          if (boxState) setUsersLikeCnt(usersLikeCnt - 1);
+          else setUsersLikeCnt(usersLikeCnt + 1);
           setBoxState(!boxState);
         },
         onError: () => {
@@ -302,11 +307,11 @@ export default function Detail() {
                         </ContentWrap>
                       )}
                       <LikeWrap>
-                        <LikesBox boxState={isLiked} onClick={likeBoxHandler}>
+                        <LikesBox boxState={boxState} onClick={likeBoxHandler}>
                           <div>
                             <GrLike />
                           </div>
-                          <div>{likeCnt}</div>
+                          <div>{usersLikeCnt}</div>
                         </LikesBox>
                       </LikeWrap>
                       <CommentContainer>