fix: separate onVote

src/components/A/ATopicCard.tsx

@@ -16,25 +16,19 @@ import { getDateDiff } from '@utils/date';
 
 interface AlphaTopicCardProps extends TopicResponse {
   chip?: 'popular' | 'close';
+  onVote: (topicId: number, side: 'CHOICE_A' | 'CHOICE_B') => void;
 }
 
 const AlphaTopicCard = React.memo((props: AlphaTopicCardProps) => {
   const { BottomSheet: CommentSheet, toggleSheet } = useBottomSheet({});
-  const voteMutation = useVoteTopic({ side: 'TOPIC_A', sort: 'createdAt,DESC' });
   const [A, B] = props.choices;
 
   const handleCommentChipClick = () => {
     toggleSheet();
   };
 
   const handleVote = (side: 'CHOICE_A' | 'CHOICE_B') => {
-    if (props.selectedOption === null) {
-      voteMutation.mutate({
-        topicId: props.topicId,
-        choiceOption: side,
-        votedAt: new Date().getTime() / 1000,
-      });
-    }
+    props.onVote(props.topicId, side);
   };
 
   return (

src/routes/A/ATopics.tsx

@@ -1,6 +1,7 @@
 import { ChangeEvent, useState } from 'react';
 
 import useTopics from '@apis/topic/useTopics';
+import useVoteTopic from '@apis/topic/useVoteTopic';
 import ATopicCard from '@components/A/ATopicCard';
 import { Col, Row } from '@components/commons/Flex/Flex';
 import Layout from '@components/commons/Layout/Layout';
@@ -15,6 +16,7 @@ import { Container } from './ATopics.styles';
 
 const ATopics = () => {
   const { data } = useTopics({ side: 'TOPIC_A', sort: 'createdAt,DESC' });
+  const voteMutation = useVoteTopic({ side: 'TOPIC_A', sort: 'createdAt,DESC' });
   const [topicFilter, setTopicFilter] = useState('진행중');
   const [isMineOnly, setIsMineOnly] = useState(false);
   const [isLatest, setIsLatest] = useState(true);
@@ -25,6 +27,14 @@ const ATopics = () => {
     setTopicFilter(e.target.value);
   };
 
+  const handleVote = (topicId: number, side: 'CHOICE_A' | 'CHOICE_B') => {
+    voteMutation.mutate({
+      topicId: topicId,
+      choiceOption: side,
+      votedAt: new Date().getTime() / 1000,
+    });
+  };
+
   return (
     <Layout
       hasBottomNavigation
@@ -88,6 +98,7 @@ const ATopics = () => {
                 selectedOption={topic.selectedOption}
                 commentCount={topic.commentCount}
                 createdAt={topic.createdAt}
+                onVote={handleVote}
               />
             );
           })}