fix(game): fix kickPlayer event to include gameId and improve reset message on player kick

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

@@ -1,6 +1,7 @@
 "use client"
 
 import { QuizzWithId } from "@rahoot/common/types/game"
+import { STATUS } from "@rahoot/common/types/game/status"
 import ManagerPassword from "@rahoot/web/components/game/create/ManagerPassword"
 import SelectQuizz from "@rahoot/web/components/game/create/SelectQuizz"
 import { useEvent, useSocket } from "@rahoot/web/contexts/socketProvider"
@@ -23,7 +24,7 @@ const Manager = () => {
 
   useEvent("manager:gameCreated", ({ gameId, inviteCode }) => {
     setGameId(gameId)
-    setStatus("SHOW_ROOM", { text: "Waiting for the players", inviteCode })
+    setStatus(STATUS.SHOW_ROOM, { text: "Waiting for the players", inviteCode })
     router.push(`/game/manager/${gameId}`)
   })
 

packages/web/src/app/game/[gameId]/page.tsx

@@ -44,11 +44,6 @@ const Game = () => {
     }
   })
 
-  useEvent("game:kick", () => {
-    router.replace("/")
-    reset()
-  })
-
   useEvent("game:reset", (message) => {
     router.replace("/")
     reset()

packages/web/src/components/game/join/Username.tsx

@@ -1,5 +1,6 @@
 "use client"
 
+import { STATUS } from "@rahoot/common/types/game/status"
 import Button from "@rahoot/web/components/Button"
 import Form from "@rahoot/web/components/Form"
 import Input from "@rahoot/web/components/Input"
@@ -11,7 +12,7 @@ import { KeyboardEvent, useState } from "react"
 
 const Username = () => {
   const { socket } = useSocket()
-  const { gameId, login } = usePlayerStore()
+  const { gameId, login, setStatus } = usePlayerStore()
   const router = useRouter()
   const [username, setUsername] = useState("")
 
@@ -30,6 +31,7 @@ const Username = () => {
   }
 
   useEvent("game:successJoin", (gameId) => {
+    setStatus(STATUS.WAIT, { text: "Waiting for the players" })
     login(username)
 
     router.replace(`/game/${gameId}`)

packages/web/src/components/game/states/Room.tsx

@@ -11,6 +11,7 @@ type Props = {
 }
 
 const Room = ({ data: { text, inviteCode } }: Props) => {
+  const { gameId } = useManagerStore()
   const { socket } = useSocket()
   const { players } = useManagerStore()
   const [playerList, setPlayerList] = useState<Player[]>(players)
@@ -33,8 +34,13 @@ const Room = ({ data: { text, inviteCode } }: Props) => {
   })
 
   const handleKick = (playerId: string) => () => {
+    if (!gameId) {
+      return
+    }
+
     socket?.emit("manager:kickPlayer", {
-      data: { playerId },
+      gameId,
+      playerId,
     })
   }