对话页换成组件库，桌面旁边可以打开本命盘（#106）。
输入框里左边选模型、右边发送。回答下的赞、踩、复制、重新生成和追问改用组件库按钮。不满意原因和兑换窗改用对话框，句子不变。桌面顶栏可以打开当前人物的本命盘，能拖宽，刷新后还在；手机没有这个入口。当前会话和流式状态从 Home() 移进已有会话 store，useState 从 33 减到 25。流式、停止、排队、撤回、退点和寒暄免费没有改。 自测：tsc 退出码 0；lint 0 error、122 条警告；定向测试 275 通过、失败 0、取消 0；npm run build 退出码 0，/ 仍是 Static。首屏 gzip-9 639127，相对基线 634528 多 0.72%。隐私标记测试退出码 0。 Co-Authored-By: Grok (agent loop)
This commit is contained in:
jesse-ux
co-authored by
Grok (agent loop)
Grok (agent loop)
parent
e4e240bf86
commit
d25dfdbe1a
@@ -19430,3 +19430,19 @@
|
||||
- 复发自：无
|
||||
- 修复版本：分支 `codex/ui-kit-1-shell-20261023`。
|
||||
|
||||
## BUG-1434 | 对话页换成组件库，旁边可以打开本命盘
|
||||
|
||||
- 状态：enhancement
|
||||
- 首次发现：2026-10-25
|
||||
- 最近更新：2026-10-25
|
||||
- 影响面：首页对话输入框、模型选择、回答下的操作、追问、不满意原因、兑换窗、桌面对话旁边的本命盘。星盘页本身不在这次里。
|
||||
- 用户现象：输入框里左边选模型，右边发送。价格只在模型菜单里。回答下面仍是赞、踩、复制、重新生成。桌面上可以在对话旁边打开当前人物的本命盘，能拖宽，刷新后还在。手机上看不到这个入口。
|
||||
- 触发条件：打开首页对话。本命盘按钮在视口已判定为桌面（不小于 768）之后出现。打开后面板才去取本命盘。
|
||||
- 根因：不是缺陷。组件库迁移的对话页这一张（任务书 K2，决策 D4、D5、D7、D8、D9）。
|
||||
- 修复：输入框、模型菜单、回答操作、追问、不满意原因、兑换窗和跳到最新改用已有的组件库零件。当前会话、流式和反馈状态从 `Home()` 移进已有的会话 store，`Home()` 的 useState 从 33 减到 25，useRef 仍是 37。本命盘放在可拖分栏里，宽 280–560，默认 360，开着和宽度记在本机；绘制复用星盘页的图，第一次打开才载入。手机不显示入口，也不把「开着」写成关掉。流式逐字、停止、排队、撤回、退点和寒暄免费没有改。
|
||||
- 验证：见 `docs/tasks/PROGRESS-ui-kit-2-chat-20261023.md`。没有浏览器登录态，不把发过一条对话或拖过本命盘写成已经在浏览器里做过。
|
||||
- 防复发：`frontend/tests/chat-chart-panel-state.test.ts` 锁住本机记忆、宽度夹取、手机无入口，以及页面不把可拖分栏和星盘绘制打进同步包。对话回归锁住流式、停止、排队、撤回、退点和寒暄免费。增长合同锁住 `Home()` 的 hook 数不升。白名单测试锁住名单只减不增。
|
||||
- 相关记录：issue #106。任务书 `docs/tasks/TASK-ui-kit-migration-20261023.md` 的 K2。前置 #105 的外壳、#99 的启程动效。
|
||||
- 复发自：无
|
||||
- 修复版本：分支 `codex/ui-kit-2-chat-20261023`。
|
||||
|
||||
|
||||
@@ -0,0 +1,57 @@
|
||||
# PROGRESS · 组件库 K2 对话页（2026-10-25）
|
||||
|
||||
工单 #106。分支 `codex/ui-kit-2-chat-20261023`。基线 `origin/staging` `e4e240bf863b49e75bf9c7e1ba54b40cb1265f64`（#105 新侧栏和 #99 启程动效已在这个提交里）。只做任务书 **K2 对话页**。K0、K1 已完成，K3 及之后没做。
|
||||
|
||||
## 结论
|
||||
|
||||
输入框里左边选模型，右边发送。各模型的价格只写在菜单里。回答下面仍是赞、踩、复制、重新生成。桌面上可以在对话旁边打开当前人物的本命盘，能拖宽，也能收起，刷新后还在。手机上看不到这个入口。发消息、停止、排队、撤回、退点和寒暄免费没有改。
|
||||
|
||||
## 做了什么
|
||||
|
||||
- 输入框改用组件库的组合输入。底边左边是模型菜单，只显示名字；「N 点」只在菜单项里。右边是圆形发送，和框的底边对齐。停止、排队召回和「内容由 AI 生成」仍在。模型菜单走外壳已经在用的延后载入：库还没到时，按钮上仍是当前模型名，点开还没有菜单。
|
||||
- 赞、踩、复制、重新生成是图标按钮，各有提示。不满意原因和兑换窗改用对话框，句子不改。追问是描边小按钮，仍用启程进场依次浮出（260ms，间隔 64ms），没有另写时长。跳到最新和今日星语入口改用组件库按钮，原来的尺寸类还在。
|
||||
- 当前会话、咨询阶段、停止中的标记、排队中的会话和请求、流式回答、赞踩和「已复制」从 `Home()` 移进已有的会话 store。消息列表本来就在会话列表里，跟着同一份 store。`Home()` 的 useState 从 33 减到 25。useRef 开工时是 37，做完仍是 37，没有新加。`page.tsx` 从 1419 行到 1450 行，粗护栏是 1567。`useSessionManagement` 仍在 `useRectificationSurface` 前面。
|
||||
- 桌面顶栏、点数右边，是打开或收起本命盘的图标按钮，提示「打开本命盘」或「收起本命盘」。面板在可拖分栏里，宽 280–560，默认 360。开着和宽度记在本机 `chat_chart_panel_open`、`chat_chart_panel_width`。收起不把宽度写成 0。手机视口还没定、或小于 768 时不显示按钮，也不因为藏起来就把「开着」写成关掉。
|
||||
- 面板里是当前人物的本命盘，复用星盘页的绘制。只取本命分盘这一层。缓存里的盘必须是同一个人，否则重新取。没有骨架，也没有「正在加载」。不标星盘页那一次「画出来」的标记。可拖分栏和星盘绘制都在第一次打开后面才载入。外层对话网格没有改，里面用一列重复原来的行高，次级页面不包这一列。
|
||||
- 流式逐字仍在 `chat-message-row.tsx`，这个文件没有改。消息进场仍是已有的 Motion。扣点和落库没有改。
|
||||
- 白名单去掉 9 个已经不再违规的文件，没有加长，也没有改测试里写死的基线名单。
|
||||
- 没有改 `.gitea/**`，没有改生产部署，没有动数据库，没有给 `scripts/jyotish_api_server.py` 加方法。没有重做 #99 的动效时长。
|
||||
|
||||
## 断言改动（原值 / 新值 / 原因）
|
||||
|
||||
| 位置 | 原值 | 新值 | 原因 |
|
||||
| --- | --- | --- | --- |
|
||||
| 输入框 | `<Textarea` 直接放在表单里，并带 `ref={inputRef}` | `<InputGroupTextarea`，仍绑定同一份草稿和同一个 ref | 输入框改用组合输入。聚焦和草稿订阅不变 |
|
||||
| 跳到最新 | `<button` | `<Button`，仍是 `type="button"` | 改用组件库按钮。类名、焦点环和 44px 目标不变 |
|
||||
| 今日星语 | `<button className="starter-entry"` | `<Button className="starter-entry"` | 改用组件库按钮。36px 胶囊和 44px 点按区仍由原来的类决定 |
|
||||
| 兑换窗 | 自绘遮罩 `account-modal-overlay`，并用 `createPortal` | `Dialog`，内容类名仍是 `account-modal paywall-modal` | 改用组件库对话框。文案和这些类名留下 |
|
||||
| 不满意原因 | 文件顶部静态引入，只在挂载容器里找文案 | 先建好测试文档再动态引入，容器和 `document.body` 都找 | 对话框在模块加载时才决定把内容挂到 body。测试文档必须先就位。提交、原因顺序和补充说明仍在 |
|
||||
| 白名单 | 含首页和 8 个对话零件 | 这 9 个移出 | 它们已经改用组件库。名单只许变短 |
|
||||
|
||||
移出的 9 个文件：`page.tsx`、`chat-composer.tsx`、`chat-message-actions.tsx`、`conversation-follow-ups.tsx`、`jump-to-latest-button.tsx`、`model-selector.tsx`、`onboarding-redeem-paywall.tsx`、`reply-down-reason.tsx`、`starter-home.tsx`。
|
||||
|
||||
## 自测
|
||||
|
||||
| 检查 | 命令 | 结果 |
|
||||
| --- | --- | --- |
|
||||
| 类型 | 仓库根 `frontend\node_modules\.bin\tsc --noEmit -p frontend` | 退出码 0 |
|
||||
| 检查 | 在 `frontend` 下 `npm run lint` | 退出码 0。122 个警告，0 error |
|
||||
| 定向测试 | 在 `frontend` 下 `node --import tsx --test` 下面列出的文件 | 275 条，通过 275，失败 0，取消 0 |
|
||||
| 构建 | 在 `frontend` 下 `npm run build` | 退出码 0。编译 8.2s，TypeScript 17.3s。`/` 仍是 ○ Static。5 条既有 skill-package-registry 警告，没有改 |
|
||||
| 首屏体积 | 首页 HTML 引用的 `/_next/static/**.js`，gzip-9 相加，不含 CSS | 基线 `e4e240bf`：36 个文件，缺失 0，634528 字节。本单：36 个文件，缺失 0，639127 字节，多 4599（+0.72%）。±2% 上限 647219 |
|
||||
|
||||
定向测试文件：`account-dialog-inert-20260918.test.ts`、`ai-generated-notice-20261014.test.ts`、`character-remaining-contract.test.ts`、`chat-chart-panel-state.test.ts`、`chat-composer-queue.test.ts`、`chat-message-actions.test.ts`、`chat-navigation-a11y-contract.test.ts`、`chat-stream-layout.test.ts`、`composer-isolation-contract.test.ts`、`consult-first-frame-and-pacing-20260928.test.tsx`、`consultation-entrypoint.test.ts`、`consultation-recovery.test.ts`、`consultation-smalltalk-ui.test.tsx`、`consultation-smalltalk.test.ts`、`home-shell-growth-contract.test.ts`、`home-streaming-render-split.test.ts`、`home-warm-return-lifecycle.test.tsx`、`membership-page.test.ts`、`onboarding-checklist-20261022.test.ts`、`rectification-agentic-entry.test.ts`、`rectification-grounding-regenerate-20260927.test.ts`、`reply-quality-20260930.test.tsx`、`session-conversation-layout.test.ts`、`session-list-lifecycle.test.tsx`、`starter-entry-soften.test.ts`、`stream-text-response.test.ts`、`ui-kit-whitelist.test.ts`。
|
||||
|
||||
`Home()` hook：开工 useState 33、useRef 37、`page.tsx` 1419 行。做完 useState 25、useRef 37、1450 行。上限是 useState 36、useRef 37、1567 行。
|
||||
|
||||
没有跑前端全量 `npm test`，没有跑 Python 快速门，没有跑 `test:db`。Python 入口和 `scripts/jyotish_api_server.py` 没有改。
|
||||
|
||||
## 偏离
|
||||
|
||||
- 测试用的假文档补了 `documentElement`、`dataset`、`style.setProperty`、`requestAnimationFrame` 和 `children`。组件库对话框要这些才能把内容挂出来。产品页面没有为测试改行为。
|
||||
- 不满意原因的测试改成先建好文档再载入组件。同一份原因、补充说明和提交仍会发出去。
|
||||
- 第一次构建把模型菜单静态打进首页脚本，gzip-9 是 655070（38 个文件，+20542，+3.24%，超出 ±2%）。模型菜单改走外壳已有的延后载入后再构建。延后载入后的首屏里，`dropdown-menu`、`chat-chart-split`、`chat-natal-chart`、`react-resizable-panels` 都是 0。`ResizablePanelGroup` 与 `VedicChartSvg` 的首屏命中数和基线一样（1 和 2）；多出来的绘制和分栏只在未写进首页 HTML 的脚本里。库还没到时，模型按钮上仍是当前模型名。
|
||||
|
||||
## 环境缺口
|
||||
|
||||
- 没有登录态。没有在浏览器里发过一条对话，没有点过停止，没有拖过本命盘。本机记忆由测试读写 `chat_chart_panel_open` 和 `chat_chart_panel_width` 证明。可照做的步骤在 `docs/testing/ui-kit-migration-20261023.md` 的「对话」一节。
|
||||
@@ -21,3 +21,11 @@
|
||||
2. 顶栏点数是硬币图标加数字。读屏能听到「点」，眼睛看不到这个字。
|
||||
3. 设置里仍是个人资料、账户与点数、通用设置。退出登录要再确认一次。反馈与投诉仍能打开。
|
||||
4. 建完档的账户，右上角启程清单还在，点数按钮的左边。
|
||||
|
||||
## 对话
|
||||
|
||||
1. 输入框里，左边是模型名字，右边是圆形发送。点开模型，每一项旁边才有「N 点」。顶栏不再放模型选择。
|
||||
2. 发出一条消息，可以停止。停止后该退的点仍退。寒暄不扣点。回答被撤下时仍不扣点。
|
||||
3. 回答下面可以赞、踩、复制。点踩之后可以选原因，也可以什么都不选就提交。兑换窗的句子和以前一样。
|
||||
4. 桌面上，点数右边有一个打开本命盘的按钮。打开后是当前人物的本命盘。拖右缘，宽度停在大约 280 到 560 像素。收起后再打开，宽度还在。刷新页面，开着和宽度都还在。
|
||||
5. 把窗口改成大约 375 像素宽。顶栏没有打开本命盘的按钮。
|
||||
|
||||
Reference in New Issue
Block a user