Fix desktop chat UX and add PR regression gates / 修复桌面聊天体验并增加 PR 回归门禁

[SivanCola]

Summary

This PR focuses on desktop chat UX, interaction reliability, PR regression prevention, and desktop bundle splitting.

It fixes several desktop-side UI and interaction issues:

• Prevents the sidebar "New chat" button label from wrapping in compact desktop widths.
• Reduces excess blank space around the reasoning/answer area and makes the chat thread scroll more smoothly.
• Adds live auto-follow behavior for streaming chat output while preserving user-controlled scroll position.
• Cleans up crowded chat/composer/approval controls so actions wrap, truncate, or move into menus instead of blocking each other.
• Converts clickable non-semantic elements into proper buttons/dialogs where appropriate, including status bar segments, settings navigation, workspace rows, command palette rows, markdown file pills, jobs rows, jump bar items, and related controls.
• Fixes related desktop Biome/a11y issues, including unsafe HTML rendering in reasoning cards, missing button types, SVG accessibility metadata, and unstable array index keys.
• Restores the desktop JumpBar by replacing fragile DOM lookup with virtual-list index navigation and visible-range active state tracking.
• Adds desktop UI regression gates to local scripts, CI, and the PR checklist.
• Splits the desktop Vite bundle into explicit vendor chunks so the previous >500 KB chunk warning is removed.

Root Cause

The main issues came from a combination of layout and process gaps:

• The compact sidebar button mixed icon, label, and shortcut content without enough responsive constraints, so localized labels could wrap or squeeze.
• The chat thread used spacing and scroll ownership patterns that left large visual gaps and did not reliably follow streaming output.
• Several interactive desktop controls were implemented as clickable div/span elements, which caused accessibility issues and made keyboard/interaction behavior less predictable.
• Approval/composer controls did not consistently account for narrow widths, so buttons could crowd or block each other.
• The JumpBar relied on querying rendered DOM nodes inside a virtualized chat list; once items were recycled or not mounted, jump navigation and active markers became unreliable.
• CI only linted src tests; desktop/src and the desktop Vite config were not part of the required PR gate, so desktop-only regressions could pass review and CI.
• The desktop app bundled React, Markdown/KaTeX, syntax highlighting, UI helpers, Tauri API bindings, and app code into one large entry chunk, triggering Vite's default chunk warning.

Technical Approach

• Tightened sidebar, composer, approval tray, popover, and status bar CSS with stable sizing, truncation, wrapping rules, and responsive constraints.
• Updated the chat thread to use the virtualized scroller as the single scroll owner and added streaming auto-follow behavior that respects manual scrolling.
• Replaced clickable non-semantic elements with semantic button/dialog structures and added focus-safe keyboard behavior where needed.
• Removed dangerouslySetInnerHTML from reasoning card inline formatting and rendered inline highlights with React nodes instead.
• Replaced fragile index keys with deterministic content-based keys in touched desktop rendering paths.
• Reworked JumpBar navigation to use react-virtuoso scrollToIndex, derive active state from visible ranges, and reduce the control's default visual weight until hover/focus.
• Added lint:desktop, build:desktop, and verify:desktop, expanded npm run lint/npm run verify, and updated CI to install and build desktop dependencies.
• Added desktop UI-specific PR checklist items so reviewers explicitly check the affected surface.
• Added Vite manualChunks for vendor-react, vendor-markdown, vendor-code, vendor-ui, and vendor-tauri.

Focused Optimization Points

• Chat experience: smoother thread scrolling, less empty vertical space, and real-time streaming follow behavior.
• Interaction reliability: semantic controls, keyboard-friendly actions, safer dialogs/popovers, less button crowding, and a reliable virtualized JumpBar.
• Desktop layout resilience: compact sidebar behavior, narrow-width truncation, stable control dimensions, and better responsive constraints.
• Regression prevention: desktop lint/build gates now run locally and in CI, and PR authors must call out desktop UI verification.
• Bundle health: desktop main JS chunk is reduced from about 1,077 KB to about 285 KB, with the largest vendor chunk below the default 500 KB warning threshold.

Verification

• npm run lint:desktop
• npm run build:desktop
• npm run lint
• npm run verify via the pre-push hook
• npx vitest run tests/desktop-sidebar-new-chat-layout.test.ts
• npm run test -- desktop/src/ui/jump-bar.test.tsx

中文说明

本 PR 集中处理桌面端聊天体验、交互可靠性、PR 回归防护和桌面端打包分包问题。

主要修复的问题包括：

• 修复桌面端侧边栏「新会话」按钮在紧凑宽度下文字换行的问题。
• 减少思考过程和回答区域周围多余空白，让聊天线程滚动更顺畅。
• 为流式聊天输出增加实时自动跟随滚动，同时保留用户手动滚动时的位置控制。
• 优化聊天框、审批条、composer 等区域的按钮拥挤问题，使按钮能换行、截断或进入菜单，不再互相堵塞。
• 将多个可点击但非语义化的 div/span 改为合适的 button/dialog，包括状态栏、设置导航、工作区列表、命令面板、Markdown 文件标签、后台任务列表、跳转条等交互点。
• 清理相关桌面端 Biome/a11y 问题，包括不安全的 HTML 渲染、缺少 button type、SVG 可访问性标记、React index key 等。
• 修复桌面端 JumpBar：用虚拟列表 index 跳转和可见范围高亮替代脆弱的 DOM 查询逻辑。
• 给本地脚本、CI 和 PR 模板增加桌面端回归门禁。
• 给桌面端 Vite 构建增加显式 vendor 分包，消除原先超过 500 KB 的 chunk 警告。

