adding resume game in manager page

packages/web/src/app/(auth)/manager/page.tsx

@@ -11,7 +11,7 @@ import Button from "@rahoot/web/components/Button"
 import { useEvent, useSocket } from "@rahoot/web/contexts/socketProvider"
 import { useManagerStore } from "@rahoot/web/stores/manager"
 import { useRouter } from "next/navigation"
-import { useState } from "react"
+import { useEffect, useState } from "react"
 
 const Manager = () => {
   const { gameId, setGameId, setStatus } = useManagerStore()
@@ -23,6 +23,7 @@ const Manager = () => {
   const [showEditor, setShowEditor] = useState(false)
   const [showMedia, setShowMedia] = useState(false)
   const [showTheme, setShowTheme] = useState(false)
+  const [resumeGameId, setResumeGameId] = useState<string | null>(null)
 
   useEvent("manager:quizzList", (quizzList) => {
     setIsAuth(true)
@@ -32,9 +33,20 @@ const Manager = () => {
   useEvent("manager:gameCreated", ({ gameId, inviteCode }) => {
     setGameId(gameId)
     setStatus(STATUS.SHOW_ROOM, { text: "Waiting for the players", inviteCode })
+    setResumeGameId(gameId)
     router.push(`/game/manager/${gameId}`)
   })
 
+  useEvent(
+    "manager:successReconnect",
+    ({ gameId, status, players, currentQuestion }) => {
+      setGameId(gameId)
+      setStatus(status.name, status.data)
+      setResumeGameId(gameId)
+      router.push(`/game/manager/${gameId}`)
+    },
+  )
+
   const handleAuth = (password: string) => {
     socket?.emit("manager:auth", password)
   }
@@ -46,6 +58,20 @@ const Manager = () => {
     socket?.emit("manager:setBreak", { gameId, active })
   }
 
+  const handleResume = () => {
+    if (!resumeGameId) return
+    socket?.emit("manager:reconnect", { gameId: resumeGameId })
+  }
+
+  useEffect(() => {
+    try {
+      const stored = localStorage.getItem("last_manager_game_id")
+      if (stored) {
+        setResumeGameId(stored)
+      }
+    } catch {}
+  }, [])
+
   if (!isAuth) {
     return <ManagerPassword onSubmit={handleAuth} />
   }
@@ -90,6 +116,8 @@ const Manager = () => {
       onManage={() => setShowEditor(true)}
       onMedia={() => setShowMedia(true)}
       onTheme={() => setShowTheme(true)}
+      resumeGameId={resumeGameId}
+      onResume={handleResume}
     />
   )
 }

packages/web/src/components/game/create/SelectQuizz.tsx

@@ -10,6 +10,8 @@ type Props = {
   onManage?: () => void
   onMedia?: () => void
   onTheme?: () => void
+  resumeGameId?: string | null
+  onResume?: () => void
 }
 
 const SelectQuizz = ({
@@ -18,6 +20,8 @@ const SelectQuizz = ({
   onManage,
   onMedia,
   onTheme,
+  resumeGameId,
+  onResume,
 }: Props) => {
   const [selected, setSelected] = useState<string | null>(null)
 
@@ -44,6 +48,14 @@ const SelectQuizz = ({
       <div className="flex items-center justify-between">
         <h1 className="text-2xl font-bold">Select a quizz</h1>
         <div className="flex items-center gap-2">
+          {resumeGameId && onResume && (
+            <button
+              className="rounded-md bg-amber-500 px-3 py-1 text-sm font-semibold text-white shadow"
+              onClick={onResume}
+            >
+              Resume game
+            </button>
+          )}
           {onMedia && (
             <button
               className="text-sm font-semibold text-gray-700 underline"

packages/web/src/stores/manager.tsx

@@ -25,7 +25,16 @@ const initialState = {
 export const useManagerStore = create<ManagerStore<StatusDataMap>>((set) => ({
   ...initialState,
 
-  setGameId: (gameId) => set({ gameId }),
+  setGameId: (gameId) => {
+    try {
+      if (gameId) {
+        localStorage.setItem("last_manager_game_id", gameId)
+      } else {
+        localStorage.removeItem("last_manager_game_id")
+      }
+    } catch {}
+    set({ gameId })
+  },
 
   setStatus: (name, data) => set({ status: createStatus(name, data) }),
   resetStatus: () => set({ status: null }),
@@ -35,5 +44,10 @@ export const useManagerStore = create<ManagerStore<StatusDataMap>>((set) => ({
       players: typeof players === "function" ? players(state.players) : players,
     })),
 
-  reset: () => set(initialState),
+  reset: () => {
+    try {
+      localStorage.removeItem("last_manager_game_id")
+    } catch {}
+    set(initialState)
+  },
 }))