From 915f9edb830d3ce841a16f46d699e0a0e64e8593 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=9D=B4=EC=9D=98=EC=B0=AC?= <cksxkr5193@naver.com>
Date: Thu, 6 Jun 2024 02:08:33 +0900
Subject: [PATCH] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F=20=EC=9C=A0=EC=A0=80=20?=
 =?UTF-8?q?=EC=9D=B4=EB=A6=84=20/=20=EB=8B=89=EB=84=A4=EC=9E=84=20?=
 =?UTF-8?q?=EB=B6=84=EB=A6=AC=20(#91)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat: User interface에 username 추가
* feat: feed에서 username 사용하도록 수정
* feat: Profile에서 username 사용하도록 수정

Closes #91
---
 src/app/mocks/consts/likeUser.ts              | 25 ++++++++++-------
 src/app/mocks/consts/user.ts                  | 27 ++++++++++++-------
 src/shared/consts/types/feed.ts               |  2 +-
 src/shared/consts/types/user.ts               | 13 ++-------
 src/widgets/feed-main-list/ui/Feed.tsx        |  2 +-
 .../profile-feed-list/ui/ProfileFeedList.tsx  |  6 ++---
 src/widgets/profile-user/ui/ProfileUser.tsx   | 14 +++++++---
 7 files changed, 50 insertions(+), 39 deletions(-)

diff --git a/src/app/mocks/consts/likeUser.ts b/src/app/mocks/consts/likeUser.ts
index 686e2a1..8ff1ce7 100644
--- a/src/app/mocks/consts/likeUser.ts
+++ b/src/app/mocks/consts/likeUser.ts
@@ -7,9 +7,10 @@ interface Users {
 export const likeUsers: Users = {
   1: {
     id: 2,
-    profileImage: 'https://picsum.photos/200/200',
+    profileImage: '',
     name: '이의찬',
-    content: 'Legitgoons',
+    username: 'Legitgoons',
+    content: '취업하고싶당',
     locked: false,
     feedCount: 124,
     followingCount: 2,
@@ -17,9 +18,10 @@ export const likeUsers: Users = {
   },
   2: {
     id: 3,
-    profileImage: 'https://picsum.photos/200/200',
+    profileImage: '',
     name: '양재서',
-    content: 'psychology50',
+    username: 'psychology50',
+    content: 'IMPM',
     locked: true,
     feedCount: 6,
     followingCount: 35,
@@ -27,9 +29,10 @@ export const likeUsers: Users = {
   },
   3: {
     id: 5,
-    profileImage: 'https://picsum.photos/200/200',
+    profileImage: 'https://picsum.photos/32/32',
     name: '신얀',
-    content: 'yanni13',
+    username: 'yanni13',
+    content: 'imiOSDev',
     locked: true,
     feedCount: 51,
     followingCount: 7897,
@@ -37,9 +40,10 @@ export const likeUsers: Users = {
   },
   4: {
     id: 4,
-    profileImage: 'https://picsum.photos/200/200',
+    profileImage: 'https://picsum.photos/32/32',
     name: '이수민',
-    content: 'SSXXMM22',
+    username: 'SSXXMM22',
+    content: 'imdesigner',
     locked: true,
     feedCount: 24,
     followingCount: 42,
@@ -47,9 +51,10 @@ export const likeUsers: Users = {
   },
   5: {
     id: 7,
-    profileImage: 'https://picsum.photos/200/200',
+    profileImage: 'https://picsum.photos/32/32',
     name: '안성윤',
-    content: 'asn6878',
+    username: 'asn6878',
+    content: 'imbackend',
     locked: true,
     feedCount: 87,
     followingCount: 67,
diff --git a/src/app/mocks/consts/user.ts b/src/app/mocks/consts/user.ts
index 1df37a4..4ad9275 100644
--- a/src/app/mocks/consts/user.ts
+++ b/src/app/mocks/consts/user.ts
@@ -9,7 +9,8 @@ export const users: Users = {
     id: 1,
     profileImage: '',
     name: '강병준',
-    content: 'bangdori',
+    username: 'bangdori',
+    content: '스타트업으로 갑니당',
     locked: false,
     feedCount: 100,
     followingCount: 347,
@@ -19,7 +20,8 @@ export const users: Users = {
     id: 2,
     profileImage: '',
     name: '이의찬',
-    content: 'Legitgoons',
+    username: 'Legitgoons',
+    content: '취업하고싶당',
     locked: false,
     feedCount: 124,
     followingCount: 2,
@@ -29,7 +31,8 @@ export const users: Users = {
     id: 3,
     profileImage: '',
     name: '양재서',
-    content: 'psychology50',
+    username: '오늘도밤샘',
+    content: 'IMPM',
     locked: true,
     feedCount: 6,
     followingCount: 35,
@@ -39,7 +42,8 @@ export const users: Users = {
     id: 4,
     profileImage: 'https://picsum.photos/32/32',
     name: '이수민',
-    content: 'SSXXMM22',
+    username: 'SSXXMM22',
+    content: 'imdesigner',
     locked: true,
     feedCount: 24,
     followingCount: 42,
@@ -49,7 +53,8 @@ export const users: Users = {
     id: 5,
     profileImage: 'https://picsum.photos/32/32',
     name: '신얀',
-    content: 'yanni13',
+    username: 'yanni13',
+    content: 'imiOSDev',
     locked: true,
     feedCount: 51,
     followingCount: 7897,
@@ -59,7 +64,8 @@ export const users: Users = {
     id: 6,
     profileImage: 'https://picsum.photos/32/32',
     name: '이주원',
-    content: '2weeksone',
+    username: '2weeksone',
+    content: 'imdesignertoo',
     locked: false,
     feedCount: 97,
     followingCount: 98,
@@ -69,7 +75,8 @@ export const users: Users = {
     id: 7,
     profileImage: 'https://picsum.photos/32/32',
     name: '안성윤',
-    content: 'asn6878',
+    username: 'asn6878',
+    content: 'imbackend',
     locked: true,
     feedCount: 87,
     followingCount: 67,
@@ -79,7 +86,8 @@ export const users: Users = {
     id: 8,
     profileImage: 'https://picsum.photos/32/32',
     name: '이진우',
-    content: 'jinlee1703',
+    username: '네이버맨',
+    content: 'imbackendtoo',
     locked: false,
     feedCount: 32,
     followingCount: 24,
@@ -89,7 +97,8 @@ export const users: Users = {
     id: 9,
     profileImage: 'https://picsum.photos/32/32',
     name: '최희진',
-    content: 'heejinnn',
+    username: '부자가될거야',
+    content: 'iLoveNewjeans',
     locked: false,
     feedCount: 66,
     followingCount: 1,
diff --git a/src/shared/consts/types/feed.ts b/src/shared/consts/types/feed.ts
index f66c891..a40de19 100644
--- a/src/shared/consts/types/feed.ts
+++ b/src/shared/consts/types/feed.ts
@@ -18,7 +18,7 @@ export interface FetchFeeds {
 
 export interface Feed {
   id: number;
-  user: Pick<User, 'id' | 'profileImage' | 'name'>;
+  user: Pick<User, 'id' | 'profileImage' | 'username'>;
 
   content: string;
   images: Image[];
diff --git a/src/shared/consts/types/user.ts b/src/shared/consts/types/user.ts
index a65277e..4bb1f59 100644
--- a/src/shared/consts/types/user.ts
+++ b/src/shared/consts/types/user.ts
@@ -2,6 +2,7 @@ export interface User {
   id: number;
   profileImage: string;
   name: string;
+  username: string;
   content: string;
   locked: boolean;
 
@@ -13,17 +14,7 @@ export interface User {
 export interface FetchUser {
   code: string;
   data: {
-    user: {
-      id: number;
-      profileImage: string;
-      name: string;
-      content: string;
-      locked: boolean;
-
-      feedCount: number;
-      followingCount: number;
-      followerCount: number;
-    };
+    user: User;
   };
 }
 
diff --git a/src/widgets/feed-main-list/ui/Feed.tsx b/src/widgets/feed-main-list/ui/Feed.tsx
index 8c82b80..46fa70d 100644
--- a/src/widgets/feed-main-list/ui/Feed.tsx
+++ b/src/widgets/feed-main-list/ui/Feed.tsx
@@ -30,7 +30,7 @@ export const Feed: React.FC<{ isLink: boolean; feed: FeedProps }> = ({
         <header className='feed-header'>
           <Profile
             profileImage={user.profileImage}
-            name={user.name}
+            name={user.username}
             content={calculateElapsedTime(updatedAt)}
             userId={user.id}
             isLink={isLink}
diff --git a/src/widgets/profile-feed-list/ui/ProfileFeedList.tsx b/src/widgets/profile-feed-list/ui/ProfileFeedList.tsx
index 8ae1fe7..53b5782 100644
--- a/src/widgets/profile-feed-list/ui/ProfileFeedList.tsx
+++ b/src/widgets/profile-feed-list/ui/ProfileFeedList.tsx
@@ -8,7 +8,7 @@ const dummyFeeds: FeedProps[] = [
     id: 1,
     user: {
       id: 1,
-      name: '김붕어빵',
+      username: '김붕어빵',
       profileImage: '',
     },
     createdAt: '1분 전',
@@ -24,7 +24,7 @@ const dummyFeeds: FeedProps[] = [
     id: 2,
     user: {
       id: 1,
-      name: '김붕어빵',
+      username: '김붕어빵',
       profileImage: '',
     },
     createdAt: '1분 전',
@@ -40,7 +40,7 @@ const dummyFeeds: FeedProps[] = [
     id: 3,
     user: {
       id: 1,
-      name: '김붕어빵',
+      username: '김붕어빵',
       profileImage: '',
     },
     createdAt: '1분 전',
diff --git a/src/widgets/profile-user/ui/ProfileUser.tsx b/src/widgets/profile-user/ui/ProfileUser.tsx
index af9601e..bc9765f 100644
--- a/src/widgets/profile-user/ui/ProfileUser.tsx
+++ b/src/widgets/profile-user/ui/ProfileUser.tsx
@@ -28,8 +28,14 @@ export const ProfileUser = ({ userId, isOwner }: ProfileUserProps) => {
     return <NetworkError refetch={refetchUser} />;
   }
 
-  const { profileImage, name, feedCount, followerCount, followingCount } =
-    data.data.user;
+  const {
+    profileImage,
+    name,
+    username,
+    feedCount,
+    followerCount,
+    followingCount,
+  } = data.data.user;
 
   return (
     <>
@@ -38,10 +44,10 @@ export const ProfileUser = ({ userId, isOwner }: ProfileUserProps) => {
         <section className='profile-top-container'>
           <ProfileUserImage
             profileImage={profileImage}
-            name={name}
+            name={username}
             isOwner={isOwner}
           />
-          <h3 className='user-name h3semi'>{name}</h3>
+          <h3 className='user-name h3semi'>{username}</h3>
           {isOwner ? (
             <button className='nickname-change-btn b2md'>닉네임 수정</button>
           ) : (