Fix not hanging up when using the close button (EXA EXI) (#1840)

---------

Signed-off-by: Timo K <toger5@hotmail.de>

src/room/GroupCallView.tsx

@@ -218,17 +218,6 @@ export const GroupCallView: FC<Props> = ({
       );
 
       await leaveRTCSession(rtcSession);
-      if (widget) {
-        // we need to wait until the callEnded event is tracked on posthog.
-        // Otherwise the iFrame gets killed before the callEnded event got tracked.
-        await new Promise((resolve) => window.setTimeout(resolve, 10)); // 10ms
-        widget.api.setAlwaysOnScreen(false);
-        PosthogAnalytics.instance.logout();
-
-        // we will always send the hangup event after the memberships have been updated
-        // calling leaveRTCSession.
-        widget.api.transport.send(ElementWidgetActions.HangupCall, {});
-      }
 
       if (
         !isPasswordlessUser &&
@@ -246,9 +235,8 @@ export const GroupCallView: FC<Props> = ({
       const onHangup = async (
         ev: CustomEvent<IWidgetApiRequest>,
       ): Promise<void> => {
-        leaveRTCSession(rtcSession);
         widget!.api.transport.reply(ev.detail, {});
-        widget!.api.setAlwaysOnScreen(false);
+        await leaveRTCSession(rtcSession);
       };
       widget.lazyActions.once(ElementWidgetActions.HangupCall, onHangup);
       return () => {

src/rtcSessionHelpers.ts

@@ -19,6 +19,7 @@ import { MatrixRTCSession } from "matrix-js-sdk/src/matrixrtc/MatrixRTCSession";
 import { PosthogAnalytics } from "./analytics/PosthogAnalytics";
 import { LivekitFocus } from "./livekit/LivekitFocus";
 import { Config } from "./config/Config";
+import { ElementWidgetActions, WidgetHelpers, widget } from "./widget";
 
 function makeFocus(livekitAlias: string): LivekitFocus {
   const urlFromConf = Config.get().livekit!.livekit_service_url;
@@ -47,9 +48,26 @@ export function enterRTCSession(rtcSession: MatrixRTCSession): void {
   rtcSession.joinRoomSession([makeFocus(livekitAlias)]);
 }
 
+const widgetPostHangupProcedure = async (
+  widget: WidgetHelpers,
+): Promise<void> => {
+  // we need to wait until the callEnded event is tracked on posthog.
+  // Otherwise the iFrame gets killed before the callEnded event got tracked.
+  await new Promise((resolve) => window.setTimeout(resolve, 10)); // 10ms
+  widget.api.setAlwaysOnScreen(false);
+  PosthogAnalytics.instance.logout();
+
+  // We send the hangup event after the memberships have been updated
+  // calling leaveRTCSession.
+  // We need to wait because this makes the client hosting this widget killing the IFrame.
+  widget.api.transport.send(ElementWidgetActions.HangupCall, {});
+};
+
 export async function leaveRTCSession(
   rtcSession: MatrixRTCSession,
 ): Promise<void> {
-  //groupCallOTelMembership?.onLeaveCall();
   await rtcSession.leaveRoomSession();
+  if (widget) {
+    await widgetPostHangupProcedure(widget);
+  }
 }

src/widget.ts

@@ -57,7 +57,7 @@ export interface ScreenshareStartData {
   desktopCapturerSourceId: string;
 }
 
-interface WidgetHelpers {
+export interface WidgetHelpers {
   api: WidgetApi;
   lazyActions: LazyEventEmitter;
   client: Promise<MatrixClient>;