Add better leave call behavior

src/ConferenceCallManager.js

@@ -406,6 +406,22 @@ export class ConferenceCallManager extends EventEmitter {
   };
 
   leaveCall() {
+    const userId = this.client.getUserId();
+    const currentMemberState = this.room.currentState.getStateEvents(
+      "m.room.member",
+      userId
+    );
+
+    this.client.sendStateEvent(
+      this.roomId,
+      "m.room.member",
+      {
+        ...currentMemberState.getContent(),
+        [CONF_PARTICIPANT]: null,
+      },
+      userId
+    );
+
     for (const participant of this.participants) {
       if (!participant.local && participant.call) {
         participant.call.hangup("user_hangup", false);
@@ -416,6 +432,7 @@ export class ConferenceCallManager extends EventEmitter {
     this.participants = [this.localParticipant];
     this.localParticipant.feed = null;
     this.localParticipant.call = null;
+
     this.emit("participants_changed");
   }
 }

src/ConferenceCallManagerHooks.js

@@ -116,6 +116,18 @@ export function useVideoRoom(manager, roomId, timeout = 5000) {
     error: undefined,
   });
 
+  useEffect(() => {
+    function onBeforeUnload(event) {
+      manager.leaveCall();
+    }
+
+    window.addEventListener("beforeunload", onBeforeUnload);
+
+    return () => {
+      window.removeEventListener("beforeunload", onBeforeUnload);
+    };
+  }, [manager]);
+
   useEffect(() => {
     setState((prevState) => ({
       ...prevState,
@@ -169,6 +181,7 @@ export function useVideoRoom(manager, roomId, timeout = 5000) {
 
     return () => {
       manager.client.removeListener("Room", roomCallback);
+      manager.leaveCall();
       clearTimeout(timeoutId);
     };
   }, [roomId]);