From 587920d803c8cf335f7d0a5fd54caf2609e4aef8 Mon Sep 17 00:00:00 2001
From: Ben Weeks <ben@agora.io>
Date: Wed, 26 Feb 2025 09:16:18 +0000
Subject: [PATCH] avoid audio stopping when old user leaves RTC channel

---
 playground/src/components/Agent/AvatarTrulience.tsx | 10 ++++++++--
 playground/src/components/Dynamic/RTCCard.tsx       |  8 +++++---
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/playground/src/components/Agent/AvatarTrulience.tsx b/playground/src/components/Agent/AvatarTrulience.tsx
index 7d49eaee..0af1975c 100644
--- a/playground/src/components/Agent/AvatarTrulience.tsx
+++ b/playground/src/components/Agent/AvatarTrulience.tsx
@@ -8,10 +8,11 @@ import { Maximize, Minimize } from "lucide-react";
 import { cn } from "@/lib/utils";
 
 interface AvatarProps {
-  audioTrack?: IMicrophoneAudioTrack
+  audioTrack?: IMicrophoneAudioTrack,
+  localAudioTrack?: IMicrophoneAudioTrack
 }
 
-export default function Avatar({ audioTrack }: AvatarProps) {
+export default function Avatar({ audioTrack, localAudioTrack }: AvatarProps) {
   const agentConnected = useAppSelector((state) => state.global.agentConnected)
   const trulienceAvatarRef = useRef<TrulienceAvatar>(null)
 
@@ -70,6 +71,11 @@ export default function Avatar({ audioTrack }: AvatarProps) {
   // Update the Avatar’s audio stream whenever audioTrack or agentConnected changes
   useEffect(() => {
     if (trulienceAvatarRef.current) {
+
+      if (localAudioTrack) {
+        const stream = new MediaStream([localAudioTrack.getMediaStreamTrack()])
+        //trulienceAvatarRef.current.setLocalMediaStream(null)
+      }
       if (audioTrack && agentConnected) {
         const stream = new MediaStream([audioTrack.getMediaStreamTrack()])
         trulienceAvatarRef.current.setMediaStream(null)
diff --git a/playground/src/components/Dynamic/RTCCard.tsx b/playground/src/components/Dynamic/RTCCard.tsx
index 21c83c02..d0acd6d6 100644
--- a/playground/src/components/Dynamic/RTCCard.tsx
+++ b/playground/src/components/Dynamic/RTCCard.tsx
@@ -100,7 +100,9 @@ export default function RTCCard(props: { className?: string }) {
       // trulience SDK will play audio in synch with mouth
       user.audioTrack?.stop();
     }
-    setRemoteUser(user)
+    if (user.audioTrack) {
+      setRemoteUser(user)
+    } 
   }
 
   const onLocalTracksChanged = (tracks: IUserTracks) => {
@@ -136,7 +138,7 @@ export default function RTCCard(props: { className?: string }) {
         {useTrulienceAvatar ? (
           !avatarInLargeWindow ? (
             <div className="h-60 w-full p-1">
-              <Avatar audioTrack={remoteuser?.audioTrack} />
+              <Avatar localAudioTrack={audioTrack} audioTrack={remoteuser?.audioTrack} />
             </div>
           ) : (
             !isCompactLayout &&
@@ -145,7 +147,7 @@ export default function RTCCard(props: { className?: string }) {
             />
           )
         ) : (
-          <AgentView audioTrack={remoteuser?.audioTrack} />
+          <AgentView  audioTrack={remoteuser?.audioTrack} />
         )}
       </div>