This component displays a waiting screen for guests who are waiting to be admitted by the host. It shows different UI based on the current status:
idle: Initial state before join attemptwaiting: Waiting for host to admitjoining: Host admitted, now connectingjoined: Successfully joined (component typically unmounts)rejected: Host denied entrytimeout: Wait time expirederror: An error occurredBasic usage:
<WaitingRoomGuest
status={waitStatus}
roomName="Team Meeting"
onCancel={() => navigate('/')}
/>
With timeout handling:
const [elapsedMs, setElapsedMs] = useState(0);
const TIMEOUT_MS = 300000; // 5 minutes
<WaitingRoomGuest
status={waitStatus}
roomName="Team Meeting"
elapsedTime={elapsedMs}
totalTimeout={TIMEOUT_MS}
onCancel={() => handleCancel()}
onExtendTimeout={() => setElapsedMs(0)}
onLeave={() => navigate('/')}
/>
WaitingRoomGuest - Guest waiting screen component.