Avoid duplicate sessions across devices/browsers

src/ClientContext.jsx

@@ -182,12 +182,21 @@ export function ClientProvider({ children }) {
   }, [history]);
 
   useEffect(() => {
-    if ("BroadcastChannel" in window) {
+    if (client) {
       const loadTime = Date.now();
-      const broadcastChannel = new BroadcastChannel("matrix-video-chat");
 
-      function onMessage({ data }) {
+      const onToDeviceEvent = (event) => {
-        if (data.load !== undefined && data.load > loadTime) {
+        if (event.getType() !== "org.matrix.call_duplicate_session") {
+          return;
+        }
+
+        const content = event.getContent();
+
+        if (content.session_id === client.getSessionId()) {
+          return;
+        }
+
+        if (content.timestamp > loadTime) {
           if (client) {
             client.stopClient();
           }
@@ -199,13 +208,18 @@ export function ClientProvider({ children }) {
             ),
           }));
         }
-      }
+      };
 
-      broadcastChannel.addEventListener("message", onMessage);
+      client.on("toDeviceEvent", onToDeviceEvent);
-      broadcastChannel.postMessage({ load: loadTime });
+
+      client.sendToDevice("org.matrix.call_duplicate_session", {
+        [client.getUserId()]: {
+          "*": { session_id: client.getSessionId(), timestamp: loadTime },
+        },
+      });
 
       return () => {
-        broadcastChannel.removeEventListener("message", onMessage);
+        client.removeListener("toDeviceEvent", onToDeviceEvent);
       };
     }
   }, [client]);