From df6222d4dceba6ea6c6bea85a3fe089c46322a60 Mon Sep 17 00:00:00 2001
From: Jungu Lee <1zzangjun@gmail.com>
Date: Fri, 15 Dec 2023 13:14:59 +0900
Subject: [PATCH 1/2] =?UTF-8?q?Minor=20:=20Card=20=EC=8A=A4=ED=83=80?=
 =?UTF-8?q?=EC=9D=BC=20=EB=B3=80=EA=B2=BD,=20Elevation=20=EC=A0=9C?=
 =?UTF-8?q?=EA=B1=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/post/PostCard.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/components/post/PostCard.tsx b/client/src/components/post/PostCard.tsx
index 667f1a9..2b064b6 100644
--- a/client/src/components/post/PostCard.tsx
+++ b/client/src/components/post/PostCard.tsx
@@ -66,7 +66,7 @@ const PostCard = ({
   );
 
   return (
-    <Card sx={{ display: "flex", gap: 2, p: 2 }}>
+    <Card sx={{ display: "flex", gap: 2, py:2 }} elevation={0}>
       <Link href={USER_PAGE(createdBy)}>
         <UserAvatar
           src={profileImgUrls[0]?.attachUrl}

From bb113adad2677d8dd0c849849737dcfe1db1800b Mon Sep 17 00:00:00 2001
From: Jungu Lee <1zzangjun@gmail.com>
Date: Fri, 15 Dec 2023 13:15:15 +0900
Subject: [PATCH 2/2] =?UTF-8?q?Refactor=20:=20isFollowedByMe=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80=EC=97=90=20=EB=94=B0=EB=A5=B8=20=EB=B2=84=ED=8A=BC=20?=
 =?UTF-8?q?=EB=B6=84=EA=B8=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../user/followList/FollowUserCard.tsx        | 27 ++++++++++++++-----
 .../user/followList/FollowerList.tsx          | 21 ++++++++-------
 .../user/followList/FollowingList.tsx         |  3 ++-
 .../src/types/user/followingUserInterface.ts  |  1 +
 4 files changed, 35 insertions(+), 17 deletions(-)

diff --git a/client/src/components/user/followList/FollowUserCard.tsx b/client/src/components/user/followList/FollowUserCard.tsx
index edb8be9..4f4c2c6 100644
--- a/client/src/components/user/followList/FollowUserCard.tsx
+++ b/client/src/components/user/followList/FollowUserCard.tsx
@@ -4,6 +4,7 @@ import UserAvatar from "@/components/user/info/UserAvatar";
 import { useRouter } from "next/navigation";
 import { USER_PAGE } from "@/const/clientPath";
 import useUnFollowMutation from "@/queries/user/useUnFollowMutation";
+import useFollowMutation from "@/queries/user/useFollowMutation";
 
 type Props = {
   imageUrl?: string;
@@ -11,6 +12,7 @@ type Props = {
   userId: string;
   content: string;
   userPk: number;
+  isFollowedByMe?: boolean;
 };
 
 const FollowUserCard = ({
@@ -19,10 +21,11 @@ const FollowUserCard = ({
   nickName,
   userId,
   content,
+  isFollowedByMe,
 }: Props) => {
   const router = useRouter();
   const { mutate: unfollowHandler } = useUnFollowMutation();
-
+  const { mutate: followHandler } = useFollowMutation();
   return (
     <Stack direction="row" gap={1} py={1}>
       <UserAvatar
@@ -45,12 +48,22 @@ const FollowUserCard = ({
               @{userId}
             </Typography>
           </Stack>
-          <Button
-            variant="outlined"
-            onClick={() => unfollowHandler(String(userPk))}
-          >
-            언팔로우
-          </Button>
+
+          {isFollowedByMe ? (
+            <Button
+              variant="outlined"
+              onClick={() => unfollowHandler(String(userPk))}
+            >
+              언팔로우
+            </Button>
+          ) : (
+            <Button
+              variant="contained"
+              onClick={() => followHandler(String(userPk))}
+            >
+              팔로우
+            </Button>
+          )}
         </Stack>
         <Typography>{content}</Typography>
       </Stack>
diff --git a/client/src/components/user/followList/FollowerList.tsx b/client/src/components/user/followList/FollowerList.tsx
index 457d8d5..43061a8 100644
--- a/client/src/components/user/followList/FollowerList.tsx
+++ b/client/src/components/user/followList/FollowerList.tsx
@@ -19,15 +19,18 @@ const FollowerList = () => {
   return (
     <>
       {data.pages.map((page) =>
-        page.content.map(({ nickname, id, introduction, userNo }) => (
-          <FollowUserCard
-            key={id}
-            nickName={nickname}
-            userId={id}
-            userPk={userNo}
-            content={introduction}
-          />
-        ))
+        page.content.map(
+          ({ nickname, id, introduction, userNo, isFollowedByMe }) => (
+            <FollowUserCard
+              key={id}
+              nickName={nickname}
+              userId={id}
+              userPk={userNo}
+              isFollowedByMe={isFollowedByMe}
+              content={introduction}
+            />
+          )
+        )
       )}
       {isFetchingNextPage ? (
         <ComponentRepeater count={5}>
diff --git a/client/src/components/user/followList/FollowingList.tsx b/client/src/components/user/followList/FollowingList.tsx
index 7e5ab07..abe5066 100644
--- a/client/src/components/user/followList/FollowingList.tsx
+++ b/client/src/components/user/followList/FollowingList.tsx
@@ -19,12 +19,13 @@ const FollowingList = () => {
   return (
     <>
       {data.pages.map((page) =>
-        page.content.map(({ nickname, id, introduction, profileImgUrls, userNo }) => (
+        page.content.map(({ nickname, id, introduction, profileImgUrls, userNo,isFollowedByMe }) => (
           <FollowUserCard
             key={id}
             nickName={nickname}
             userId={id}
             userPk={userNo}
+            isFollowedByMe={isFollowedByMe}
             imageUrl={profileImgUrls[0]?.attachUrl}
             content={introduction}
           />
diff --git a/client/src/types/user/followingUserInterface.ts b/client/src/types/user/followingUserInterface.ts
index e51e28a..95307b6 100644
--- a/client/src/types/user/followingUserInterface.ts
+++ b/client/src/types/user/followingUserInterface.ts
@@ -5,6 +5,7 @@ interface FollowingUserInterface {
   id: string;
   userNo: number;
   introduction: string;
+  isFollowedByMe:boolean;
   createdBy: number;
   profileImgUrls: AttachInterface[];
 }