diff --git a/src/contexts/PartyContext.tsx b/src/contexts/PartyContext.tsx index e8ffc9d..370610e 100644 --- a/src/contexts/PartyContext.tsx +++ b/src/contexts/PartyContext.tsx @@ -23,10 +23,10 @@ export function PartyProvider({ session, children }: PartyProviderProps) { } } - session.socket?.on("party_state", handleSocketPartyState); + session.socket.on("party_state", handleSocketPartyState); return () => { - session.socket?.off("party_state", handleSocketPartyState); + session.socket.off("party_state", handleSocketPartyState); }; }); diff --git a/src/contexts/PlayerContext.tsx b/src/contexts/PlayerContext.tsx index ef19607..ea4a867 100644 --- a/src/contexts/PlayerContext.tsx +++ b/src/contexts/PlayerContext.tsx @@ -9,10 +9,12 @@ import useNetworkedState, { import Session, { SessionStatus } from "../network/Session"; import { PlayerState } from "../types/PlayerState"; -export const PlayerStateContext = - React.createContext(undefined); -export const PlayerUpdaterContext = - React.createContext | undefined>(undefined); +export const PlayerStateContext = React.createContext( + undefined +); +export const PlayerUpdaterContext = React.createContext< + SetNetworkedState | undefined +>(undefined); type PlayerProviderProps = { session: Session; @@ -104,13 +106,13 @@ export function PlayerProvider({ session, children }: PlayerProviderProps) { } session.on("status", handleSocketStatus); - session.socket?.on("connect", handleSocketConnect); - session.socket?.io.on("reconnect", handleSocketConnect); + session.socket.on("connect", handleSocketConnect); + session.socket.io.on("reconnect", handleSocketConnect); return () => { session.off("status", handleSocketStatus); - session.socket?.off("connect", handleSocketConnect); - session.socket?.io.off("reconnect", handleSocketConnect); + session.socket.off("connect", handleSocketConnect); + session.socket.io.off("reconnect", handleSocketConnect); }; }); diff --git a/src/hooks/useNetworkedState.ts b/src/hooks/useNetworkedState.ts index 8f201f6..7417767 100644 --- a/src/hooks/useNetworkedState.ts +++ b/src/hooks/useNetworkedState.ts @@ -60,7 +60,7 @@ function useNetworkedState( const debouncedState = useDebounce(state, debounceRate); const lastSyncedStateRef = useRef(); useEffect(() => { - if (session.socket && dirtyRef.current) { + if (dirtyRef.current) { // If partial updates enabled, send just the changes to the socket if ( lastSyncedStateRef.current && @@ -112,11 +112,11 @@ function useNetworkedState( }); } - session.socket?.on(eventName, handleSocketEvent); - session.socket?.on(`${eventName}_update`, handleSocketUpdateEvent); + session.socket.on(eventName, handleSocketEvent); + session.socket.on(`${eventName}_update`, handleSocketUpdateEvent); return () => { - session.socket?.off(eventName, handleSocketEvent); - session.socket?.off(`${eventName}_update`, handleSocketUpdateEvent); + session.socket.off(eventName, handleSocketEvent); + session.socket.off(`${eventName}_update`, handleSocketUpdateEvent); }; }, [session.socket, eventName, partialUpdatesKey]); diff --git a/src/network/NetworkedMapAndTokens.tsx b/src/network/NetworkedMapAndTokens.tsx index 997c53e..e6e09f9 100644 --- a/src/network/NetworkedMapAndTokens.tsx +++ b/src/network/NetworkedMapAndTokens.tsx @@ -202,12 +202,12 @@ function NetworkedMapAndTokens({ session }: { session: Session }) { ) { // Clear map before sending new one setCurrentMap(null); - session.socket?.emit("map", null); + session.socket.emit("map", null); setCurrentMapState(newMapState, true, true); setCurrentMap(newMap); - session.socket?.emit("map", newMap); + session.socket.emit("map", newMap); if (!newMap || !newMapState) { setAssetManifest(null, true, true); @@ -395,12 +395,12 @@ function NetworkedMapAndTokens({ session }: { session: Session }) { session.on("peerData", handlePeerData); session.on("peerDataProgress", handlePeerDataProgress); - session.socket?.on("map", handleSocketMap); + session.socket.on("map", handleSocketMap); return () => { session.off("peerData", handlePeerData); session.off("peerDataProgress", handlePeerDataProgress); - session.socket?.off("map", handleSocketMap); + session.socket.off("map", handleSocketMap); }; }); diff --git a/src/network/NetworkedMapPointer.tsx b/src/network/NetworkedMapPointer.tsx index cd44086..e0a5758 100644 --- a/src/network/NetworkedMapPointer.tsx +++ b/src/network/NetworkedMapPointer.tsx @@ -152,10 +152,10 @@ function NetworkedMapPointer({ session, active }: NetworkedMapPointerProps) { } } - session.socket?.on("player_pointer", handleSocketPlayerPointer); + session.socket.on("player_pointer", handleSocketPlayerPointer); return () => { - session.socket?.off("player_pointer", handleSocketPlayerPointer); + session.socket.off("player_pointer", handleSocketPlayerPointer); }; }, [session]); diff --git a/src/network/Session.ts b/src/network/Session.ts index a85b8ad..daac356 100644 --- a/src/network/Session.ts +++ b/src/network/Session.ts @@ -1,4 +1,4 @@ -import io, { Socket } from "socket.io-client"; +import io from "socket.io-client"; import msgParser from "socket.io-msgpack-parser"; import { EventEmitter } from "events"; @@ -32,10 +32,11 @@ export type PeerReply = (id: string, data: PeerData, chunkId?: string) => void; class Session extends EventEmitter { /** * The socket io connection - * - * @type {io.Socket} */ - socket?: Socket; + socket = io(process.env.REACT_APP_BROKER_URL!, { + withCredentials: true, + parser: msgParser, + }); /** * A mapping of socket ids to session peers @@ -45,7 +46,7 @@ class Session extends EventEmitter { peers: Record; get id() { - return this.socket?.id || ""; + return this.socket.id; } _iceServers: RTCIceServer[] = []; @@ -76,14 +77,6 @@ class Session extends EventEmitter { const data = await response.json(); this._iceServers = data.iceServers; - if (!process.env.REACT_APP_BROKER_URL) { - return; - } - this.socket = io(process.env.REACT_APP_BROKER_URL, { - withCredentials: true, - parser: msgParser, - }); - this.socket.on("player_joined", this._handlePlayerJoined.bind(this)); this.socket.on("player_left", this._handlePlayerLeft.bind(this)); this.socket.on("joined_game", this._handleJoinedGame.bind(this)); @@ -102,7 +95,7 @@ class Session extends EventEmitter { } disconnect() { - this.socket?.disconnect(); + this.socket.disconnect(); } /** @@ -191,7 +184,7 @@ class Session extends EventEmitter { this._gameId = gameId; this._password = password; - this.socket?.emit( + this.socket.emit( "join_game", gameId, password, @@ -224,7 +217,7 @@ class Session extends EventEmitter { }; const handleSignal = (signal: SignalData) => { - this.socket?.emit("signal", JSON.stringify({ to: peer.id, signal })); + this.socket.emit("signal", JSON.stringify({ to: peer.id, signal })); }; const handleConnect = () => { @@ -373,7 +366,7 @@ class Session extends EventEmitter { } _handleForceUpdate() { - this.socket?.disconnect(); + this.socket.disconnect(); this.emit("status", "needs_update"); } }