🚨 Fix: 알림 생성 전달 오류 해결

src/pages/notice/Notice.tsx

@@ -46,6 +46,7 @@ const Notice = () => {
           }}
         />
       </Header>
+      {list.length < 1 && <div>알림이 없습니다.</div>}
       <NoticeList list={list} />
     </NoticePage>
   );

src/pages/notice/components/NoticeItem/NoticeItem.style.ts

@@ -5,6 +5,7 @@ const NoticeItemContainer = styled.div`
   justify-content: flex-start;
   padding: 10px;
   border-bottom: 0.5px solid ${({ theme }) => theme.color['greyLight']};
+  line-height: 1.5;
   margin-bottom: 10px;
 `;
 
@@ -22,6 +23,8 @@ const NoticeContent = styled.div`
 `;
 
 const Message = styled.div`
+  display: flex;
+  align-items: center;
   font-weight: 700;
   font-size: 0.8rem;
   color: ${({ theme }) => theme.color['black']};

src/pages/notice/components/NoticeItem/NoticeItem.tsx

@@ -65,10 +65,7 @@ const NoticeItem = ({
         />
       </ProfileImage>
       <NoticeContent>
-        <Message>
-          <span>{authorName}</span>
-          {typeToMessage(type)}
-        </Message>
+        <Message>{typeToMessage(type)}</Message>
         {type === NOTICE_TYPE.COMMENT && (
           <MessagePreview>
             {comment && comment.comment.length > 25

src/pages/notice/components/NoticeList/NoticeList.style.ts

@@ -1,7 +1,7 @@
 import styled from '@emotion/styled';
 
 const NoticeListContainer = styled.div`
-  height: calc(100% - 1.5rem);
+  height: calc(100% - 2rem);
   overflow-y: scroll;
 `;
 

src/pages/postDetail/PostDetail.tsx

@@ -39,6 +39,7 @@ const PostDetail = () => {
         createdAt={formatDate(data?.createdAt)}
       />
       <PostCommentInput
+        userId={data?.author._id}
         postId={postId}
         token={'Bearer ' + token}
         avatarSrc={image}
@@ -48,6 +49,7 @@ const PostDetail = () => {
         }}
       />
       <PostComments
+        userId={data?.author._id}
         postId={postId}
         currentUserId={_id}
         token={'Bearer ' + token}

src/pages/postDetail/components/PostCommentHeader.tsx

@@ -17,6 +17,7 @@ interface PostCommentHeaderProps {
   refetch: () => void;
   myLike: Like;
   postCommentCount: number;
+  userId?: string;
 }
 
 const PostCommentHeader = ({
@@ -25,6 +26,7 @@ const PostCommentHeader = ({
   refetch,
   myLike,
   likeCounts,
+  userId,
   postCommentCount = 0
 }: PostCommentHeaderProps) => {
   const [possibleMutateLike, setPossibleMutateLike] = useState(true);
@@ -34,12 +36,13 @@ const PostCommentHeader = ({
     },
     {
       onSuccess: (res) => {
-        postNotifications(token, {
-          notificationType: 'LIKE',
-          notificationTypeId: res._id,
-          userId: res.user,
-          postId: res.post
-        });
+        !myLike &&
+          postNotifications(token, {
+            notificationType: 'LIKE',
+            notificationTypeId: res._id,
+            userId: userId,
+            postId: res.post
+          });
       }
     }
   );

src/pages/postDetail/components/PostCommentInput.tsx

@@ -19,6 +19,7 @@ interface PostCommentInputProps {
   token: string;
   avatarSrc: string;
   userName: string;
+  userId?: string;
   refetch: () => void;
 }
 
@@ -27,6 +28,7 @@ const PostCommentInput = ({
   userName,
   token,
   postId,
+  userId,
   refetch
 }: PostCommentInputProps) => {
   const COMMENT_PLACEHOLDER = '댓글을 달아보세요.';
@@ -38,7 +40,7 @@ const PostCommentInput = ({
       postNotifications(token, {
         notificationType: 'COMMENT',
         notificationTypeId: res._id,
-        userId: res.author._id,
+        userId: userId,
         postId: res.post
       });
     }

src/pages/postDetail/components/PostComments.tsx

@@ -11,6 +11,7 @@ interface PostCommentsProps {
   refetch: () => void;
   myLike: Like;
   likeCounts: number;
+  userId?: string;
 }
 
 const PostComments = ({
@@ -20,11 +21,13 @@ const PostComments = ({
   refetch,
   comments,
   myLike,
-  likeCounts
+  likeCounts,
+  userId
 }: PostCommentsProps) => {
   return (
     <PostCommentsSection>
       <PostCommentHeader
+        userId={userId}
         postId={postId}
         token={token}
         refetch={refetch}