hopefully fixed issue with game end screen not getting populated prop…

…erly
Timtam · Apr 11, 2024 · 4c6943f · 4c6943f
1 parent 059cd2a
commit 4c6943f
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 33 deletions.
diff --git a/client/package-lock.json b/client/package-lock.json
diff --git a/client/package.json b/client/package.json
@@ -13,7 +13,6 @@
     "dependencies": {
         "@uidotdev/usehooks": "^2.4.1",
         "bootstrap": "^5.3.3",
-        "deepcopy": "^2.1.0",
         "howler": "^2.2.4",
         "i18next": "^23.10.1",
         "i18next-browser-languagedetector": "^7.2.1",

diff --git a/client/src/pages/game.tsx b/client/src/pages/game.tsx
@@ -1,5 +1,4 @@
 import { useLocalStorage } from "@uidotdev/usehooks"
-import deepcopy from "deepcopy"
 import { Howl } from "howler"
 import { useEffect, useMemo } from "react"
 import Button from "react-bootstrap/Button"
@@ -85,13 +84,6 @@ export function Game() {
         eventSource.addEventListener("change_state", (e) => {
             let ge = GameEvent.parse(JSON.parse(e.data))
 
-            setGame((g) => {
-                g.state = ge.state as GameState
-                g.hit = ge.hit ?? null
-
-                if (ge.players !== undefined) g.players = ge.players
-            })
-
             if (ge.state === GameState.Guessing) {
                 setHitSrc(`/api/games/${game.id}/hit?key=${Math.random()}`)
             } else if (ge.state === GameState.Open) {
@@ -115,6 +107,13 @@ export function Game() {
                     hYouFail.play()
                 }
             }
+
+            setGame((g) => {
+                g.state = ge.state as GameState
+                g.hit = ge.hit ?? null
+
+                if (ge.players !== undefined) g.players = ge.players
+            })
         })
 
         eventSource.addEventListener("join", (e) => {
@@ -186,7 +185,7 @@ export function Game() {
     }, [])
 
     useEffect(() => {
-        setShowHits(Array.from({ length: 5 }, () => false))
+        setShowHits(Array.from({ length: game.players.length }, () => false))
     }, [game])
 
     const canStartOrStopGame = (): boolean => {
@@ -419,11 +418,21 @@ export function Game() {
                           : t("cannotSkipHit")}
             </Button>
             <SlotSelector game={game} />
-            {gameEnded ? (
+            {gameEnded !== undefined ? (
                 <GameEndScreen
-                    game={deepcopy(game)}
+                    game={game}
                     show={gameEnded}
-                    onHide={() => setGameEnded(false)}
+                    onHide={() => {
+                        setGameEnded(false)
+                        setGame((g) => {
+                            g.players = g.players.map((p) => {
+                                p.hits = []
+                                p.tokens = 0
+                                p.guess = null
+                                return p
+                            })
+                        })
+                    }}
                 />
             ) : (
                 ""