From 5118bc084c22b30030142766dec9c49e1947a1ef Mon Sep 17 00:00:00 2001
From: Timo K <toger5@hotmail.de>
Date: Wed, 24 Jan 2024 17:23:02 +0100
Subject: [PATCH] add returnToLobby implement return to lobby Wait for making
 the widget sticky until connected

Signed-off-by: Timo K <toger5@hotmail.de>
---
 docs/url-params.md         | 10 ++++++++
 src/UrlParams.ts           |  6 +++++
 src/room/GroupCallView.tsx | 50 +++++++++++++++++++++-----------------
 src/room/InCallView.tsx    |  4 +--
 4 files changed, 46 insertions(+), 24 deletions(-)

diff --git a/docs/url-params.md b/docs/url-params.md
index 72b26fdd..266eee8f 100644
--- a/docs/url-params.md
+++ b/docs/url-params.md
@@ -189,3 +189,13 @@ with the join widget action.
 ```
 skipLobby: boolean; (default: false)
 ```
+
+**returnToLobby**
+Setting this flag makes element call show the lobby in widget mode after leaving
+a call.
+This is useful for video rooms.
+If set to false, the widget will show a blank page after leaving the call.
+
+```
+returnToLobby: boolean; (default: false)
+```
diff --git a/src/UrlParams.ts b/src/UrlParams.ts
index 68d10d7a..da2a8aae 100644
--- a/src/UrlParams.ts
+++ b/src/UrlParams.ts
@@ -125,6 +125,11 @@ export interface UrlParams {
    * with the join widget action.
    */
   skipLobby: boolean;
+  /**
+   * Setting this flag makes element call show the lobby after leaving a call.
+   * This is useful for video rooms.
+   */
+  returnToLobby: boolean;
 }
 
 // This is here as a stopgap, but what would be far nicer is a function that
@@ -223,6 +228,7 @@ export const getUrlParams = (
     allowIceFallback: parser.getFlagParam("allowIceFallback"),
     perParticipantE2EE: parser.getFlagParam("perParticipantE2EE"),
     skipLobby: parser.getFlagParam("skipLobby"),
+    returnToLobby: parser.getFlagParam("returnToLobby"),
   };
 };
 
diff --git a/src/room/GroupCallView.tsx b/src/room/GroupCallView.tsx
index d1dc6257..93625a3b 100644
--- a/src/room/GroupCallView.tsx
+++ b/src/room/GroupCallView.tsx
@@ -87,7 +87,7 @@ export const GroupCallView: FC<Props> = ({
   const roomName = useRoomName(rtcSession.room);
   const roomAvatar = useRoomAvatar(rtcSession.room);
   const e2eeSharedKey = useRoomSharedKey(rtcSession.room.roomId);
-  const { perParticipantE2EE } = useUrlParams();
+  const { perParticipantE2EE, returnToLobby } = useUrlParams();
   const roomEncrypted =
     useIsRoomE2EE(rtcSession.room.roomId) || perParticipantE2EE;
 
@@ -205,13 +205,8 @@ export const GroupCallView: FC<Props> = ({
       };
     } else if (widget && !preload && skipLobby) {
       // No lobby and no preload: we enter the rtc session right away
-      widget.api.setAlwaysOnScreen(true);
       defaultDeviceSetup({ audioInput: null, videoInput: null });
       enterRTCSession(rtcSession, perParticipantE2EE);
-    } else if (widget && !skipLobby) {
-      // If we show the lobby, we still need to set the widget to sticky
-      // joining will be triggered by the lobby view.
-      widget!.api.setAlwaysOnScreen(true);
     }
   }, [rtcSession, preload, skipLobby, perParticipantE2EE]);
 
@@ -249,6 +244,9 @@ export const GroupCallView: FC<Props> = ({
 
   useEffect(() => {
     if (widget && isJoined) {
+      // set widget to sticky once joined.
+      widget!.api.setAlwaysOnScreen(true);
+
       const onHangup = async (
         ev: CustomEvent<IWidgetApiRequest>,
       ): Promise<void> => {
@@ -322,6 +320,21 @@ export const GroupCallView: FC<Props> = ({
       onDismiss={onDismissInviteModal}
     />
   );
+  const lobbyView = (
+    <>
+      {shareModal}
+      <LobbyView
+        client={client}
+        matrixInfo={matrixInfo}
+        muteStates={muteStates}
+        onEnter={(): void => enterRTCSession(rtcSession, perParticipantE2EE)}
+        confineToRoom={confineToRoom}
+        hideHeader={hideHeader}
+        participantCount={participantCount}
+        onShareClick={onShareClick}
+      />
+    </>
+  );
 
   if (isJoined) {
     return (
@@ -342,6 +355,8 @@ export const GroupCallView: FC<Props> = ({
       </>
     );
   } else if (left && widget === null) {
+    // Left in SPA mode:
+
     // The call ended view is shown for two reasons: prompting guests to create
     // an account, and prompting users that have opted into analytics to provide
     // feedback. We don't show a feedback prompt to widget users however (at
@@ -369,23 +384,14 @@ export const GroupCallView: FC<Props> = ({
       // LobbyView again which would open capture devices again.
       return null;
     }
+  } else if (left && widget !== null) {
+    // Left in widget mode:
+    if (!returnToLobby) {
+      return null;
+    }
   } else if (preload || skipLobby) {
     return null;
-  } else {
-    return (
-      <>
-        {shareModal}
-        <LobbyView
-          client={client}
-          matrixInfo={matrixInfo}
-          muteStates={muteStates}
-          onEnter={(): void => enterRTCSession(rtcSession, perParticipantE2EE)}
-          confineToRoom={confineToRoom}
-          hideHeader={hideHeader}
-          participantCount={participantCount}
-          onShareClick={onShareClick}
-        />
-      </>
-    );
   }
+
+  return lobbyView;
 };
diff --git a/src/room/InCallView.tsx b/src/room/InCallView.tsx
index 5f6ff4a2..f48315d5 100644
--- a/src/room/InCallView.tsx
+++ b/src/room/InCallView.tsx
@@ -397,8 +397,8 @@ export const InCallView: FC<InCallViewProps> = subscribe(
             showControls
               ? styles.footer
               : hideHeader
-                ? [styles.footer, styles.footerHidden]
-                : [styles.footer, styles.footerThin],
+              ? [styles.footer, styles.footerHidden]
+              : [styles.footer, styles.footerThin],
           )}
         >
           {!mobile && !hideHeader && (