From 662daa71be1a6d641c3427da74785d641235a67a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=9D=B4=EC=84=B8=EB=AF=BC?=
 <89172499+semnil5202@users.noreply.github.com>
Date: Fri, 10 May 2024 06:12:01 +0900
Subject: [PATCH] =?UTF-8?q?Refactor/#155:=20=EC=83=9D=EC=84=B1=20=EC=8B=9C?=
 =?UTF-8?q?=EA=B0=84=20=ED=8F=AC=EB=A9=A7=ED=8C=85=20n=EB=B6=84=20?=
 =?UTF-8?q?=EC=A0=84,=20=EB=B0=A9=EA=B8=88=20=EC=A0=84=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80=20(#156)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* refactor: 방금 전, n분 전 형식 추가

* docs: n분 전 형식이 반영된 댓글 및 답글 사진 사용

* fix: 닉네임 우측에 콤마 표시 제거
---
 README.md                                 |  2 +-
 src/pages/Feed/Feed.page.tsx              |  2 +-
 src/pages/Feed/utils/formatCommentDate.ts | 29 +++++++++++++++--------
 3 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/README.md b/README.md
index d9f178e2..99372712 100644
--- a/README.md
+++ b/README.md
@@ -29,7 +29,7 @@
 
 관심이 가는 게시글에 댓글과 답글을 남겨보세요. 프로필을 클릭해서 상대방의 세부 역량을 쉽게 파악할 수도 있어요. 😇
 
-![image](https://github.com/ConceptBe/conceptbe-frontend/assets/89172499/fc1c60f2-aac8-4bbc-9670-b9f95e4275fe)
+![image](https://github.com/ConceptBe/conceptbe-frontend/assets/89172499/15fbe1e3-0143-4857-be7f-df28c2600fa8)
 
 ### 상세한 프로필 설정
 
diff --git a/src/pages/Feed/Feed.page.tsx b/src/pages/Feed/Feed.page.tsx
index 796cc5f6..809dbb79 100644
--- a/src/pages/Feed/Feed.page.tsx
+++ b/src/pages/Feed/Feed.page.tsx
@@ -44,7 +44,7 @@ const Feed = () => {
           <Spacer size={27} />
           <FeedFixTextWrapper>
             <Text font="suit22sb" color="w1">
-              {getUserNickname() || 'Guest1234'},
+              {getUserNickname() || 'Guest1234'}
             </Text>
             <Text font="suit22r" color="w1">
               님,
diff --git a/src/pages/Feed/utils/formatCommentDate.ts b/src/pages/Feed/utils/formatCommentDate.ts
index 53147324..a4b36a98 100644
--- a/src/pages/Feed/utils/formatCommentDate.ts
+++ b/src/pages/Feed/utils/formatCommentDate.ts
@@ -2,20 +2,29 @@ export function formatCommentDate(date: string) {
   const now = new Date();
   const commentDate = new Date(date);
   const diffTime = Math.abs(now.getTime() - commentDate.getTime());
+  const diffMinutes = Math.floor(diffTime / (1000 * 60));
   const diffHours = Math.floor(diffTime / (1000 * 60 * 60));
 
+  if (diffMinutes < 1) {
+    return '방금 전';
+  }
+
+  if (diffMinutes < 60) {
+    return `${diffMinutes}분 전`;
+  }
+
   if (diffHours < 24) {
     return `${diffHours}시간 전`;
-  } else {
-    const year = commentDate.getFullYear();
-    const month = commentDate.getMonth() + 1; // getMonth()는 0부터 시작하므로 +1
-    const day = commentDate.getDate();
-    const hours = commentDate.getHours();
-    const minutes = commentDate.getMinutes();
+  }
 
-    // 숫자가 한 자리일 때 앞에 0을 붙여주는 함수
-    const padZero = (num: number) => num.toString().padStart(2, '0');
+  const year = commentDate.getFullYear();
+  const month = commentDate.getMonth() + 1; // getMonth()는 0부터 시작하므로 +1
+  const day = commentDate.getDate();
+  const hours = commentDate.getHours();
+  const minutes = commentDate.getMinutes();
 
-    return `${year}.${padZero(month)}.${padZero(day)} ${padZero(hours)}:${padZero(minutes)}`;
-  }
+  // 숫자가 한 자리일 때 앞에 0을 붙여주는 함수
+  const padZero = (num: number) => num.toString().padStart(2, '0');
+
+  return `${year}.${padZero(month)}.${padZero(day)} ${padZero(hours)}:${padZero(minutes)}`;
 }