prisma experiment

packages/client/src/components/Game.tsx

@@ -10,31 +10,33 @@ export const GameContext = createContext<{
 }>();
 
 export default (props: { instanceId: number }) => {
-	const [gameState, { refetch }] = createResource(() =>
+	const [gameState, { refetch, mutate }] = createResource(() =>
 		api
 			.gameState({ gameId: props.instanceId.toString() })
 			.get()
 			.then((res) => res.data as GameState)
 	);
 
-	const setGameState = (state: GameState) =>
-		api
+	const setGameState = (state: GameState) => {
+		mutate(state);
+		return api
 			.gameState({ gameId: props.instanceId.toString() })
 			.put({
 				gameState: state,
 			})
 			.then(refetch);
+	};
 
 	return (
 		<GameContext.Provider value={{ gameState, setGameState }}>
-			<Show when={gameState() != undefined}>
+			<Show when={gameState.latest != undefined}>
 				<div
 					class="full column center"
 					style={{ "row-gap": "20px", "font-size": "32px" }}
 				>
 					<div class="full center">
 						<Pile
-							pile={gameState()!.deck}
+							pile={gameState.latest!.deck}
 							style={{ cursor: "pointer" }}
 							onClick={() => {
 								const [drawn, ...rest] = gameState()!.deck;
@@ -45,7 +47,7 @@ export default (props: { instanceId: number }) => {
 							}}
 						/>
 					</div>
-					<Hand hand={gameState()!.hand} />
+					<Hand hand={gameState.latest!.hand} />
 				</div>
 			</Show>
 		</GameContext.Provider>