后端:
- server: 实现完整的 HTTP 会话管理(CRUD)+ SSE 事件流推送,
支持双通道架构(POST 发消息 + GET SSE 接收流式响应)
- runtime: ContentBlock 新增 Thinking / RedactedThinking 变体,
支持思考过程和已编辑思考的序列化/反序列化
- api: 注册 GLM 系列模型(glm-4/5 等)到模型注册表,
扩展 XAI/OpenAI 兼容提供商的请求构建逻辑
前端:
- 基于 Ant Design X 构建完整聊天界面:Bubble.List 消息列表、
Sender 输入框、Conversations 会话管理、Think 思考过程折叠、
ThoughtChain 工具调用链展示
- XMarkdown 集成:代码高亮、Mermaid 图表、LaTeX 公式、
自定义脚注、流式渲染(incomplete 占位符)
- SSE Hook 对接服务端事件流,手动管理 AssistantBuffer 累积 delta
- 深色/浅色主题切换,会话侧边栏(新建/切换/删除)
42 lines
1.1 KiB
TypeScript
42 lines
1.1 KiB
TypeScript
import React from 'react';
|
|
import { Welcome, Prompts } from '@ant-design/x';
|
|
|
|
const examplePrompts = [
|
|
{ key: '1', label: '总结当前工作区', description: '分析项目结构和代码' },
|
|
{ key: '2', label: '帮我写一个测试', description: '为指定模块生成测试用例' },
|
|
{ key: '3', label: '查找 Bug', description: '检查代码中的潜在问题' },
|
|
];
|
|
|
|
interface WelcomeScreenProps {
|
|
onSelect: (prompt: string) => void;
|
|
}
|
|
|
|
const WelcomeScreen: React.FC<WelcomeScreenProps> = ({ onSelect }) => {
|
|
return (
|
|
<div style={{
|
|
flex: 1,
|
|
display: 'flex',
|
|
flexDirection: 'column',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
padding: 48,
|
|
}}>
|
|
<Welcome
|
|
icon="🐾"
|
|
title="Claw Code"
|
|
description="本地编码助手,连接你的 Claw Server"
|
|
style={{ marginBottom: 32 }}
|
|
/>
|
|
<Prompts
|
|
title="试试这些"
|
|
items={examplePrompts}
|
|
onItemClick={(info) => {
|
|
onSelect(String(info.data.label));
|
|
}}
|
|
/>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default WelcomeScreen;
|