diff --git a/src/pages/GameOver.tsx b/src/pages/GameOver.tsx index 66993dd..34777ad 100644 --- a/src/pages/GameOver.tsx +++ b/src/pages/GameOver.tsx @@ -1,5 +1,5 @@ import { useEffect, useState } from "react"; -import { useParams, useNavigate } from "react-router-dom"; +import { useParams, useNavigate, useLocation } from "react-router-dom"; import { Trophy, Home, Share2, RotateCcw, Clock, MapPin } from "lucide-react"; import * as Icons from "lucide-react"; import { useLiveQuery } from "dexie-react-hooks"; @@ -20,7 +20,13 @@ export default function GameOver() { const { sessionId } = useParams<{ sessionId: string }>(); const navigate = useNavigate(); const [session, setSession] = useState(null); - const [showCelebration, setShowCelebration] = useState(true); + // Only celebrate when arriving straight from the end of the game, never when + // browsing a finished game from the history. + const routerLocation = useLocation(); + const justFinished = Boolean( + (routerLocation.state as { justFinished?: boolean } | null)?.justFinished, + ); + const [showCelebration, setShowCelebration] = useState(justFinished); const startNewGame = useGameStore((state) => state.startNewGame); const gameConfig = useGameConfig(session?.gameId); @@ -47,6 +53,15 @@ export default function GameOver() { return () => clearTimeout(timer); }, [sessionId]); + // Consume the flag so reloading or coming back to this screen doesn't replay + // the celebration (history.state survives a page reload). + useEffect(() => { + if (justFinished) { + navigate(routerLocation.pathname, { replace: true, state: null }); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); + if (!session) return
Chargement...
; diff --git a/src/pages/PlayGame.tsx b/src/pages/PlayGame.tsx index 760aa87..ddbd9db 100644 --- a/src/pages/PlayGame.tsx +++ b/src/pages/PlayGame.tsx @@ -211,7 +211,9 @@ export default function PlayGame() { } await finishGame(winnerIds); - navigate(`/gameover/${activeSession.id}`); + // `justFinished` déclenche l'animation de victoire (une seule fois) : + // en venant de l'historique, l'écran de fin s'affiche sans célébration. + navigate(`/gameover/${activeSession.id}`, { state: { justFinished: true } }); }; const handleCancelGame = async () => {