If you try to circumvent react's effect logic, you're gonna have a bad time

client/src/components/Game.jsx

@@ -1,4 +1,4 @@
-import React from "react";
+import React, { useEffect } from "react";
 import {
   PRE_GAME,
   PRE_ROUND,
@@ -30,17 +30,19 @@ const paramRouter = {
 
 const Game = () => {
   const gameState = useGameState();
-  
-  const url = new URL(window.location.href);
-  for (let [param, value] of url.searchParams.entries()) {
-    const route = paramRouter[param];
-    if (route) {
-      url.searchParams.delete(param);
-      window.history.replaceState({}, document.title, url.href);
-      route(value);
-      break;
+
+  useEffect(() => {
+    const url = new URL(window.location.href);
+    for (let [param, value] of url.searchParams.entries()) {
+      const route = paramRouter[param];
+      if (route) {
+        url.searchParams.delete(param);
+        window.history.replaceState({}, document.title, url.href);
+        route(value);
+        break;
+      }
     }
-  }
+  }, []);
 
   const Screen = componentMap[gameState];
   return <Screen />

client/src/domain/gameStore.js

@@ -27,10 +27,7 @@ export const [
   gameState: PRE_GAME,
 }, {
   setPlayerName: ([set], playerName) => set({ playerName }),
-  goToLobby: ([set, get], gameId) => set({
-    gameId: gameId || get.gameId(),
-    gameState: PRE_ROUND,
-  }),
+  goToLobby: ([set], gameId) => set({ gameId, gameState: PRE_ROUND }),
   createGame: async ([set, get], timer) => {
     const name = get.playerName();
     const gameId = await createGame(name, timer);