update demo

components/logic/useVoiceChat.ts

@@ -0,0 +1,58 @@
+import { useCallback } from "react";
+
+import { useStreamingAvatarContext } from "./context";
+
+export const useVoiceChat = () => {
+  const {
+    avatarRef,
+    isMuted,
+    setIsMuted,
+    isVoiceChatActive,
+    setIsVoiceChatActive,
+    isVoiceChatLoading,
+    setIsVoiceChatLoading,
+  } = useStreamingAvatarContext();
+
+  const startVoiceChat = useCallback(
+    async (isInputAudioMuted?: boolean) => {
+      if (!avatarRef.current) return;
+      setIsVoiceChatLoading(true);
+      await avatarRef.current?.startVoiceChat({
+        isInputAudioMuted,
+      });
+      setIsVoiceChatLoading(false);
+      setIsVoiceChatActive(true);
+      setIsMuted(!!isInputAudioMuted);
+    },
+    [avatarRef, setIsMuted, setIsVoiceChatActive, setIsVoiceChatLoading],
+  );
+
+  const stopVoiceChat = useCallback(() => {
+    if (!avatarRef.current) return;
+    avatarRef.current?.closeVoiceChat();
+    setIsVoiceChatActive(false);
+    setIsMuted(true);
+  }, [avatarRef, setIsMuted, setIsVoiceChatActive]);
+
+  const muteInputAudio = useCallback(() => {
+    if (!avatarRef.current) return;
+    avatarRef.current?.muteInputAudio();
+    setIsMuted(true);
+  }, [avatarRef, setIsMuted]);
+
+  const unmuteInputAudio = useCallback(() => {
+    if (!avatarRef.current) return;
+    avatarRef.current?.unmuteInputAudio();
+    setIsMuted(false);
+  }, [avatarRef, setIsMuted]);
+
+  return {
+    startVoiceChat,
+    stopVoiceChat,
+    muteInputAudio,
+    unmuteInputAudio,
+    isMuted,
+    isVoiceChatActive,
+    isVoiceChatLoading,
+  };
+};