输入框思考等级旁展示会话上下文占用进度环

[devcxl]

需求概述

在聊天输入框底部工具行中，思考等级（Reasoning Effort）下拉框的右侧新增一个圆形进度条（进度环），实时展示当前会话上下文（Context Window）的占用情况，帮助用户直观感知"上下文还剩多少"，避免在上下文耗尽时产生意外行为。

核心决策（已确认）

决策点	结论
展示位置	思考等级下拉框右侧、麦克风按钮左侧（工具行内）
数据口径	最近一次请求的 prompt tokens（tokenUsage.prompt，实际发送给 LLM 的完整上下文）/ 模型上下文上限
上限来源	模型 limit.context，缺失时回退 agentSettings.contextWindowTokens（默认 128000）
形态	20px 圆形 SVG 进度环，占用率 ≥80% 变色提醒，hover 显示数值（如 45,200 / 128,000）
无数据时	隐藏（新会话/未运行过请求时不显示）

验收标准

• 进度环位于思考等级下拉框右侧、麦克风按钮左侧
• 占用率 = tokenUsage.prompt ÷ 上下文上限（模型 limit.context，缺失回退 128000）
• 新会话或 prompt === 0 时隐藏进度环
• 占用率 ≥80% 变色提醒；hover 显示 45,200 / 128,000 格式数值
• 会话切换时随 tokenUsage 重置而隐藏/更新，无残留旧值

链接

• PRD：docs/prd/context-usage-ring.md
• 技术方案：docs/dev/specs/context-usage-ring.md
• ADR：docs/adr/2026-08-10-context-usage-ring.md
• Task：docs/dev/tasks/context-usage-ring.md（Sub Issue feat: 上下文占用进度环 (context-usage-ring) #196）
• PR：feat: 输入框思考等级旁上下文占用进度环 #197（已合并 dbb82b8）

Checklist

• requirements
• design
• tasks
• code
• review
• release

本 Issue 为 Parent Issue，子任务由 /tasks 阶段拆解。

[devcxl]

Architect 技术方案已产出（纯设计，未实现）

技术方案：docs/dev/specs/context-usage-ring.md
ADR：docs/adr/2026-08-10-context-usage-ring.md

方案要点

• 新组件 ContextUsageRing.tsx（纯展示 + 导出纯函数 contextUsagePercent），内联 SVG 20px 圆形环，零新依赖
• MessageInput 新增可选 props：tokenUsage、contextWindowTokens（默认 128000）；上限解析 activeModel?.limit?.context ?? contextWindowTokens；渲染在 reasoning-select 之后、micButton 之前
• App.tsx 仅 inputProps 追加两行；ChatContext 零改动（会话切换重置 L180-185 已存在）
• i18n：chat.contextUsage.tooltip（zh/en），数值经 formatNum 千位分隔

Testing Decisions 摘要（详见方案 §6）

行为	Test Seam	Observable Result	Level
占用率计算与 clamp 0-100	contextUsagePercent(used, limit) 纯函数	(45200,128000)→35；(150000,128000)→100；(100,0)→0 不抛错	unit
隐藏条件	<ContextUsageRing used limit> RTL 渲染	used=0 或 limit=0 → testid 不存在	component
≥80% 变色	wrapper data-state + 进度弧 class	80%→warning/text-warning；79%→normal/text-primary	component
hover 数值	title/aria-label	45200/128000 → "上下文占用：45,200 / 128,000"	component
SVG 几何闭环	progress 弧 stroke-dashoffset	percent=25 → 0.75·CIRC（±0.5）；100→0	component
MessageInput 集成	MessageInput + props 渲染	prompt>0 环出现 / prompt=0 消失；DOM 顺序 reasoning→ring→mic；limit.context 优先	component
会话切换重置	复用 ChatContext 既有重置	切换 activeId → tokenUsage={0,0}（补回归断言）	integration

需留意的裁决/偏差

1. hover 格式：PRD §6 硬约束"复用 formatNum" vs decision-map 示例 45.2K / 128K → 采用 formatNum（45,200 / 128,000）；若坚持紧凑格式仅需替换 tooltip 内格式化函数，结构不受影响
2. 口径偏差：ring 分母回退链含 agentSettings.contextWindowTokens，而 useAgent.ts L171 当前为 ?? 128000（未读该设置）→ 本 flow 不改（PRD 非目标），已登记为后续对齐项