refactor: 静态变量提到对话外 + System Prompt 模板展开可视化
- 新建 SessionBar：会话变量独立于消息气泡，显示在对话顶部
- 重写 SystemPromptView：解析 {{var}} 占位符并内联展示模板→变量映射
- 重构 MessageList：提取 static_var 到 varMap，过滤后传入气泡
- 更新 SegmentRenderer + MessageBubble：传递 varMap 到 SystemPromptView
- 更新所有 Demo：static_var 从 user 消息迁移到 system 消息，使用真实会话配置（current_date、language、knowledge_cutoff）
- 更新导出逻辑：system 消息中收集 static_var 并在模板中展开 {{var}}
- 更新测试：新增模板展开用例，18 tests pass
This commit is contained in:
carry
+106
-22
@@ -20,9 +20,31 @@ const demoA: PromptEnvelope = {
|
||||
id: 'a-1',
|
||||
role: 'system',
|
||||
segments: [
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'current_date',
|
||||
value: '2026年6月7日',
|
||||
description: '当前对话日期，注入到 System Prompt 模板中',
|
||||
},
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'language',
|
||||
value: '中文（简体）',
|
||||
description: '模型回复的首选语言',
|
||||
},
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'user_name',
|
||||
value: '小明',
|
||||
description: '当前用户名称',
|
||||
},
|
||||
{
|
||||
kind: 'system_prompt',
|
||||
content: `你是 HCI 课程设计助手。你帮助学生对聊天界面的信息架构进行批判性思考。
|
||||
content: `当前日期：{{current_date}}
|
||||
用户名称：{{user_name}}
|
||||
回复语言：{{language}}
|
||||
|
||||
你是 HCI 课程设计助手。你帮助学生对聊天界面的信息架构进行批判性思考。
|
||||
回答应简洁、有结构，鼓励学生从用户体验角度分析问题。
|
||||
如果学生对某个概念不清楚，用通俗的例子解释，不要用术语堆砌。`,
|
||||
collapsed: true,
|
||||
@@ -86,11 +108,6 @@ const demoA: PromptEnvelope = {
|
||||
id: 'a-2',
|
||||
role: 'user',
|
||||
segments: [
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'user_name',
|
||||
value: '小明',
|
||||
},
|
||||
{
|
||||
kind: 'text',
|
||||
content: '你好，我想讨论一下我设计的聊天协议方案。你觉得 9 种 prompt 类型的分类合理吗？',
|
||||
@@ -124,10 +141,23 @@ const demoB: PromptEnvelope = {
|
||||
id: 'b-1',
|
||||
role: 'system',
|
||||
segments: [
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'current_date',
|
||||
value: '2026年6月7日',
|
||||
description: '当前日期，SQL 查询中用于计算相对日期',
|
||||
},
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'knowledge_cutoff',
|
||||
value: '2026年1月',
|
||||
description: '模型训练数据的截止时间',
|
||||
},
|
||||
{
|
||||
kind: 'system_prompt',
|
||||
content:
|
||||
'你是一个数据分析助手，可以使用 Python 工具进行数据查询和可视化。',
|
||||
content: `当前日期：{{current_date}}。知识截止：{{knowledge_cutoff}}。
|
||||
|
||||
你是一个数据分析助手，可以使用 Python 工具进行数据查询和可视化。`,
|
||||
collapsed: true,
|
||||
},
|
||||
{
|
||||
@@ -298,10 +328,23 @@ const demoC: PromptEnvelope = {
|
||||
id: 'c-1',
|
||||
role: 'system',
|
||||
segments: [
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'current_date',
|
||||
value: '2026年6月7日',
|
||||
description: '当前日期',
|
||||
},
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'language',
|
||||
value: '中文（简体）',
|
||||
description: '文档审阅的默认输出语言',
|
||||
},
|
||||
{
|
||||
kind: 'system_prompt',
|
||||
content:
|
||||
'你是文档审阅助手。帮助用户分析长文档、提取要点、回答关于文档内容的问题。',
|
||||
content: `当前日期：{{current_date}}，回复语言：{{language}}。
|
||||
|
||||
你是文档审阅助手。帮助用户分析长文档、提取要点、回答关于文档内容的问题。`,
|
||||
collapsed: true,
|
||||
},
|
||||
{
|
||||
@@ -396,9 +439,38 @@ const demoD: PromptEnvelope = {
|
||||
id: 'd-1',
|
||||
role: 'system',
|
||||
segments: [
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'current_date',
|
||||
value: '2026年6月7日',
|
||||
description: '当前对话日期',
|
||||
},
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'language',
|
||||
value: '中文（简体）',
|
||||
description: '模型回复的首选语言',
|
||||
},
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'knowledge_cutoff',
|
||||
value: '2026年1月',
|
||||
description: '模型训练数据截止日期',
|
||||
},
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'user_name',
|
||||
value: '小明',
|
||||
description: '当前用户名称',
|
||||
},
|
||||
{
|
||||
kind: 'system_prompt',
|
||||
content: `你是 Claude，一个 HCI 研究助手。你的角色是帮助学生批判性地思考聊天界面的设计问题。
|
||||
content: `当前日期：{{current_date}}
|
||||
用户：{{user_name}}
|
||||
回复语言：{{language}}
|
||||
知识截止：{{knowledge_cutoff}}
|
||||
|
||||
你是 Claude，一个 HCI 研究助手。你的角色是帮助学生批判性地思考聊天界面的设计问题。
|
||||
|
||||
核心原则：
|
||||
- 鼓励从用户体验角度分析，而非技术实现角度
|
||||
@@ -538,11 +610,6 @@ const demoD: PromptEnvelope = {
|
||||
id: 'd-2',
|
||||
role: 'user',
|
||||
segments: [
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'user_name',
|
||||
value: '小明',
|
||||
},
|
||||
{
|
||||
kind: 'text',
|
||||
content: '你好！我在准备课程设计的文献综述部分。我找到了一篇相关的研究报告，帮我分析一下它是否可以支持我的论点。',
|
||||
@@ -665,9 +732,31 @@ const demoE: PromptEnvelope = {
|
||||
id: 'e-1',
|
||||
role: 'system',
|
||||
segments: [
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'current_date',
|
||||
value: '2026年6月7日',
|
||||
description: '当前对话日期',
|
||||
},
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'language',
|
||||
value: '中文（简体）',
|
||||
description: '模型回复的首选语言',
|
||||
},
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'knowledge_cutoff',
|
||||
value: '2026年1月',
|
||||
description: '模型训练数据截止日期',
|
||||
},
|
||||
{
|
||||
kind: 'system_prompt',
|
||||
content: `你是 HCI 课程设计助手，具备 Anthropic Skills 机制。
|
||||
content: `当前日期：{{current_date}}
|
||||
回复语言：{{language}}
|
||||
知识截止：{{knowledge_cutoff}}
|
||||
|
||||
你是 HCI 课程设计助手，具备 Anthropic Skills 机制。
|
||||
|
||||
你有以下 skills 可用。用户输入以 / 开头的命令时会直接触发对应 skill。你也可以在分析用户意图后，主动建议合适的 skill。
|
||||
|
||||
@@ -764,11 +853,6 @@ const demoE: PromptEnvelope = {
|
||||
id: 'e-2',
|
||||
role: 'user',
|
||||
segments: [
|
||||
{
|
||||
kind: 'static_var',
|
||||
name: 'user_name',
|
||||
value: '小明',
|
||||
},
|
||||
{
|
||||
kind: 'text',
|
||||
content: '我想深入了解 Anthropic Skills 的渐进式披露机制（Progressive Disclosure），作为我的 HCI 课程论文的案例研究对象。请帮我调研一下这个机制的设计原理、交互模式和学术界相关讨论。',
|
||||
|
||||
Reference in New Issue
Block a user