From 4728804a33533d0788742384da21b33945e4ef18 Mon Sep 17 00:00:00 2001
From: Robin Townsend <robin@robin.town>
Date: Thu, 13 Oct 2022 10:49:16 -0400
Subject: [PATCH] Leave audio elements unmuted regardless of mute state

---
 src/video-grid/AudioContainer.tsx | 23 +++++++++++------------
 1 file changed, 11 insertions(+), 12 deletions(-)

diff --git a/src/video-grid/AudioContainer.tsx b/src/video-grid/AudioContainer.tsx
index 63a2feeb..7cda8576 100644
--- a/src/video-grid/AudioContainer.tsx
+++ b/src/video-grid/AudioContainer.tsx
@@ -14,7 +14,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import React, { useEffect, useRef } from "react";
+import React, { FC, useEffect, useRef } from "react";
 
 import { Participant } from "../room/InCallView";
 import { useCallFeed } from "./useCallFeed";
@@ -29,19 +29,22 @@ interface AudioForParticipantProps {
   audioDestination: AudioNode;
 }
 
-export function AudioForParticipant({
+export const AudioForParticipant: FC<AudioForParticipantProps> = ({
   item,
   audioContext,
   audioDestination,
-}: AudioForParticipantProps): JSX.Element {
-  const { stream, localVolume, audioMuted } = useCallFeed(item.callFeed);
+}) => {
+  const { stream, localVolume } = useCallFeed(item.callFeed);
   const [audioTrackCount] = useMediaStreamTrackCount(stream);
 
   const gainNodeRef = useRef<GainNode>();
   const sourceRef = useRef<MediaStreamAudioSourceNode>();
 
   useEffect(() => {
-    if (!item.isLocal && audioContext && !audioMuted && audioTrackCount > 0) {
+    // We don't compare the audioMuted flag of useCallFeed here, since unmuting
+    // depends on to-device messages which may lag behind the audio actually
+    // starting to flow over the network
+    if (!item.isLocal && audioContext && audioTrackCount > 0) {
       if (!gainNodeRef.current) {
         gainNodeRef.current = new GainNode(audioContext, {
           gain: localVolume,
@@ -68,12 +71,11 @@ export function AudioForParticipant({
     audioDestination,
     stream,
     localVolume,
-    audioMuted,
     audioTrackCount,
   ]);
 
   return null;
-}
+};
 
 interface AudioContainerProps {
   items: Participant[];
@@ -81,10 +83,7 @@ interface AudioContainerProps {
   audioDestination: AudioNode;
 }
 
-export function AudioContainer({
-  items,
-  ...rest
-}: AudioContainerProps): JSX.Element {
+export const AudioContainer: FC<AudioContainerProps> = ({ items, ...rest }) => {
   return (
     <>
       {items
@@ -94,4 +93,4 @@ export function AudioContainer({
         ))}
     </>
   );
-}
+};