Initial clean state

packages/web/src/stores/manager.tsx

@@ -0,0 +1,39 @@
+import { Player } from "@rahoot/common/types/game"
+import { StatusDataMap } from "@rahoot/common/types/game/status"
+import { createStatus, Status } from "@rahoot/web/utils/createStatus"
+import { create } from "zustand"
+
+type ManagerStore<T> = {
+  gameId: string | null
+  status: Status<T> | null
+  players: Player[]
+
+  setGameId: (_gameId: string | null) => void
+  setStatus: <K extends keyof T>(_name: K, _data: T[K]) => void
+  resetStatus: () => void
+  setPlayers: (_players: Player[] | ((_prev: Player[]) => Player[])) => void
+
+  reset: () => void
+}
+
+const initialState = {
+  gameId: null,
+  status: null,
+  players: [],
+}
+
+export const useManagerStore = create<ManagerStore<StatusDataMap>>((set) => ({
+  ...initialState,
+
+  setGameId: (gameId) => set({ gameId }),
+
+  setStatus: (name, data) => set({ status: createStatus(name, data) }),
+  resetStatus: () => set({ status: null }),
+
+  setPlayers: (players) =>
+    set((state) => ({
+      players: typeof players === "function" ? players(state.players) : players,
+    })),
+
+  reset: () => set(initialState),
+}))

packages/web/src/stores/player.tsx

@@ -0,0 +1,82 @@
+import { StatusDataMap } from "@rahoot/common/types/game/status"
+import { createStatus, Status } from "@rahoot/web/utils/createStatus"
+import { create } from "zustand"
+
+type PlayerState = {
+  username?: string
+  points?: number
+}
+
+type PlayerStore<T> = {
+  gameId: string | null
+  player: PlayerState | null
+  status: Status<T> | null
+
+  setGameId: (_gameId: string | null) => void
+
+  setPlayer: (_state: PlayerState) => void
+  login: (_gameId: string) => void
+  join: (_username: string) => void
+  updatePoints: (_points: number) => void
+
+  setStatus: <K extends keyof T>(_name: K, _data: T[K]) => void
+
+  reset: () => void
+}
+
+const initialState = {
+  gameId: null,
+  player: null,
+  status: null,
+}
+
+export const usePlayerStore = create<PlayerStore<StatusDataMap>>((set) => ({
+  ...initialState,
+
+  setGameId: (gameId) => set({ gameId }),
+
+  setPlayer: (player: PlayerState) => {
+    try {
+      if (player.username) localStorage.setItem("last_username", player.username)
+      if (typeof player.points === "number") {
+        localStorage.setItem("last_points", String(player.points))
+      }
+    } catch {}
+    set({ player })
+  },
+  login: (username) =>
+    set((state) => {
+      try {
+        localStorage.setItem("last_username", username)
+      } catch {}
+      return {
+        player: { ...state.player, username },
+      }
+    }),
+
+  join: (gameId) => {
+    set((state) => ({
+      gameId,
+      player: { ...state.player, points: 0 },
+    }))
+  },
+
+  updatePoints: (points) => {
+    try {
+      localStorage.setItem("last_points", String(points))
+    } catch {}
+    set((state) => ({
+      player: { ...state.player, points },
+    }))
+  },
+
+  setStatus: (name, data) => set({ status: createStatus(name, data) }),
+
+  reset: () => {
+    try {
+      localStorage.removeItem("last_username")
+      localStorage.removeItem("last_points")
+    } catch {}
+    set(initialState)
+  },
+}))

packages/web/src/stores/question.tsx

@@ -0,0 +1,12 @@
+import { GameUpdateQuestion } from "@rahoot/common/types/game"
+import { create } from "zustand"
+
+type QuestionStore = {
+  questionStates: GameUpdateQuestion | null
+  setQuestionStates: (_state: GameUpdateQuestion | null) => void
+}
+
+export const useQuestionStore = create<QuestionStore>((set) => ({
+  questionStates: null,
+  setQuestionStates: (state) => set({ questionStates: state }),
+}))