feat(ui): 添加文件 Diff 查看功能

当 AI 执行 write_file 或 edit_file 工具时,在工具结果中显示 View Diff 按钮,
点击后在 IDE 面板中显示文件修改前后的对比视图。

主要改动:
- core: edit_file/write_file 工具返回 fileDiff 元数据
- ui: 新增 DiffEditor 组件用于显示文件差异
- ui: ChatMessage 添加 View Diff 按钮
- ui: IDE 组件支持 Diff 视图切换
- ui: useChat hook 处理 fileDiff 回调
This commit is contained in:
2025-12-17 21:11:44 +08:00
parent 3320a2a5ba
commit fea5442d53
13 changed files with 470 additions and 22 deletions
@@ -123,9 +123,22 @@ export const editFileTool: ToolWithMetadata = {
output += `\n\n⚠️ 代码检查发现问题,请修复:${result.diagnostics}`;
}
// 构建 diff 元数据
const fileName = path.basename(absolutePath);
const metadata: Record<string, unknown> = {
fileDiff: {
path: absolutePath,
name: fileName,
originalContent: result.originalContent ?? '',
newContent: result.newContent ?? '',
operation: 'edit',
},
};
return {
success: true,
output,
metadata,
};
},
};
@@ -92,9 +92,22 @@ export const writeFileTool: ToolWithMetadata = {
output += `\n\n⚠️ 代码检查发现问题,请修复:${result.diagnostics}`;
}
// 构建 diff 元数据
const fileName = path.basename(absolutePath);
const metadata: Record<string, unknown> = {
fileDiff: {
path: absolutePath,
name: fileName,
originalContent: result.originalContent ?? '',
newContent: result.newContent ?? content,
operation: 'write',
},
};
return {
success: true,
output,
metadata,
};
},
};