From c570ade1b79a92d1bf313612054f185cdaf93d9c Mon Sep 17 00:00:00 2001 From: joanShim Date: Tue, 14 Nov 2023 00:03:17 +0900 Subject: [PATCH 1/2] =?UTF-8?q?Feat:=20=ED=88=AC=ED=91=9C=EA=B2=B0?= =?UTF-8?q?=EA=B3=BC=20=EC=BD=98=EC=86=94=EA=B5=AC=ED=98=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .husky/pre-commit | 0 package-lock.json | 2 +- package.json | 2 +- src/components/Game/GameChat/index.tsx | 26 +++-- src/components/Game/Vote/CalculateVote.tsx | 109 +++++++-------------- src/components/Game/Vote/index.tsx | 14 ++- 6 files changed, 65 insertions(+), 88 deletions(-) mode change 100644 => 100755 .husky/pre-commit diff --git a/.husky/pre-commit b/.husky/pre-commit old mode 100644 new mode 100755 diff --git a/package-lock.json b/package-lock.json index 6149e571..4c64e426 100644 --- a/package-lock.json +++ b/package-lock.json @@ -43,7 +43,7 @@ "eslint-plugin-prettier": "^5.0.1", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.3", - "husky": "^8.0.0", + "husky": "^8.0.3", "terser": "^5.24.0", "typescript": "^5.0.2", "vite": "^4.4.5" diff --git a/package.json b/package.json index 7b86358f..01509b49 100644 --- a/package.json +++ b/package.json @@ -47,7 +47,7 @@ "eslint-plugin-prettier": "^5.0.1", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.3", - "husky": "^8.0.0", + "husky": "^8.0.3", "terser": "^5.24.0", "typescript": "^5.0.2", "vite": "^4.4.5" diff --git a/src/components/Game/GameChat/index.tsx b/src/components/Game/GameChat/index.tsx index 128dd00e..21396464 100644 --- a/src/components/Game/GameChat/index.tsx +++ b/src/components/Game/GameChat/index.tsx @@ -49,6 +49,7 @@ const GameChat: React.FC = ({ gameId, gameData }) => { console.log("users: ", users); const [showVoteModal, setShowVoteModal] = useState(false); const [selectedUser, setSelectedUser] = useState(""); + const [voteResult, setVoteResult] = useState(null); const handleOpenVoteModal = () => { setShowVoteModal(true); @@ -59,12 +60,9 @@ const GameChat: React.FC = ({ gameId, gameData }) => { setSelectedUser(selectedUser); }; - // const handleCalculateVoteClose = (finalLiar: string) => { - // // finalLiar를 이용하여 특정 동작 수행 (SystemChat) - - // // 선택한 결과 초기화 - // setSelectedUser(""); - // }; + const handleVoteResult = (result: string | null) => { + setVoteResult(result); + }; useEffect(() => { socket.on("message-to-client", (messageObject) => { @@ -95,7 +93,8 @@ const GameChat: React.FC = ({ gameId, gameData }) => { setMessages([...messages, { id: "system", text: systemMessage }]); setUsers(responseData.users); }); - }, []); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [setMessages, socket]); // 메시지 값 변화시(소켓 통신 시) 콘솔에 메시지 데이터 출력 useEffect(() => { @@ -135,10 +134,19 @@ const GameChat: React.FC = ({ gameId, gameData }) => { 투표하기 {showVoteModal && ( - + )} {selectedUser && ( - + + )} + {voteResult !== null && ( + )} diff --git a/src/components/Game/Vote/CalculateVote.tsx b/src/components/Game/Vote/CalculateVote.tsx index 3d3612f1..44ac7d6a 100644 --- a/src/components/Game/Vote/CalculateVote.tsx +++ b/src/components/Game/Vote/CalculateVote.tsx @@ -1,82 +1,41 @@ -import React, { useState, useEffect } from "react"; -import { - Button, - Modal, - ModalOverlay, - ModalContent, - ModalHeader, - ModalCloseButton, - ModalBody, - ModalFooter, - Text, -} from "@chakra-ui/react"; -import useFireFetch from "../../../hooks/useFireFetch"; - -interface CalculateVoteProps { - voteResults: string; - onClose: (finalLiar: string) => void; - gameId: string; +interface Vote { + by: string; + liar: string; } -const CalculateVote: React.FC = ({ - voteResults, - onClose, - gameId, -}) => { - const [finalLiar, setFinalLiar] = useState(""); - const fireFetch = useFireFetch(); - - // 투표 결과 계산 로직 - useEffect(() => { - const calculateFinalLiar = async () => { - const gameData = await fireFetch.useGetSome("game", "id", gameId); - const { users, votedFor } = gameData.data[0]; - - const votesCount: Record = {}; - users.forEach((user: string) => { - if (votedFor.includes(user)) { - votesCount[user] = (votesCount[user] || 0) + 1; - } - }); - - let maxVotes = 0; - for (const user in votesCount) { - if (votesCount[user] > maxVotes) { - maxVotes = votesCount[user]; - setFinalLiar(user); - } - } - }; - - calculateFinalLiar(); - }, [voteResults, gameId, fireFetch]); +interface GameData { + id: string; + users: string[]; + votedFor: Vote[]; +} - // 투표 결과 계산 후 최종 라이어를 부모 컴포넌트로 전달 - useEffect(() => { - if (finalLiar) { - onClose(finalLiar); +const calculateVote = (gameData: GameData): string | null => { + if (gameData.votedFor.length !== gameData.users.length) { + console.log( + `투표가 진행중입니다: ${gameData.votedFor.length} / ${gameData.users.length}`, + ); + return null; + } + + const voteCount: Record = {}; + gameData.votedFor.forEach((vote) => { + const liarId = vote.liar; + console.log("liarId:" + liarId); + voteCount[liarId] = (voteCount[liarId] || 0) + 1; + }); + + let maxCount = 0; + let maxId: string | null = null; + + for (const id in voteCount) { + if (voteCount[id] > maxCount) { + maxCount = voteCount[id]; + maxId = id; + console.log("maxId", maxId, maxCount + "표"); } - }, [finalLiar, onClose]); + } - return ( - {}}> - - - 투표 결과 계산 중 - - - 투표 결과 계산 중입니다... - - - {finalLiar && ( - - )} - - - - ); + return maxId; }; -export default CalculateVote; +export default calculateVote; diff --git a/src/components/Game/Vote/index.tsx b/src/components/Game/Vote/index.tsx index a7216940..035d9836 100644 --- a/src/components/Game/Vote/index.tsx +++ b/src/components/Game/Vote/index.tsx @@ -14,14 +14,17 @@ import { } from "@chakra-ui/react"; import useFireFetch from "../../../hooks/useFireFetch"; import { arrayUnion } from "firebase/firestore"; +import calculateVote from "./CalculateVote"; interface GameData { id: string; users: string[]; + votedFor: { by: string; liar: string }[]; } interface VoteProps { onClose: (selectedUser: string) => void; + onVoteResult: (result: string | null) => void; gameData: GameData; } @@ -31,6 +34,8 @@ const Vote: React.FC = ({ }): React.ReactElement => { const [selectedUser, setSelectedUser] = useState(""); const fireFetch = useFireFetch(); + const fetchData = fireFetch.useGetSome("game", "id", gameData.id) + .data[0] as GameData; const storedToken = localStorage.getItem("token"); const tokenData = storedToken ? JSON.parse(storedToken) : null; @@ -40,12 +45,17 @@ const Vote: React.FC = ({ }; const handleVoteSubmit = () => { - if (selectedUser !== null) { + if (selectedUser !== "") { const myId = tokenData.id; fireFetch.updateData("game", gameData.id, { votedFor: arrayUnion({ by: myId, liar: selectedUser }), }); - console.log(selectedUser + "에 투표했습니다."); + + console.log("fetchData", fetchData); + const voteResult = calculateVote(fetchData); + + console.log("Vote result: " + voteResult); + onClose(selectedUser); } }; From fcbf2abb668cd7418e8fc3450e1767f808c85183 Mon Sep 17 00:00:00 2001 From: joanShim Date: Tue, 14 Nov 2023 00:18:47 +0900 Subject: [PATCH 2/2] =?UTF-8?q?Feat:=20user.id=20=EB=A6=AC=EC=BD=94?= =?UTF-8?q?=EC=9D=BC=EB=A1=9C=20=EB=B0=9B=EC=95=84=EC=98=A4=EA=B8=B0=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/Game/Vote/index.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/Game/Vote/index.tsx b/src/components/Game/Vote/index.tsx index 035d9836..b2dde57c 100644 --- a/src/components/Game/Vote/index.tsx +++ b/src/components/Game/Vote/index.tsx @@ -15,6 +15,8 @@ import { import useFireFetch from "../../../hooks/useFireFetch"; import { arrayUnion } from "firebase/firestore"; import calculateVote from "./CalculateVote"; +import { useRecoilValue } from "recoil"; +import { userState } from "../../../recoil/atoms/userState"; interface GameData { id: string; @@ -37,8 +39,7 @@ const Vote: React.FC = ({ const fetchData = fireFetch.useGetSome("game", "id", gameData.id) .data[0] as GameData; - const storedToken = localStorage.getItem("token"); - const tokenData = storedToken ? JSON.parse(storedToken) : null; + const user = useRecoilValue(userState); const handleUserChange = (value: string) => { setSelectedUser(value); @@ -46,9 +47,8 @@ const Vote: React.FC = ({ const handleVoteSubmit = () => { if (selectedUser !== "") { - const myId = tokenData.id; fireFetch.updateData("game", gameData.id, { - votedFor: arrayUnion({ by: myId, liar: selectedUser }), + votedFor: arrayUnion({ by: user.id, liar: selectedUser }), }); console.log("fetchData", fetchData);