Files
Prompt-Envelope-Protocol/src/components/segments/MemoryView.tsx
T
carry a9881eac26 feat: Prompt Envelope Protocol MVP
- 定义 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
2026-06-07 13:44:36 +08:00

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>
)
}