用途:@hhopkins/agent-runtime-react 是一个 React 集成包,提供 Hooks 与 Context,用于把 React 前端连接到 agent runtime 后端,处理 WebSocket 连接管理、会话生命周期、实时流式更新,以及基于 Context + Reducer 的状态管理。
安装:pnpm add @hhopkins/agent-runtime-react
用法:用 AgentServiceProvider 包裹应用,传入 apiUrl、wsUrl、apiKey、debug 等属性。Provider 会初始化 REST 客户端与 WebSocket 管理器、立即连接 WebSocket、加载初始会话列表,并为所有 WebSocket 事件设置监听。
主要 Hooks:useAgentSession 管理会话生命周期(createSession、loadSession、destroySession、syncSession、updateSessionOptions),建议在页面/容器层调用以确保加入 WebSocket 房间;useMessages 访问对话块并发送消息,返回 blocks、streamingBlockIds、isStreaming、metadata、sendMessage 等,块已预合并流式内容,流式期间会出现 ID 为 streaming 的临时块;useSessionList 列出全部会话;useWorkspaceFiles 跟踪 agent 修改的文件;useSubagents 跟踪子代理记录;useEvents 提供调试事件日志。
渲染与流式:按 block.type 分支渲染 user_message、assistant_text、tool_use、tool_result、thinking、subagent、error 等类型;可用 isStreaming 显示输入指示或光标动画;用户消息通过乐观更新立即出现,block_complete 到达后替换为真实消息。
错误处理:错误可通过 Hook 级 error 暴露,也会以 error 类型块内联出现在对话中。
限制:资料未提供版本兼容性、浏览器支持、收费与价格等信息。