问题原因

这些问题主要由几类原因叠加造成：

• 侧边栏按钮同时包含图标、文字和快捷键，但缺少足够稳定的响应式约束，导致本地化文字在窄宽度下被挤压换行。
• 聊天线程的间距和滚动职责不够集中，导致视觉空白偏大，流式输出时也不能稳定跟随到底部。
• 一些桌面端交互控件使用 clickable div/span 实现，造成可访问性问题，也让键盘和焦点行为不够可预测。
• 审批和 composer 操作按钮没有系统处理窄宽度场景，容易互相挤压或遮挡。
• JumpBar 依赖在虚拟化聊天列表里查询已渲染 DOM 节点；当列表项被回收或尚未挂载时，跳转和当前回合高亮都会失效。
• CI 之前只检查 src tests，没有把 desktop/src 和桌面端 Vite 配置纳入 PR 必过门禁，导致桌面端专属问题可以绕过检查。
• 桌面端将 React、Markdown/KaTeX、代码高亮、UI 工具、Tauri API 和业务代码打进同一个入口 chunk，触发了 Vite 默认的 chunk 体积警告。

技术方案

• 通过稳定尺寸、截断、换行和响应式约束，收紧侧边栏、composer、审批条、弹层和状态栏布局。
• 将聊天线程的滚动职责集中到虚拟列表 scroller，并加入尊重用户手动滚动的流式自动跟随逻辑。
• 将 clickable div/span 替换为语义化 button/dialog 结构，并补齐必要的键盘与焦点行为。
• 移除 reasoning card 中的 dangerouslySetInnerHTML，改用 React node 渲染内联高亮。
• 将触达路径中的 index key 替换为基于内容的稳定 key。
• 将 JumpBar 改为通过 react-virtuoso scrollToIndex 跳转，通过可见范围同步当前状态，并弱化默认视觉权重，仅在 hover/focus 时强调显示。
• 新增 lint:desktop、build:desktop、verify:desktop，扩展 npm run lint 和 npm run verify，并让 CI 安装和构建桌面端依赖。
• 更新 PR checklist，要求涉及桌面 UI 的 PR 明确验证桌面端交互。
• 通过 Vite manualChunks 拆出 vendor-react、vendor-markdown、vendor-code、vendor-ui、vendor-tauri。

本次集中优化点

• 聊天体验：滚动更顺畅，空白更少，流式输出可以实时跟随刷新。
• 交互可靠性：语义化控件、键盘可用、弹层更安全、按钮不再容易堵塞，JumpBar 在虚拟列表中也能可靠跳转。
• 桌面布局韧性：紧凑侧边栏、窄宽度截断、稳定控件尺寸、响应式约束更完整。
• 回归防护：桌面端 lint/build 进入本地和 CI 门禁，PR 模板也要求桌面 UI 验证。
• 打包健康度：桌面主 JS chunk 从约 1,077 KB 降到约 285 KB，最大 vendor chunk 也低于默认 500 KB 警告阈值。

验证

• npm run lint:desktop
• npm run build:desktop
• npm run lint
• pre-push hook 自动执行的 npm run verify
• npx vitest run tests/desktop-sidebar-new-chat-layout.test.ts

[SivanCola]

@codex review

[chatgpt-codex-connector]

Codex Review: Didn't find any major issues. 👍

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[SivanCola]

Resolved the merge conflicts with upstream/main in commit 68fa9de.

Root cause: upstream/main changed the same desktop surfaces as this PR, especially App.tsx, composer, Markdown/file pills, context panel, styles, and JumpBar behavior.

Technical approach: merged upstream MCP/context-panel and composer token-highlight changes, kept this PR's virtualized JumpBar navigation and desktop scroll/approval-tray UX fixes, then formatted the affected desktop files under the current Biome gate.

Verification:

• npm run lint:desktop
• npm run build:desktop
• npm run test -- desktop/src/ui/jump-bar.test.tsx desktop/src/ui/composer-at-popup.test.tsx desktop/src/ui/context-panel.test.tsx desktop/src/App.test.ts
• pre-push npm run verify

中文说明：已在 68fa9de 解决与 upstream/main 的合并冲突。

问题原因：upstream/main 和本 PR 同时修改了桌面端 App、composer、Markdown 文件标签、context panel、styles 以及 JumpBar 相关区域。

技术方案：保留 upstream 的 MCP/context-panel 与 composer token 高亮等新增能力，同时保留本 PR 的虚拟列表 JumpBar 跳转、滚动跟随和审批托盘等桌面 UX 修复，并按当前 Biome 门禁格式化受影响文件。

验证：上述 desktop focused checks 和 pre-push 的完整 npm run verify 均已通过。