state management setup

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.
@@ -16,6 +16,11 @@ interface UseLayercodeAgentOptions {
   onDataMessage?: (data: any) => void;
   onMuteStateChange?: (isMuted: boolean) => void;
   onMessage?: (data: any) => void;
+
+  audioInput?: boolean;
+  audioOutput?: boolean;
+  onAudioInputChanged?: (audioInput: boolean) => void;
+  onAudioOutputChanged?: (audioOutput: boolean) => void;
 }
 
 /**
@@ -41,12 +46,16 @@ const useLayercodeAgent = (
     onDataMessage,
     onMessage,
     onMuteStateChange,
+    onAudioInputChanged,
+    onAudioOutputChanged,
   } = options;
   const websocketUrlOverride = options['_websocketUrl'];
 
   const [status, setStatus] = useState('initializing');
   const [userAudioAmplitude, setUserAudioAmplitude] = useState(0);
   const [agentAudioAmplitude, setAgentAudioAmplitude] = useState(0);
+  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);
@@ -71,6 +80,16 @@ const useLayercodeAgent = (
         authorizeSessionEndpoint,
         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) {
@@ -126,7 +145,11 @@ const useLayercodeAgent = (
       onError,
       onMessage,
       onMuteStateChange,
+      onAudioInputChanged,
+      onAudioOutputChanged,
       websocketUrlOverride,
+      audioInput,
+      audioOutput,
     ]
   );
 
@@ -148,6 +171,24 @@ const useLayercodeAgent = (
     clientRef.current?.unmute();
   }, []);
 
+  const setAudioInput = useCallback(
+    (state: React.SetStateAction<boolean>) => {
+      _setAudioInput(state);
+      const next = typeof state === 'function' ? (state as (prev: boolean) => boolean)(audioInput) : state;
+      clientRef.current?.setAudioInput(next);
+    },
+    [_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();
   }, []);
@@ -207,12 +248,17 @@ const useLayercodeAgent = (
     unmute,
     sendClientResponseText,
 
+    setAudioInput,
+    setAudioOutput,
+
     // State
     status,
     userAudioAmplitude,
     agentAudioAmplitude,
     isMuted,
     conversationId: internalConversationId,
+    audioInput,
+    audioOutput,
   };
 };