From b0b3d87b5fc7b99108a50ee586ff2efa8a9396f8 Mon Sep 17 00:00:00 2001
From: Timo K <toger5@hotmail.de>
Date: Mon, 9 Oct 2023 19:44:52 +0200
Subject: [PATCH] Fix mute button not being in sync with actual video/audio
 feed. This happens if we toggle the button while waiting for updating the
 stream. It is prohibited by checking if the stream state is in sync after the
 update is done. Signed-off-by: Timo K <toger5@hotmail.de>

---
 src/livekit/useLiveKit.ts | 40 +++++++++++++++++++++++++--------------
 src/rtcSessionHelpers.ts  |  2 +-
 2 files changed, 27 insertions(+), 15 deletions(-)

diff --git a/src/livekit/useLiveKit.ts b/src/livekit/useLiveKit.ts
index bf12669c..cc9aefaf 100644
--- a/src/livekit/useLiveKit.ts
+++ b/src/livekit/useLiveKit.ts
@@ -137,20 +137,32 @@ export function useLiveKit(
     // and setting tracks to be enabled during this time causes errors.
     if (room !== undefined && connectionState === ConnectionState.Connected) {
       const participant = room.localParticipant;
-      if (participant.isMicrophoneEnabled !== muteStates.audio.enabled) {
-        participant
-          .setMicrophoneEnabled(muteStates.audio.enabled)
-          .catch((e) =>
-            logger.error("Failed to sync audio mute state with LiveKit", e)
-          );
-      }
-      if (participant.isCameraEnabled !== muteStates.video.enabled) {
-        participant
-          .setCameraEnabled(muteStates.video.enabled)
-          .catch((e) =>
-            logger.error("Failed to sync video mute state with LiveKit", e)
-          );
-      }
+
+      const syncMuteStateAudio = () => {
+        if (participant.isCameraEnabled !== muteStates.video.enabled) {
+          participant
+            .setCameraEnabled(muteStates.video.enabled)
+            .catch((e) =>
+              logger.error("Failed to sync video mute state with LiveKit", e)
+            )
+            // Run the check recursively. Because the user can update the state (presses mute button)
+            // while the device is enabling itself we need to check after we are done if its still in sync.
+            .then(() => syncMuteStateAudio());
+        }
+      };
+      const syncMuteStateVideo = () => {
+        if (participant.isMicrophoneEnabled !== muteStates.audio.enabled) {
+          participant
+            .setMicrophoneEnabled(muteStates.audio.enabled)
+            .catch((e) =>
+              logger.error("Failed to sync audio mute state with LiveKit", e)
+            )
+            // see above
+            .then(() => syncMuteStateVideo());
+        }
+      };
+      syncMuteStateAudio();
+      syncMuteStateVideo();
     }
   }, [room, muteStates, connectionState]);
 
diff --git a/src/rtcSessionHelpers.ts b/src/rtcSessionHelpers.ts
index 3cad5627..68baca6e 100644
--- a/src/rtcSessionHelpers.ts
+++ b/src/rtcSessionHelpers.ts
@@ -41,7 +41,7 @@ export function enterRTCSession(rtcSession: MatrixRTCSession) {
   // have started tracking by the time calls start getting created.
   //groupCallOTelMembership?.onJoinCall();
 
-  // right now we asume everything is a room-scoped call
+  // right now we assume everything is a room-scoped call
   const livekitAlias = rtcSession.room.roomId;
 
   rtcSession.joinRoomSession([makeFocus(livekitAlias)]);