优化桌面端 UI 布局与输入体验

[Li-Charles-One]

背景

这个 PR 是一轮桌面端 UI polish。真实目标不只是把界面“变好看”，而是让 Reasonix Desktop 在长期对话、项目工作区、工具调用和上下文查看时更清晰、更稳定、更有辨识度，并且长此以往逐步建立 Reasonix 自己独特的品牌视觉风格。

重点不是改后端能力，也不是调整 Agent 行为，而是重做/强化桌面端的视觉组织、输入区、侧边栏、消息展示、工具卡片、上下文面板和状态栏体验。

这是一轮持续约 4 天的阶段性成果，并不代表 Reasonix Desktop 最终应该长成这个样子。我的目标是先为 Reasonix 定一个更统一、更有辨识度的审美基调：这是一个 UI baseline，是底线，不是上限。后续仍然可以继续打磨、迭代、拆分和调整。

为了降低维护者 review 压力，这个 PR 可以理解为一版阶段性的桌面 UI polish：目前主要覆盖主聊天工作流、侧边栏、Composer、消息流、工具卡片和 Context Panel。Settings 以及部分次级界面的 UI 还没有完全制作完成，后续我很愿意继续跟进这些界面的设计与实现。

设计原则

• 保留 Reasonix 自己的桌面端视觉方向，不采用其他上游 UI 外观。
• 优先提升可读性、层级、空间利用率和 hover/focus 反馈。
• 减少界面噪音，让常用操作更容易被发现。
• 保持前端改动为主，尽量不触碰核心后端逻辑。
• 对输入框、消息流、工具卡、侧边栏等高频区域做统一视觉 polish。
• 不舍弃任何原有功能；如果有功能入口、快捷键或交互遗漏，我会积极配合修复。

维护承诺

我非常愿意继续参与这个 UI 方向的后续维护，包括：

• 修复这个 PR 引入的 UI bug 或交互回归。
• 根据维护者 review 意见调整视觉细节、布局密度和命名。
• 继续补齐 Settings、更多弹窗、次级面板等尚未完全 polish 的界面。
• 如果维护者希望降低合并风险，我也可以配合把这个大 PR 拆成多个小 PR。

主要改动

桌面布局与侧边栏

• 优化桌面端整体布局密度和边距，让聊天区、侧边栏、右侧工作区更协调。
• 重做侧边栏视觉层级，包括品牌区、新建会话入口、功能区、项目树和底部工具入口。
• 调整侧边栏折叠/展开后的细节，减少圆角和阴影带来的割裂感。
• 优化项目树、会话入口和 IM 连接区的状态展示。

Composer 输入框

• 优化输入框整体卡片样式，使其在深色主题下更贴合当前视觉系统。
• 发送按钮中间的小飞机图标固定为白色，避免在强调色背景上显得发灰。
• hover 时只保留上下两条强调色渐变线，避免整圈强光过度抢视觉。
• 保持输入框发光跟随当前主题强调色，而不是变成灰白色。
• 调整模型选择、努力等级、权限模式等控件在输入框内的视觉平衡。

消息流与工具卡片

• 优化用户消息气泡，使其与主题强调色更统一。
• 优化 assistant 消息正文可读性，包括行高、间距和整体排版。
• 简化部分回合操作图标，减少视觉噪音。
• 调整工具卡、过程卡、审批卡等组件边框、背景和 hover 反馈。

Context Panel / 右侧工作区

• 将上下文使用量展示从 donut ring 改为更直观的 usage bar。
• 优化 prompt / completion / reasoning / other 的分段展示。
• 调整 ContextPanel 的卡片密度、指标布局和文件列表展示。
• 更新中英文/繁中本地化文案，使上下文面板术语更自然。

状态栏与设置

• 增加状态栏可见性相关支持。
• 调整状态栏和桌面设置中相关展示选项。
• Settings 仍是后续可继续 polish 的区域，本 PR 没有试图一次性完成所有设置页 UI。

工程侧调整

• 同步最新 upstream/main-v2 后解决合并冲突。
• 接回官方新增的关闭标签页快捷键逻辑，但调用当前自定义 UI 中已有的 tab close 流程。
• 避免引入未使用的官方 wordmark UI 资源。

截图建议

这个 PR 是 UI 改动，建议 review 时重点看截图/录屏。后续我会补充：

• 桌面端整体布局截图
• Composer 默认态与 hover 态截图
• 侧边栏与项目树截图
• 消息区、工具卡片和 ContextPanel 截图

验证

已在本地执行：

pnpm typecheck

结果：通过。

备注

• 本 PR 主要集中在 desktop/frontend。
• 目标是提交一版完整的自定义桌面 UI polish，而不是一次性完成所有界面的最终设计。
• 目前没有主动移除原有功能；如果 review 中发现遗漏，我会继续修复。
• 如果维护者希望降低 review 成本，这个 PR 后续也可以拆分为：Composer、Sidebar/Layout、Message/Tool cards、ContextPanel、StatusBar 几个更小的 PR。

[Li-Charles-One]

[Li-Charles-One]

Hi @SivanCola @esengine 👋

这个 PR（优化桌面端 UI 布局与输入体验）已就绪，麻烦有空时帮忙 review 一下 🙏

• CI 已全部通过 ✅
• 暂未发现冲突，可直接合并
• 改动较大（15 个文件，+3228 / -1626），如有问题随时指出，会尽快跟进调整

辛苦两位，谢谢！