a9881eac26
- 定义 11 种 Segment 类型(text, static_var, system_prompt, memory, skills, tool_overview, tool_call_request/result, document, long_text, media) - 每种 Segment 有独立的颜色编码和折叠交互 - 通用 CollapsiblePanel + SegmentRenderer 路由架构 - 4 个 Demo 场景覆盖全部 9 种上下文类型 - 导出为 OpenAI Chat Completions Format(model + messages + tools) - tool_overview -> 请求级 tools[](含 JSON Schema) - tool_call_request -> assistant.tool_calls[] - tool_call_result -> tool-role message(ID 配对) - 17 个单元测试全部通过 - React 18 + TypeScript + Vite + Tailwind CSS
26 lines
870 B
TypeScript
26 lines
870 B
TypeScript
import type { MemorySegment } from '../../types/protocol'
|
|
import CollapsiblePanel from '../CollapsiblePanel'
|
|
import { Brain } from 'lucide-react'
|
|
|
|
export default function MemoryView({ segment }: { segment: MemorySegment }) {
|
|
return (
|
|
<CollapsiblePanel
|
|
title="User Memory"
|
|
icon={<Brain size={16} />}
|
|
color="border-purple-400 text-purple-700"
|
|
bgColor="bg-purple-50"
|
|
defaultCollapsed={segment.collapsed}
|
|
badge={`${segment.items.length} 条记忆`}
|
|
>
|
|
<ul className="space-y-2">
|
|
{segment.items.map((item, i) => (
|
|
<li key={i} className="bg-white/60 rounded px-2 py-1.5">
|
|
<div className="text-xs font-semibold text-purple-800">{item.title}</div>
|
|
<div className="text-xs text-gray-500 mt-0.5">{item.content}</div>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</CollapsiblePanel>
|
|
)
|
|
}
|