share WebSocket send via Zustand store, prevent duplicate connections

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

packages/client/src/hooks/use-websocket.ts

@@ -30,6 +30,7 @@ export function useWebSocket(roomCode: string) {
 		reset,
 		setGameState,
 		lockPredictions,
+		setSend,
 	} = useRoomStore()
 
 	const send = useCallback((message: ClientMessage) => {
@@ -38,6 +39,10 @@ export function useWebSocket(roomCode: string) {
 		}
 	}, [])
 
+	useEffect(() => {
+		setSend(send)
+	}, [send, setSend])
+
 	useEffect(() => {
 		const stored = getStoredSession()
 		const sessionId = stored?.roomCode === roomCode ? stored.sessionId : null
@@ -110,7 +115,7 @@ export function useWebSocket(roomCode: string) {
 			ws.close()
 			reset()
 		}
-	}, [roomCode, setRoom, setMySessionId, setConnectionStatus, updatePlayerConnected, addPlayer, setAct, reset, setGameState, lockPredictions])
+	}, [roomCode, setRoom, setMySessionId, setConnectionStatus, updatePlayerConnected, addPlayer, setAct, reset, setGameState, lockPredictions, setSend])
 
 	return { send }
 }

packages/client/src/stores/room-store.ts

@@ -1,11 +1,12 @@
 import { create } from "zustand"
-import type { RoomState, Player, GameState } from "@celebrate-esc/shared"
+import type { RoomState, Player, GameState, ClientMessage } from "@celebrate-esc/shared"
 
 interface RoomStore {
 	room: RoomState | null
 	mySessionId: string | null
 	connectionStatus: "disconnected" | "connecting" | "connected"
 	gameState: GameState | null
+	send: (message: ClientMessage) => void
 
 	setRoom: (room: RoomState) => void
 	setMySessionId: (sessionId: string) => void
@@ -15,14 +16,18 @@ interface RoomStore {
 	setAct: (act: RoomState["currentAct"]) => void
 	setGameState: (gameState: GameState) => void
 	lockPredictions: () => void
+	setSend: (send: (message: ClientMessage) => void) => void
 	reset: () => void
 }
 
+const noop = () => {}
+
 export const useRoomStore = create<RoomStore>((set) => ({
 	room: null,
 	mySessionId: null,
 	connectionStatus: "disconnected",
 	gameState: null,
+	send: noop,
 
 	setRoom: (room) => set({ room }),
 	setMySessionId: (sessionId) => set({ mySessionId: sessionId }),
@@ -67,5 +72,7 @@ export const useRoomStore = create<RoomStore>((set) => ({
 			}
 		}),
 
-	reset: () => set({ room: null, mySessionId: null, connectionStatus: "disconnected", gameState: null }),
+	setSend: (send) => set({ send }),
+
+	reset: () => set({ room: null, mySessionId: null, connectionStatus: "disconnected", gameState: null, send: noop }),
 }))