refactor: 작가와 생성된 날짜 묶기

fun-eat · Apr 14, 2024 · c06af98 · c06af98
1 parent 266e366
commit c06af98
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 16 deletions.
diff --git a/src/components/Recipe/RecipeItem/RecipeItem.stories.tsx b/src/components/Recipe/RecipeItem/RecipeItem.stories.tsx
@@ -27,10 +27,7 @@ export const Default: Story = {
         <RecipeItem.ImageAndFavoriteButton />
         <div style={{ height: '8px' }} />
         <RecipeItem.Title />
-        <div style={{ display: 'flex', gap: '0.3rem' }}>
-          <RecipeItem.Author />
-          <RecipeItem.CreatedDate />
-        </div>
+        <RecipeItem.AuthorAndCreatedDate />
       </RecipeItem>
     );
   },
@@ -45,10 +42,7 @@ export const Recipe: Story = {
         </RecipeItem.ImageAndFavoriteButton>
         <div style={{ height: '8px' }} />
         <RecipeItem.Title />
-        <div style={{ display: 'flex', gap: '0.3rem' }}>
-          <RecipeItem.Author />
-          <RecipeItem.CreatedDate />
-        </div>
+        <RecipeItem.AuthorAndCreatedDate />
         <RecipeItem.Content />
       </RecipeItem>
     );
@@ -80,10 +74,7 @@ export const Search: Story = {
         </RecipeItem.ImageAndFavoriteButton>
         <div style={{ height: '8px' }} />
         <RecipeItem.Title />
-        <div style={{ display: 'flex', gap: '0.3rem' }}>
-          <RecipeItem.Author />
-          <RecipeItem.CreatedDate />
-        </div>
+        <RecipeItem.AuthorAndCreatedDate />
       </RecipeItem>
     );
   },

diff --git a/src/components/Recipe/RecipeItem/RecipeItem.tsx b/src/components/Recipe/RecipeItem/RecipeItem.tsx
@@ -128,13 +128,13 @@ const Author = () => {
   return <Text size="caption3" color="sub">{`${author.nickname} 님`}</Text>;
 };
 
-const CreatedDate = () => {
+const AuthorAndCreatedDate = () => {
   const { recipe } = useRecipeItemValueContext();
-  const { createdAt } = recipe;
+  const { author, createdAt } = recipe;
 
   return (
     <Text size="caption3" color="sub">
-      · {getRelativeDate(createdAt)}
+      {`${author.nickname} 님 · ${getRelativeDate(createdAt)}`}
     </Text>
   );
 };
@@ -155,7 +155,7 @@ RecipeItem.ProductButton = ProductButton;
 RecipeItem.ProductCircleButton = ProductCircleButton;
 RecipeItem.Title = Title;
 RecipeItem.Author = Author;
-RecipeItem.CreatedDate = CreatedDate;
+RecipeItem.AuthorAndCreatedDate = AuthorAndCreatedDate;
 RecipeItem.Content = Content;
 
 export default RecipeItem;