Files
Cyrene_v2/frontend/web/src/lib/useChat.ts
T
Aska 2248ddce15
CI / Backend (build / vet / test / cross-compile) (push) Has been cancelled
CI / Frontend (tsc + vite build) (push) Has been cancelled
feat(web): 用户侧体验补齐——思维链/工具卡数据源 + 图片附件 + 语音上行 + home/vision/voice 真表现
- 打通 thinking/tool_call 运行时数据源:openai 发 thinking_*(reasoning_content)/tool_call_*
  (delta.tool_calls 累积重新组装 Args 非 JSON 串);anthropic_stream 发 thinking_*(content_block
  thinking start/delta/stop)。ws_bridge 已映射 thinking.*/tool_call.*,前端渲染活。
- 前端消息模型 + 附件:ChatMessage 加 image?;ChatInput 加附件按钮(file→base64)、预览/移除、
  image-aware onSend(text,image);VisionMessageBody 升级图像卡+识别 chip;VoiceMessageBody
  升级通话控制卡(live2D预留/波形/静音/挂断);HomeMessageBody 读真实 deviceUpdates(去掉
  sampleDevices 猜)。
- 激活 voice_input:ChatShell onVoice 不再 no-op → sendUp voice_input + 切 voice mode。
- addTool 改按工具名 upsert(修复 tool_call.start/end 重复卡);ws_mode_switch 应用 agent 驱动
  mode;addUserMessage/beginAssistant 带 image/mode;chatStream/useChat.send 带 image。
- 新增 image/phone 图标。

已知限制(标注):图片仅前端收集(后端 chatRequest 无 image 字段未接真推理);流式工具卡无真实
工具名(StreamEvent 只带 ID,回退 tool_<id前缀>);mode 由 agent 驱动但后端未逐消息下发 mode
(mode_switch 回显+默认当前 mode 兜底);voice 为 UI+voice_input 上行(真实通话后置)。
go build/vet/test + 前端 tsc 绿。
2026-09-06 17:43:03 +08:00

63 lines
2.7 KiB
TypeScript

import { useCallback, useState } from "react";
import { chatStream } from "./api";
import { connectWs, isWsOpen } from "./ws";
import { useAppStore } from "../store/useAppStore";
import { useModeStore } from "../store/useModeStore";
import { now } from "./util";
/** Drives one user turn: push the user bubble, blanket a streaming assistant
* bubble, trigger the backend loop over REST (`stream:true`), and let the WS
* stream render into that bubble. Falls back to the WS `chat` channel when the
* REST trigger fails so the demo still works without a wired loop.
*
* The behavior mode is NOT chosen by the user at send time — the agent / backend
* hot-switches it (design/01 §3), and each message carries its own mode, so the
* bubble renders per that message's mode. Until the backend advertises a
* per-message mode, a new assistant bubble defaults to the current UI mode. */
export function useSendChat(): {
send: (text: string, image?: string) => Promise<void>;
sending: boolean;
} {
const [sending, setSending] = useState(false);
const sessionId = useAppStore((s) => s.sessionId);
const addUserMessage = useAppStore((s) => s.addUserMessage);
const beginAssistant = useAppStore((s) => s.beginAssistant);
const endStream = useAppStore((s) => s.endStream);
const appendChunk = useAppStore((s) => s.appendChunk);
const addTool = useAppStore((s) => s.addTool);
const appendTaskLog = useAppStore((s) => s.appendTaskLog);
const mode = useModeStore((s) => s.mode);
const send = useCallback(
async (text: string, image?: string) => {
const trimmed = text.trim();
if ((!trimmed && !image) || sending) return;
setSending(true);
if (!isWsOpen()) connectWs();
// The gateway's chat body still requires a non-empty text, so a pure image
// turn (vision) falls back to a default prompt to keep the trigger valid.
const prompt = trimmed || (image ? "分析这张图片" : "");
addUserMessage(trimmed, undefined, image);
beginAssistant(mode);
try {
await chatStream(sessionId, prompt, image);
} catch (err: unknown) {
// Backend loop not wired or gateway unreachable: show the failure inline
// rather than leaving a permanently-streaming bubble.
endStream();
const msg = err instanceof Error ? err.message : "触发失败";
appendChunk(`[stream 触发失败] ${msg}`);
appendTaskLog("main", `[error] ${msg}\n`);
addTool({ name: "stream_trigger", summary: "失败", ok: false, detail: msg, at: now() });
} finally {
setSending(false);
}
},
[sending, sessionId, mode, addUserMessage, beginAssistant, endStream, appendChunk, addTool, appendTaskLog]
);
return { send, sending };
}