Wait for host state when joining a room before the host.
When a user tries to join a room that doesn't exist yet, they can wait for the host to create it.
Waiting for host screen:
function WaitingForHost() { const { isWaiting, roomName, timeout, elapsedTime } = useWaitForHost(); if (!isWaiting) return null; const remaining = timeout ? Math.max(0, timeout - elapsedTime) : null; return ( <div className="waiting-screen"> <h2>Waiting for host to start "{roomName}"</h2> {remaining !== null && ( <p>Timeout in {remaining} seconds...</p> )} </div> );} Copy
function WaitingForHost() { const { isWaiting, roomName, timeout, elapsedTime } = useWaitForHost(); if (!isWaiting) return null; const remaining = timeout ? Math.max(0, timeout - elapsedTime) : null; return ( <div className="waiting-screen"> <h2>Waiting for host to start "{roomName}"</h2> {remaining !== null && ( <p>Timeout in {remaining} seconds...</p> )} </div> );}
useWaitForHost for the wait for host hook
Seconds elapsed since started waiting
Whether currently waiting for the host
Name of the room waiting for
Timeout in seconds, null if no timeout
Wait for host state when joining a room before the host.
Remarks
When a user tries to join a room that doesn't exist yet, they can wait for the host to create it.
Example
Waiting for host screen:
See
useWaitForHost for the wait for host hook