From 60004709162b063600690b089fb132b31c9107a6 Mon Sep 17 00:00:00 2001 From: pildrums Date: Thu, 7 Mar 2024 18:53:23 +0900 Subject: [PATCH 1/7] =?UTF-8?q?Fix:=20mutation=20=EC=9D=B4=EB=A6=84=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD=20-=20post=20->=20postComment?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/comment/Comment.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/comment/Comment.tsx b/src/components/comment/Comment.tsx index 3eed8835..b75f7e5c 100644 --- a/src/components/comment/Comment.tsx +++ b/src/components/comment/Comment.tsx @@ -41,7 +41,7 @@ function Comment() { refetchOnWindowFocus: false, }); - const { mutate: post } = useMutation(async () => postTodayComment(value), { + const { mutate: postComment } = useMutation(async () => postTodayComment(value), { onMutate: () => { setComments([ ...comments, @@ -74,9 +74,9 @@ function Comment() { const onSubmit = useCallback( async (event: FormEvent) => { event.preventDefault(); - post(); + postComment(); }, - [post], + [postComment], ); return ( From a68de2b33d5c7249f76bbb6626fd14354b94b283 Mon Sep 17 00:00:00 2001 From: pildrums Date: Thu, 7 Mar 2024 18:54:17 +0900 Subject: [PATCH 2/7] =?UTF-8?q?Fix:=20count=EB=A5=BC=20likeCount=EB=A1=9C?= =?UTF-8?q?=20=EC=9D=B4=EB=A6=84=20=EB=B3=80=EA=B2=BD=20-=20=EC=A2=8B?= =?UTF-8?q?=EC=95=84=EC=9A=94=20=EC=B9=B4=EC=9A=B4=ED=8A=B8=20props=20?= =?UTF-8?q?=EC=9D=B4=EB=A6=84=EC=9D=84=20likeCount=EB=A1=9C=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/comment/CommentList.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/comment/CommentList.tsx b/src/components/comment/CommentList.tsx index 1bf78b9e..f4f9d607 100644 --- a/src/components/comment/CommentList.tsx +++ b/src/components/comment/CommentList.tsx @@ -24,7 +24,7 @@ function CommentList({ teamName={item.teamName} comment={item.content} createdAt={item.createdAt} - count={item.likeCount} + likeCount={item.likeCount} replyId={item.replyId} setComments={setComments} queryClient={queryClient} From 3c2206409b22de7998a10440a43b28b3fbdde68c Mon Sep 17 00:00:00 2001 From: pildrums Date: Thu, 7 Mar 2024 18:56:36 +0900 Subject: [PATCH 3/7] =?UTF-8?q?Feature:=20=EC=A2=8B=EC=95=84=EC=9A=94=20?= =?UTF-8?q?=EA=B8=B0=EB=8A=A5=20API=20=EC=9E=91=EC=84=B1=20-=20=EC=A2=8B?= =?UTF-8?q?=EC=95=84=EC=9A=94=20=EA=B8=B0=EB=8A=A5=20API=20=EC=97=B0?= =?UTF-8?q?=EB=8F=99=20=EC=99=84=EB=A3=8C=20-=20=EC=B6=94=ED=9B=84=20?= =?UTF-8?q?=EC=A2=8B=EC=95=84=EC=9A=94=20=EC=82=AD=EC=A0=9C=20API=20?= =?UTF-8?q?=EC=9E=91=EC=84=B1=20=EC=98=88=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/lib/api/todayAPI.ts | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/src/lib/api/todayAPI.ts b/src/lib/api/todayAPI.ts index 8c266574..94024c1c 100644 --- a/src/lib/api/todayAPI.ts +++ b/src/lib/api/todayAPI.ts @@ -86,3 +86,21 @@ export const removeTodayComment = (replyId: number) => { console.error(e); } }; + +// 댓글 좋아요 +export const likeTodayComment = (replyId: number) => { + try { + const requestBody = { + replyId: replyId, + }; + const res = fetchData( + `games/daily-reply/${replyId}/like`, + "post", + requestBody, + ); + console.warn(res); + return res; + } catch (e) { + console.error(e); + } +}; From d115826c33abb4992fa68a66db4c21c8f15fa038 Mon Sep 17 00:00:00 2001 From: pildrums Date: Thu, 7 Mar 2024 18:58:31 +0900 Subject: [PATCH 4/7] =?UTF-8?q?Fix:=20data=EC=9D=98=20=EC=9D=B4=EB=A6=84?= =?UTF-8?q?=EC=9D=84=20todayData=EB=A1=9C=20=EC=9D=B4=EB=A6=84=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD=20-=20data=EA=B0=80=20=EC=A4=91=EB=B3=B5=EB=90=98?= =?UTF-8?q?=EC=84=9C=20=EC=82=AC=EC=9A=A9=EB=90=98=EB=8A=94=20=EA=B2=83?= =?UTF-8?q?=EC=9D=84=20=EB=A7=89=EA=B8=B0=20=EC=9C=84=ED=95=B4=20todatData?= =?UTF-8?q?=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/today/Today.tsx | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/components/today/Today.tsx b/src/components/today/Today.tsx index afbeba3b..9f599478 100644 --- a/src/components/today/Today.tsx +++ b/src/components/today/Today.tsx @@ -30,7 +30,7 @@ export interface TodayMatchData { function Today() { const [game, setGame] = useState([]); - useQuery({ + const { data: todayData = game } = useQuery({ queryKey: ["today"], queryFn: () => todayGames()?.then((res) => { @@ -39,10 +39,12 @@ function Today() { refetchOnWindowFocus: false, }); + console.warn(todayData); + return (
- +
); From c9eb592c2ef176acc39cd47d4eb0ca9abd87fc76 Mon Sep 17 00:00:00 2001 From: pildrums Date: Thu, 7 Mar 2024 19:03:30 +0900 Subject: [PATCH 5/7] =?UTF-8?q?Fix:=20gameId=20props=EB=A1=9C=20=EC=83=88?= =?UTF-8?q?=EB=A1=9C=20=EC=A0=84=EB=8B=AC=20-=20=EC=98=A4=EB=8A=98?= =?UTF-8?q?=EC=9D=98=20=EC=8A=B9=EB=B6=80=EC=98=88=EC=B8=A1=20=ED=8C=80=20?= =?UTF-8?q?=EC=84=A0=ED=83=9D=20=EC=8B=9C=20gameId=20=EA=B0=92=20=ED=95=84?= =?UTF-8?q?=EC=9A=94=20-=20todayData=20=EB=82=B4=EB=B6=80=EC=97=90=20?= =?UTF-8?q?=EC=9E=88=EB=8A=94=20gameId=EB=A5=BC=20ScoreListItem=EC=9C=BC?= =?UTF-8?q?=EB=A1=9C=20=EC=A0=84=EB=8B=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/today/ScoreList.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/today/ScoreList.tsx b/src/components/today/ScoreList.tsx index 75408e7c..f37036a7 100644 --- a/src/components/today/ScoreList.tsx +++ b/src/components/today/ScoreList.tsx @@ -18,6 +18,7 @@ function ScoreList({ game }: ScoreListProps) { homeTeam={item.homeTeam} awayTeam={item.awayTeam} gameTime={item.gameTime} + gameId={item.gameId} /> ))} From 20987619d095014eb82fad6b020afec53f46ab97 Mon Sep 17 00:00:00 2001 From: pildrums Date: Thu, 7 Mar 2024 19:05:31 +0900 Subject: [PATCH 6/7] =?UTF-8?q?Feature:=20=ED=8C=80=20=EC=84=A0=ED=83=9D?= =?UTF-8?q?=20api=20=EC=97=B0=EB=8F=99=20=EC=A4=91=20-=20useMutation?= =?UTF-8?q?=EC=9D=84=20=EC=9D=B4=EC=9A=A9=ED=95=9C=20=ED=99=88=20=ED=8C=80?= =?UTF-8?q?,=20=EC=9B=90=EC=A0=95=20=ED=8C=80=20=EC=84=A0=ED=83=9D=20api?= =?UTF-8?q?=20=EC=97=B0=EB=8F=99=20=EC=99=84=EB=A3=8C=20-=20=ED=98=84?= =?UTF-8?q?=EC=9E=AC=20=EC=84=A0=ED=83=9D=EC=9D=84=20=ED=95=98=EA=B3=A0=20?= =?UTF-8?q?=EC=83=88=EB=A1=9C=EA=B3=A0=EC=B9=A8=EC=9D=84=20=ED=96=88?= =?UTF-8?q?=EC=9D=84=20=EC=8B=9C=EC=97=90=20=EC=84=A0=ED=83=9D=20UI?= =?UTF-8?q?=EA=B0=80=20=EC=B4=88=EA=B8=B0=ED=99=94=EB=90=98=EB=8A=94=20?= =?UTF-8?q?=EB=AC=B8=EC=A0=9C=20=EB=B0=9C=EC=83=9D(=ED=95=B4=EA=B2=B0=20?= =?UTF-8?q?=EC=A4=91)=20-=20api=20=EC=9E=91=EB=8F=99=EC=97=90=EB=8A=94=20?= =?UTF-8?q?=EB=AC=B8=EC=A0=9C=20=EC=97=86=EC=9D=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/today/ScoreListItem.tsx | 73 ++++++++++++++++++++++---- 1 file changed, 62 insertions(+), 11 deletions(-) diff --git a/src/components/today/ScoreListItem.tsx b/src/components/today/ScoreListItem.tsx index 5f7de1e8..0d4ea8e7 100644 --- a/src/components/today/ScoreListItem.tsx +++ b/src/components/today/ScoreListItem.tsx @@ -9,24 +9,75 @@ import Title from "../common/Title"; import { TodayMatchData } from "./Today"; import { getAwayLogo, getHomeLogo } from "@/lib/util/getLogo"; import { gameDate } from "@/lib/util/getGameTime"; +import { deleteTodayGameVote, todayGameVote } from "@/lib/api/todayAPI"; +import { useMutation } from "react-query"; // Interface interface ScoreListItemProps extends TodayMatchData {} // Component -function ScoreListItem({ homeTeam, awayTeam, gameTime }: ScoreListItemProps) { +function ScoreListItem({ + homeTeam, + awayTeam, + gameTime, + gameId, +}: ScoreListItemProps) { const [selectHome, setSelectHome] = useState(false); const [selectAway, setSelectAway] = useState(false); + const [voteHome, setVoteHome] = useState(homeTeam.voteRatio); + const [voteAway, setVoteAway] = useState(awayTeam.voteRatio); - const onClickLeft = useCallback(() => { + const { mutate: home } = useMutation( + async () => todayGameVote(gameId as number, homeTeam.id), + { + onMutate: () => { + console.warn("홈 팀 선택 완료!"); + }, + }, + ); + + const { mutate: homeDelete } = useMutation( + async () => deleteTodayGameVote(gameId as number), + { + onMutate: () => { + console.warn("홈 팀 삭제 완료"); + }, + }, + ); + + const { mutate: away } = useMutation( + async () => todayGameVote(gameId as number, awayTeam.id), + { + onMutate: () => { + console.warn("원정 팀 선택 완료!"); + }, + }, + ); + + const { mutate: awayDelete } = useMutation( + async () => deleteTodayGameVote(gameId as number), + { + onMutate: () => { + console.warn("원정 팀 삭제 완료"); + }, + }, + ); + + const onClickHome = useCallback(() => { + // Toggle select home setSelectHome(!selectHome); setSelectAway(false); - }, [selectHome]); + !selectHome ? home() : homeDelete(); + setVoteHome(homeTeam.voteRatio); + }, [home, homeDelete, selectHome, homeTeam.voteRatio]); - const onClickRight = useCallback(() => { + const onClickAway = useCallback(() => { + // Toggle select away setSelectAway(!selectAway); setSelectHome(false); - }, [selectAway]); + !selectAway ? away() : awayDelete(); + setVoteAway(awayTeam.voteRatio); + }, [away, awayDelete, selectAway, awayTeam.voteRatio]); return ( <> @@ -38,12 +89,12 @@ function ScoreListItem({ homeTeam, awayTeam, gameTime }: ScoreListItemProps) { className={classNames( `score-item-block__left ${selectHome ? "active-left" : ""}`, )} - onClick={onClickLeft} + onClick={onClickHome} >
lions{homeTeam.teamName} )} - {homeTeam.voteRatio}% + {voteHome}%
lions{awayTeam.teamName} )} - {awayTeam.voteRatio}% + {voteAway}%
From 7479187bf84177596037b46044819997d388efda Mon Sep 17 00:00:00 2001 From: pildrums Date: Thu, 7 Mar 2024 19:10:59 +0900 Subject: [PATCH 7/7] =?UTF-8?q?Feature:=20=EB=8C=93=EA=B8=80=20=EC=82=AD?= =?UTF-8?q?=EC=A0=9C=20=EA=B8=B0=EB=8A=A5=20=EA=B5=AC=ED=98=84=20=EC=99=84?= =?UTF-8?q?=EB=A3=8C=20-=20mutate=20=ED=95=A8=EC=88=98=20=EC=9D=B4?= =?UTF-8?q?=EB=A6=84=EC=9D=84=20removeComment=EB=A1=9C=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD=20-=20useMutation=EC=9C=BC=EB=A1=9C=20=EB=8C=93?= =?UTF-8?q?=EA=B8=80=20=EC=82=AD=EC=A0=9C=20API=20=ED=95=A8=EC=88=98=20?= =?UTF-8?q?=EA=B5=AC=ED=98=84=20=EC=99=84=EB=A3=8C=20-=20onRemove=20?= =?UTF-8?q?=EC=9D=B4=EB=B2=A4=ED=8A=B8=20=ED=95=A8=EC=88=98=20=EA=B5=AC?= =?UTF-8?q?=ED=98=84=20=EC=99=84=EB=A3=8C=20-=20useCallback=EC=9D=84=20?= =?UTF-8?q?=EC=9D=B4=EC=9A=A9=ED=95=B4=EC=84=9C=20=EB=A6=AC=EC=95=A1?= =?UTF-8?q?=ED=8A=B8=EA=B0=80=20=ED=95=A8=EC=88=98=EB=A5=BC=20=EC=A0=80?= =?UTF-8?q?=EC=9E=A5=ED=95=98=EA=B3=A0=20=EC=9D=98=EC=A1=B4=EC=84=B1=20?= =?UTF-8?q?=EB=B0=B0=EC=97=B4=EC=9D=B4=20=EB=B0=94=EB=80=8C=EC=A7=80=20?= =?UTF-8?q?=EC=95=8A=EC=9C=BC=EB=A9=B4=20=ED=95=A8=EC=88=98=EB=A5=BC=20?= =?UTF-8?q?=EC=9E=AC=EC=83=9D=EC=84=B1=ED=95=98=EB=8A=94=20=EA=B2=83?= =?UTF-8?q?=EC=9D=84=20=EB=A7=89=EC=95=84=EC=84=9C=20=ED=9A=A8=EC=9C=A8?= =?UTF-8?q?=EC=84=B1=20=ED=99=95=EB=8C=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/comment/CommentListItem.tsx | 32 ++++++++++++---------- 1 file changed, 17 insertions(+), 15 deletions(-) diff --git a/src/components/comment/CommentListItem.tsx b/src/components/comment/CommentListItem.tsx index 33df2c4f..3df43f4d 100644 --- a/src/components/comment/CommentListItem.tsx +++ b/src/components/comment/CommentListItem.tsx @@ -17,7 +17,7 @@ interface CommentListItemProps { teamName: string; comment: string; createdAt?: string; - count?: number; + likeCount?: number; replyId?: number; setComments: Dispatch>; queryClient: QueryClient; @@ -28,25 +28,17 @@ function CommentListItem({ teamName, comment, createdAt, - count, + likeCount, replyId, setComments, }: CommentListItemProps) { const [visibleReply, setVisibleReply] = useState(false); const [visibleReplyList, setVisibleReplyList] = useState(false); const [like, setLike] = useState(false); + // const [count = likeCount, setCount] = useState(0); const [visibleBalloon, setVisibleBalloon] = useState(false); - const onVisible = () => { - setVisibleReply(!visibleReply); - setVisibleReplyList(!visibleReplyList); - }; - - const onLike = () => { - setLike(!like); - }; - - const { mutate: remove } = useMutation( + const { mutate: removeComment } = useMutation( async () => removeTodayComment(replyId as number), { onMutate: (commentId: number) => { @@ -58,14 +50,24 @@ function CommentListItem({ }, ); + const onVisible = () => { + setVisibleReply(!visibleReply); + setVisibleReplyList(!visibleReplyList); + }; + + // 좋아요 기능 작업 중 + const onLike = () => { + setLike(!like); + }; + const onBalloon = useCallback(() => { setVisibleBalloon(!visibleBalloon); }, [visibleBalloon]); const onRemove = useCallback(() => { - remove(replyId as number); + removeComment(replyId as number); setVisibleBalloon(false); - }, [remove, replyId]); + }, [removeComment, replyId]); return ( <> @@ -101,7 +103,7 @@ function CommentListItem({
좋아요 - {count} + {likeCount}