From 083fb83d041cd9186fac0bc8e524bdd70d94be11 Mon Sep 17 00:00:00 2001
From: starplanter93 <starplanter93@gmail.com>
Date: Thu, 22 Dec 2022 17:47:42 +0900
Subject: [PATCH] =?UTF-8?q?[Refactor]=20=EC=82=AC=EC=9A=A9=EC=9E=90=20?=
 =?UTF-8?q?=EC=A0=95=EB=B3=B4=EC=97=90=EC=84=9C=20=20=ED=8C=94=EB=A1=9C?=
 =?UTF-8?q?=EC=9A=B0,=20=ED=8C=94=EB=A1=9C=EC=9E=89=20=EC=8B=9C=20?=
 =?UTF-8?q?=EB=A6=AC=EB=A1=9C=EB=93=9C=20=EC=95=88=EB=90=98=EB=8F=84?=
 =?UTF-8?q?=EB=A1=9D=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 front/src/component/follow/FollowList.jsx     |  1 -
 front/src/component/follow/FollowUserCard.jsx | 18 ++++++++++++++----
 2 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/front/src/component/follow/FollowList.jsx b/front/src/component/follow/FollowList.jsx
index aa0b7830..42d9a4cc 100644
--- a/front/src/component/follow/FollowList.jsx
+++ b/front/src/component/follow/FollowList.jsx
@@ -48,7 +48,6 @@ const FollowListContainer = styled.div`
 `;
 
 function FollowList({ myFollowing }) {
-  console.log(myFollowing.boards);
   return (
     <FollowListContainer>
       <FollowUserCard myFollowing={myFollowing} />
diff --git a/front/src/component/follow/FollowUserCard.jsx b/front/src/component/follow/FollowUserCard.jsx
index 5b763ff3..123ae732 100644
--- a/front/src/component/follow/FollowUserCard.jsx
+++ b/front/src/component/follow/FollowUserCard.jsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useState } from 'react';
 import styled from 'styled-components';
 import { Link } from 'react-router-dom';
 import { useSelector, useDispatch } from 'react-redux';
@@ -118,6 +118,7 @@ const FollowListLeftSide = styled.div`
 `;
 
 function FollowUserCard({ myFollowing }) {
+  const [isFollow, setIsFollow] = useState(!!myFollowing.follow);
   const dispatch = useDispatch();
   const isLogin = useSelector(state => state.login.isLogin);
   const cookieAccountId = Number(localStorage.getItem('accountId'));
@@ -125,8 +126,17 @@ function FollowUserCard({ myFollowing }) {
 
   const followHandler = () => {
     if (isLogin) {
-      postDetailFollowApi(myFollowing.id);
-      window.location.reload();
+      postDetailFollowApi(myFollowing.id)
+        .then(res => {
+          if (res === 'SUCCESS') {
+            setIsFollow(true);
+          } else {
+            setIsFollow(false);
+          }
+        })
+        .catch(err => {
+          console.log(err);
+        });
     } else {
       dispatch(loginModalActions.openLoginModal());
     }
@@ -148,7 +158,7 @@ function FollowUserCard({ myFollowing }) {
         <li className="followList__button">
           {cookieAccountId === myFollowing.id ? (
             <div />
-          ) : !myFollowing.follow ? (
+          ) : !isFollow ? (
             <DefaultButton width="9rem" height="3rem" onClick={followHandler}>
               팔로우
             </DefaultButton>