From 3ac2aa8526419fe1a74c35c8f5c8b02e2e057def Mon Sep 17 00:00:00 2001 From: Will Hunt Date: Mon, 6 Oct 2025 19:52:58 +0100 Subject: [PATCH 1/5] Disable call button while the call is connecting. (#3531) * Disable call button while the call is connecting. * cleanup * fix * Update src/room/LobbyView.tsx Co-authored-by: Robin * fixup * appease linter --------- Co-authored-by: Robin --- src/room/GroupCallView.tsx | 2 +- src/room/LobbyView.tsx | 17 +++++++++++++---- src/room/RoomPage.tsx | 5 ++++- 3 files changed, 18 insertions(+), 6 deletions(-) diff --git a/src/room/GroupCallView.tsx b/src/room/GroupCallView.tsx index e4a6a997..248ce2dc 100644 --- a/src/room/GroupCallView.tsx +++ b/src/room/GroupCallView.tsx @@ -436,7 +436,7 @@ export const GroupCallView: FC = ({ client={client} matrixInfo={matrixInfo} muteStates={muteStates} - onEnter={() => void enterRTCSessionOrError(rtcSession)} + onEnter={async () => enterRTCSessionOrError(rtcSession)} confineToRoom={confineToRoom} hideHeader={header === HeaderStyle.None} participantCount={participantCount} diff --git a/src/room/LobbyView.tsx b/src/room/LobbyView.tsx index 391cb391..625a61b3 100644 --- a/src/room/LobbyView.tsx +++ b/src/room/LobbyView.tsx @@ -57,7 +57,7 @@ interface Props { client: MatrixClient; matrixInfo: MatrixInfo; muteStates: MuteStates; - onEnter: () => void; + onEnter: () => Promise; enterLabel?: JSX.Element | string; confineToRoom: boolean; hideHeader: boolean; @@ -193,6 +193,14 @@ export const LobbyView: FC = ({ useTrackProcessorSync(videoTrack); + const [waitingToEnter, setWaitingToEnter] = useState(false); + const onEnterCall = useCallback(() => { + setWaitingToEnter(true); + void onEnter().finally(() => setWaitingToEnter(false)); + }, [onEnter]); + + const waiting = waitingForInvite || waitingToEnter; + // TODO: Unify this component with InCallView, so we can get slick joining // animations and don't have to feel bad about reusing its CSS return ( @@ -222,11 +230,12 @@ export const LobbyView: FC = ({ >