add audioOutput state management that can mute or unmute audio output

Author: jackbridger

src/index.ts

@@ -1,5 +1,5 @@
 import { useState, useEffect, useCallback, useRef } from 'react';
-import LayercodeClient, { type AgentConfig, type AuthorizeSessionRequest } from '@layercode/js-sdk';
+import LayercodeClient, { type AgentConfig, type AuthorizeSessionRequest } from 'layercode-js-sdk';
 
 /**
  * Configuration options for the useLayercodeAgent hook.
@@ -20,7 +20,9 @@ interface UseLayercodeAgentOptions {
   onAgentSpeakingChange?: (isSpeaking: boolean) => void;
 
   audioInput?: boolean;
+  audioOutput?: boolean;
   onAudioInputChanged?: (audioInput: boolean) => void;
+  onAudioOutputChanged?: (audioOutput: boolean) => void;
   enableAmplitudeMonitoring?: boolean;
 }
 
@@ -50,6 +52,7 @@ const useLayercodeAgent = (
     onUserSpeakingChange,
     onAgentSpeakingChange,
     onAudioInputChanged,
+    onAudioOutputChanged,
   } = options;
   const websocketUrlOverride = options['_websocketUrl'];
   const enableAmplitudeMonitoring = options.enableAmplitudeMonitoring ?? true;
@@ -60,6 +63,7 @@ const useLayercodeAgent = (
   const [userSpeaking, setUserSpeaking] = useState(false);
   const [agentSpeaking, setAgentSpeaking] = useState(false);
   const [audioInput, _setAudioInput] = useState<boolean>(options.audioInput ?? true);
+  const [audioOutput, _setAudioOutput] = useState<boolean>(options.audioOutput ?? true);
   const [isMuted, setIsMuted] = useState(false);
   const [internalConversationId, setInternalConversationId] = useState<string | null | undefined>(conversationId);
   const conversationIdRef = useRef<string | undefined>(conversationId);
@@ -92,10 +96,15 @@ const useLayercodeAgent = (
         authorizeSessionRequest,
         metadata,
         audioInput,
+        audioOutput,
         audioInputChanged: (next: boolean) => {
           _setAudioInput(next);
           onAudioInputChanged?.(next);
         },
+        audioOutputChanged: (next: boolean) => {
+          _setAudioOutput(next);
+          onAudioOutputChanged?.(next);
+        },
         onConnect: ({ conversationId, config }: { conversationId: string | null; config?: AgentConfig }) => {
           setInternalConversationId((current) => {
             if (conversationIdRef.current === undefined) {
@@ -172,7 +181,9 @@ const useLayercodeAgent = (
       onAgentSpeakingChange,
       onAudioInputChanged,
       websocketUrlOverride,
+      onAudioOutputChanged,
       audioInput,
+      audioOutput,
       enableAmplitudeMonitoring,
     ]
   );
@@ -204,6 +215,15 @@ const useLayercodeAgent = (
     [_setAudioInput, clientRef, audioInput]
   );
 
+  const setAudioOutput = useCallback(
+    (state: React.SetStateAction<boolean>) => {
+      _setAudioOutput(state);
+      const next = typeof state === 'function' ? (state as (prev: boolean) => boolean)(audioOutput) : state;
+      clientRef.current?.setAudioOutput(next);
+    },
+    [_setAudioOutput, clientRef, audioOutput]
+  );
+
   const triggerUserTurnStarted = useCallback(() => {
     clientRef.current?.triggerUserTurnStarted();
   }, []);
@@ -264,6 +284,7 @@ const useLayercodeAgent = (
     sendClientResponseText,
 
     setAudioInput,
+    setAudioOutput,
 
     // State
     status,
@@ -274,6 +295,7 @@ const useLayercodeAgent = (
     isMuted,
     conversationId: internalConversationId,
     audioInput,
+    audioOutput,
   };
 };