From 1afd2781818ef5cba0f018811f12cd8653da10b6 Mon Sep 17 00:00:00 2001
From: nsfisis <nsfisis@gmail.com>
Date: Thu, 20 Mar 2025 23:28:39 +0900
Subject: fix(frontend): fix state corruption

---
 frontend/app/routes/golf.$gameId.watch.tsx | 32 +++++++++++++++---------------
 1 file changed, 16 insertions(+), 16 deletions(-)

(limited to 'frontend/app/routes/golf.$gameId.watch.tsx')

diff --git a/frontend/app/routes/golf.$gameId.watch.tsx b/frontend/app/routes/golf.$gameId.watch.tsx
index 42bde52..cd01b17 100644
--- a/frontend/app/routes/golf.$gameId.watch.tsx
+++ b/frontend/app/routes/golf.$gameId.watch.tsx
@@ -1,4 +1,5 @@
-import { useHydrateAtoms } from "jotai/utils";
+import { Provider as JotaiProvider, createStore } from "jotai";
+import { useMemo } from "react";
 import type { LoaderFunctionArgs, MetaFunction } from "react-router";
 import { useLoaderData } from "react-router";
 import { ensureUserLoggedIn } from "../.server/auth";
@@ -9,12 +10,6 @@ import {
 	apiGetGameWatchRanking,
 } from "../api/client";
 import GolfWatchApp from "../components/GolfWatchApp";
-import {
-	rankingAtom,
-	setDurationSecondsAtom,
-	setGameStartedAtAtom,
-	setLatestGameStatesAtom,
-} from "../states/watch";
 
 export const meta: MetaFunction<typeof loader> = ({ data }) => [
 	{
@@ -57,16 +52,21 @@ export default function GolfWatch() {
 	const { apiAuthToken, game, ranking, gameStates } =
 		useLoaderData<typeof loader>();
 
-	useHydrateAtoms([
-		[rankingAtom, ranking],
-		[setDurationSecondsAtom, game.duration_seconds],
-		[setGameStartedAtAtom, game.started_at ?? null],
-		[setLatestGameStatesAtom, gameStates],
-	]);
+	const store = useMemo(() => {
+		void game.game_id;
+		return createStore();
+	}, [game.game_id]);
 
 	return (
-		<ApiAuthTokenContext.Provider value={apiAuthToken}>
-			<GolfWatchApp game={game} />
-		</ApiAuthTokenContext.Provider>
+		<JotaiProvider store={store}>
+			<ApiAuthTokenContext.Provider value={apiAuthToken}>
+				<GolfWatchApp
+					key={game.game_id}
+					game={game}
+					initialGameStates={gameStates}
+					initialRanking={ranking}
+				/>
+			</ApiAuthTokenContext.Provider>
+		</JotaiProvider>
 	);
 }
-- 
cgit v1.2.3-70-g09d2

