This commit is contained in:
lloydzhou 2024-11-07 17:23:20 +08:00
parent 0037b0c944
commit c526ff80b5

View File

@ -45,6 +45,7 @@ export function RealtimeChat({
const chatStore = useChatStore(); const chatStore = useChatStore();
const session = chatStore.currentSession(); const session = chatStore.currentSession();
const [status, setStatus] = useState("");
const [isRecording, setIsRecording] = useState(false); const [isRecording, setIsRecording] = useState(false);
const [isConnected, setIsConnected] = useState(false); const [isConnected, setIsConnected] = useState(false);
const [isConnecting, setIsConnecting] = useState(false); const [isConnecting, setIsConnecting] = useState(false);
@ -94,15 +95,22 @@ export function RealtimeChat({
await clientRef.current.sendItem({ await clientRef.current.sendItem({
type: "message", type: "message",
role: role as any, role: role as any,
content: [{ type: "input_text", text: content as string }], content: [
{
type: (role === "assistant" ? "text" : "input_text") as any,
text: content as string,
},
],
}); });
} }
} }
} catch (error) { } catch (error) {
console.error("Set message failed:", error); console.error("Set message failed:", error);
setStatus("Set message failed");
} }
} catch (error) { } catch (error) {
console.error("Connection failed:", error); console.error("Connection failed:", error);
setStatus("Connection failed");
} finally { } finally {
setIsConnecting(false); setIsConnecting(false);
} }
@ -256,7 +264,10 @@ export function RealtimeChat({
await toggleRecording(); await toggleRecording();
}; };
initAudioHandler().catch(console.error); initAudioHandler().catch((error) => {
setStatus(error);
console.error(error);
});
return () => { return () => {
if (isRecording) { if (isRecording) {
@ -272,9 +283,9 @@ export function RealtimeChat({
const handleClose = async () => { const handleClose = async () => {
onClose?.(); onClose?.();
if (isRecording) { if (isRecording) {
toggleRecording(); await toggleRecording();
} }
disconnect(); disconnect().catch(console.error);
}; };
return ( return (
@ -289,13 +300,13 @@ export function RealtimeChat({
<div className={styles["bottom-icons"]}> <div className={styles["bottom-icons"]}>
<div> <div>
<IconButton <IconButton
icon={!isRecording ? <VoiceOffIcon /> : <VoiceIcon />} icon={isRecording ? <VoiceOffIcon /> : <VoiceIcon />}
onClick={toggleRecording} onClick={toggleRecording}
disabled={!isConnected} disabled={!isConnected}
type={isConnecting || isConnected ? "danger" : "primary"} type={isRecording ? "danger" : "primary"}
/> />
</div> </div>
<div className={styles["icon-center"]}></div> <div className={styles["icon-center"]}>{status}</div>
<div> <div>
<IconButton <IconButton
icon={<PowerIcon />} icon={<PowerIcon />}