feat(game): enhance game reconnection logic and improve reset messages

packages/web/src/stores/manager.tsx

@@ -5,7 +5,7 @@ import { create } from "zustand"
 
 type ManagerStore<T> = {
   gameId: string | null
-  status: Status<T>
+  status: Status<T> | null
   players: Player[]
 
   setGameId: (_gameId: string | null) => void
@@ -16,13 +16,9 @@ type ManagerStore<T> = {
   reset: () => void
 }
 
-const initialStatus = createStatus<StatusDataMap, "SHOW_ROOM">("SHOW_ROOM", {
-  text: "Waiting for the players",
-})
-
 const initialState = {
   gameId: null,
-  status: initialStatus,
+  status: null,
   players: [],
 }
 
@@ -32,7 +28,7 @@ export const useManagerStore = create<ManagerStore<StatusDataMap>>((set) => ({
   setGameId: (gameId) => set({ gameId }),
 
   setStatus: (name, data) => set({ status: createStatus(name, data) }),
-  resetStatus: () => set({ status: initialStatus }),
+  resetStatus: () => set({ status: null }),
 
   setPlayers: (players) => set({ players }),
 

packages/web/src/stores/player.tsx

@@ -10,7 +10,7 @@ type PlayerState = {
 type PlayerStore<T> = {
   gameId: string | null
   player: PlayerState | null
-  status: Status<T>
+  status: Status<T> | null
 
   setGameId: (_gameId: string | null) => void
 
@@ -24,14 +24,10 @@ type PlayerStore<T> = {
   reset: () => void
 }
 
-const initialStatus = createStatus<StatusDataMap, "WAIT">("WAIT", {
-  text: "Waiting for the players",
-})
-
 const initialState = {
   gameId: null,
   player: null,
-  status: initialStatus,
+  status: null,
 }
 
 export const usePlayerStore = create<PlayerStore<StatusDataMap>>((set) => ({

packages/web/src/stores/question.tsx

@@ -3,11 +3,10 @@ import { create } from "zustand"
 
 type QuestionStore = {
   questionStates: GameUpdateQuestion | null
-  setQuestionStates: (_state: GameUpdateQuestion) => void
+  setQuestionStates: (_state: GameUpdateQuestion | null) => void
 }
 
 export const useQuestionStore = create<QuestionStore>((set) => ({
   questionStates: null,
-  setQuestionStates: (state: GameUpdateQuestion) =>
-    set({ questionStates: state }),
+  setQuestionStates: (state) => set({ questionStates: state }),
 }))