Feat:리뷰 조회 모달 api 연동

co-KKIRI · Apr 4, 2024 · 10a800d · 10a800d
1 parent d905dde
commit 10a800d
Showing 1 changed file with 9 additions and 5 deletions.
diff --git a/co-kkiri/src/components/modals/ReviewModal/index.tsx b/co-kkiri/src/components/modals/ReviewModal/index.tsx
@@ -16,7 +16,6 @@ export default function ReviewModal({ onClose }: ReviewModalProps) {
   const { id } = useParams();
   const postId = Number(id);
   const selectedEmojisRef = useRef<string[]>([]);
-  const { postTitle, postReviews, memberReviews, memberReviewComments } = TEAM_REVIEW_INFO;
 
   const randomPicker = () => {
     const availableEmojis = emojis.filter((emoji) => !selectedEmojisRef.current.includes(emoji));
@@ -28,6 +27,11 @@ export default function ReviewModal({ onClose }: ReviewModalProps) {
     return selectedEmoji;
   };
 
+  const { data } = useQuery({
+    queryKey: ["teamReview", postId],
+    queryFn: () => getReview(postId),
+  });
+
   return (
     <ModalLayout desktopWidth={430} mobileWidth={320} onClose={onClose} isCloseClickOutside>
       <S.Container>
@@ -40,28 +44,28 @@ export default function ReviewModal({ onClose }: ReviewModalProps) {
                 <img src={ICONS.arrowRightGray.src} alt={ICONS.arrowRightGray.alt} />
               </h6>
             </Link>
-            <p>{postTitle}</p>
+            <p>{data?.postTitle}</p>
           </S.ContentBox>
           <S.ContentBox>
             <h6>스터디 태그 모음</h6>
             <S.TagBox>
-              {postReviews.map((tag) => (
+              {data?.postReviews.map((tag) => (
                 <EvaluationChip key={tag.content} label={tag.content} evaluationWay={tag.type} />
               ))}
             </S.TagBox>
           </S.ContentBox>
           <S.ContentBox>
             <h6>내가 받은 태그</h6>
             <S.TagBox>
-              {memberReviews.map((tag) => (
+              {data?.memberReviews.map((tag) => (
                 <EvaluationChip key={tag.content} label={tag.content} evaluationWay={tag.type} />
               ))}
             </S.TagBox>
           </S.ContentBox>
           <S.ContentBox>
             <h6>팀원들의 한마디</h6>
             <S.CommentBox>
-              {memberReviewComments.map((memberComment) => (
+              {data?.memberReviewComments.map((memberComment) => (
                 <S.EmojiBox key={memberComment.comment}>
                   <S.Emoji>
                     <div>{randomPicker()}</div>