From 0c0fa41521bbc6040d21ce4013165cb02c801e0f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=A0=84=EC=A7=84=ED=98=B8?= <gino9940@gmail.com>
Date: Mon, 19 Feb 2024 15:02:51 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20comment=EC=97=90=20choice=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80=ED=95=B4=EC=84=9C=20=EC=84=A0=ED=83=9D=EC=A7=80=20?=
 =?UTF-8?q?=EB=B0=98=EC=98=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Home/Comment/Comment.tsx             | 12 +++++++++---
 src/components/Home/TopicComments/TopicComments.tsx |  4 +++-
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/components/Home/Comment/Comment.tsx b/src/components/Home/Comment/Comment.tsx
index b7d97ac..4bdc410 100644
--- a/src/components/Home/Comment/Comment.tsx
+++ b/src/components/Home/Comment/Comment.tsx
@@ -7,6 +7,7 @@ import ProfileImg from '@components/commons/ProfileImg/ProfileImg';
 import Text from '@components/commons/Text/Text';
 import useModal from '@hooks/useModal/useModal';
 import { CommentResponse } from '@interfaces/api/comment';
+import { Choice } from '@interfaces/api/topic';
 
 import { useAuthStore } from '@store/auth';
 
@@ -18,9 +19,10 @@ import Thumbs from './Thumbs';
 
 interface CommentProps {
   comment: CommentResponse;
+  choices: Choice[];
 }
 
-const Comment = React.memo(({ comment }: CommentProps) => {
+const Comment = React.memo(({ comment, choices }: CommentProps) => {
   const { Modal, toggleModal } = useModal('action');
   const reactMutation = useReactComment(comment.topicId, comment.commentId);
   const memberId = useAuthStore((store) => store.memberId);
@@ -79,8 +81,12 @@ const Comment = React.memo(({ comment }: CommentProps) => {
                   {'·'} {distanceText}전
                 </Text>
               </Row>
-              <Text size={14} color={colors.A} weight={600}>
-                {comment.writersVotedOption}
+              <Text
+                size={14}
+                color={comment.writersVotedOption === 'CHOICE_A' ? colors.A_60 : colors.B_60}
+                weight={600}
+              >
+                {choices[comment.writersVotedOption === 'CHOICE_A' ? 0 : 1].content.text}
               </Text>
             </Col>
           </Row>
diff --git a/src/components/Home/TopicComments/TopicComments.tsx b/src/components/Home/TopicComments/TopicComments.tsx
index 13cd403..cd76bd1 100644
--- a/src/components/Home/TopicComments/TopicComments.tsx
+++ b/src/components/Home/TopicComments/TopicComments.tsx
@@ -45,7 +45,9 @@ const TopicComments = memo(({ topic }: TopicCommentsProps) => {
         </Row>
       </TopicCommentsHeader>
       <CommentsContainer>
-        {comments?.map((comment) => <Comment key={comment.commentId} comment={comment} />)}
+        {comments?.map((comment) => (
+          <Comment key={comment.commentId} comment={comment} choices={topic.choices} />
+        ))}
       </CommentsContainer>
       <CommentInputContainer>
         <CommentInput