Repository navigation
feat(composer): add delete button to QuoteChip for draft quote removal - #3200
Battleplus wants to merge 37 commits into
Conversation
Add a small delete button (X icon) to QuoteChip that appears when an `onRemove` callback is provided. This allows users to quickly remove individual quotes from the composer draft without having to select and delete the atomic node. Changes: - Add `removeQuoteFromComposerDocument` to composerQuoteDocument.ts - Add `removeQuoteFromDraft` to composerDraftStore.ts - Add `onRemove` prop to QuoteChip component - Wire up delete button in ComposerQuoteNode to use editor commands The delete button: - Only appears on hover (opacity-0 → opacity-100) - Stops event propagation to prevent editor selection changes - Uses the editor's deleteRange command for proper undo support - Is positioned absolutely at top-right of the chip Refs makecindy#3172 Signed-off-by: Battleplus <3559424769@qq.com>
|
| Filename | Overview |
|---|---|
| apps/desktop/src/renderer/components/chat/QuoteChip.tsx | 保持引用 chip 为纯展示组件，并调整说明文字与引号实体。 |
| apps/desktop/src/renderer/components/new-chat/ComposerQuoteNode.tsx | 在原子引用节点外层新增可悬停、可键盘操作且保留撤销能力的删除控件。 |
| apps/desktop/src/renderer/lib/composerDraftStore.ts | 新增从指定会话草稿移除匹配引用并保存更新文档的入口。 |
| apps/desktop/src/renderer/lib/composerQuoteDocument.ts | 新增依据文本与来源元数据移除引用节点并规范化空段落的文档转换函数。 |
Reviews (13): Last reviewed commit: "fix(quote-chip): use i18n for remove but..." | Re-trigger Greptile
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 47c279d71e
ℹ️ 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".
|
这条 PR 改了输入框引用块的交互（草稿 QuoteChip 增加删除按钮），需要维护者确认后再合并。请维护者直接在本 PR 上 Approve；若要修改请 Request Changes，作者改完后再 Approve。讨论 issue：#3203 |
|
命中 UI 路径但 description 未附界面效果证据——建议补充改动后效果：截图/录屏，或改动后界面的 HTML 页面（```html 代码块、.html 附件或在线预览链接），便于确认界面符合 DESIGN.md 设计规范。 这不是合并阻断，补上即可。 |
c83487e to
6924cd2
Compare
|
已修复 group-hover 问题：
现在 hover 到引用块时，右上角的 X 删除按钮会正确显示。请 re-review。 |
|
@Battleplus 👋 这个 PR 还有 4 条 review conversation 没 resolve(apps/desktop/src/renderer/components/new-chat/ComposerQuoteNode.tsx / apps/desktop/src/renderer/components/chat/QuoteChip.tsx),auto-review 因此暂时跳过、没法继续审查 / 合并。 如果你已经按评论改完或回应了,请到对应 thread 上点 Resolve conversation;全部 resolve 后,下一轮 auto-review 会自动重新审查这个 PR。 |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 537e1dd63a
ℹ️ 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".
|
@Battleplus 👋 这个 PR 还有 4 条 review conversation 没 resolve(apps/desktop/src/renderer/components/new-chat/ComposerQuoteNode.tsx / apps/desktop/src/renderer/components/chat/QuoteChip.tsx),auto-review 因此暂时跳过、没法继续审查 / 合并。 如果你已经按评论改完或回应了,请到对应 thread 上点 Resolve conversation;全部 resolve 后,下一轮 auto-review 会自动重新审查这个 PR。 |
|
@Battleplus 👋 这个 PR 还有 5 条 review conversation 没 resolve(apps/desktop/src/renderer/components/new-chat/ComposerQuoteNode.tsx / apps/desktop/src/renderer/components/chat/QuoteChip.tsx),auto-review 因此暂时跳过、没法继续审查 / 合并。 如果你已经按评论改完或回应了,请到对应 thread 上点 Resolve conversation;全部 resolve 后,下一轮 auto-review 会自动重新审查这个 PR。 |
MagicLizi
left a comment
MagicLizi
left a comment
There was a problem hiding this comment.
审查发现 1 个 P1。
apps/desktop/src/renderer/components/chat/QuoteChip.tsx:57
删除按钮用了 bg-[var(--surface-secondary)]，主题系统没有注册这个 token（colors.ts 的 registerColor 列表里没有）。没有 fallback 时背景是透明的，键盘 focus 只看得到一个裸 ×。请换成已注册 token（例如 --surface-chip-alt 或 idle 用 --surface-hover）。
|
@Battleplus 👋 这个 PR 还有 1 条 review conversation 没 resolve(apps/desktop/src/renderer/components/chat/QuoteChip.tsx),auto-review 因此暂时跳过、没法继续审查 / 合并。 如果你已经按评论改完或回应了,请到对应 thread 上点 Resolve conversation;全部 resolve 后,下一轮 auto-review 会自动重新审查这个 PR。 |
|
已修复 review P1：删除按钮背景改用已注册的 --surface-hover-soft token，避免未注册的 --surface-secondary 在 Light/Dark 主题下解析为空。提交 7daa7a6，并已 resolve 对应 thread。 |
|
@Battleplus 👋 这个 PR 现在在等维护者确认,确认之前流程不会合并它 —— 不是卡住了,也不是在等你再改一版(你推的改动流程都读到了,判的就是最新一版代码)。
这条是流程自动发的状态提醒(同一版代码只发一次),不用回复。 |
|
补充记录：当前 Windows CI 失败为 packages/device-link 的 no link-accept / ACK 重发测试超时，属于与 QuoteChip 修改无关的基础设施/时序测试失败；QuoteChip 相关改动已通过 review，thread 为 0。 |
- Replace unregistered `--surface-secondary` with `--surface-chip-alt` (registered in themes/colors.ts) so the delete button has a visible background in all themes. - Add `group` to parent span and `group-hover:opacity-100` to the delete button so it becomes visible on chip hover instead of staying permanently invisible. Addresses MagicLizi P1 review on makecindy#3200. Signed-off-by: Battleplus <3559424769@qq.com>
7daa7a6 to
5a561ec
Compare
…-button Three-way merge of PR-changed files with latest main. Signed-off-by: Battleplus <3559424769@qq.com>
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: b1396314a7
ℹ️ 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".
|
@e:\开源项目.prwatch_comment_3200.md |
…age changes Addresses codex review P1 items on ComposerQuoteNode.tsx: - Expand the remove button's transparent hit frame to >=24x24px via an ::after pseudo-element while keeping the 10px icon visual size (DESIGN.md §5: hit-testing and mark geometry are independent responsibilities). - Use react-i18next useTranslation() so the delete aria-label and visible Tip refresh on runtime language switch; the previous i18n.t() only read the current value without subscribing to languageChanged. Regenerated docs/design-rules/design-inventory.md (design-inventory gate). Signed-off-by: Battleplus <3559424769@qq.com>
…ve-button # Conflicts: # docs/design-rules/design-inventory.md
…ve-button # Conflicts: # docs/design-rules/design-inventory.md
|
upstream/main 又前进了（+58 commits），已补合并并解决冲突（merge commit 本轮唯一冲突文件是生成文件 |
botInvitation.test.ts (expected 'ready', got 'skills') fails only in the CI shard environment, passes 4/4 locally on Windows; the touched code paths (composer quote-remove button) do not intersect bot invitation IPC. No code change — re-running the workflow. Generated with Codebuff Co-Authored-By: Codebuff <noreply@codebuff.com> Signed-off-by: Battleplus <3559424769@qq.com>
a51a001 to
1ccec74
Compare
The 'ready' stage is reached through a real fs+DB pipeline (skills → avatar → welcome → ready); under parallel CI shard load it can exceed vi.waitFor's 1s default, flaking the Windows unit shard (expected 'ready', got 'skills'). 15s keeps the same assertion while absorbing runner jitter. Generated with Codebuff Co-Authored-By: Codebuff <noreply@codebuff.com> Signed-off-by: Battleplus <3559424769@qq.com>
CI 状态更新（供 review 参考）head 说明一点：上一轮 其余说明见上方合并解决评论（issuecomment-5881443200）。 |
…-button # Conflicts: # docs/design-rules/design-inventory.md
…design inventory
Codex Review SummaryThis comment shows the latest Codex review activity on this pull request.
ℹ️ About Codex in GitHubYour team has set up Codex to review pull requests in this repo. Reviews are triggered when you
Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings. |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 3897203d0c
ℹ️ 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".
|
复核了 #3203 的四条意见。机器人那份分析是基于旧提交
本地复跑 如果方便的话，请重新基于当前 HEAD 走一遍 review（旧分析的锚点已经是历史提交了）。 |
Signed-off-by: Battleplus <3559424769@qq.com>
两条评审意见（makecindy#3200）： 1. 24px 命中区落在滚动裁剪范围之外 .ProseMirror 是 overflow-y-auto 的滚动容器，首行引用几乎贴着裁剪上边界。 命中区原先四周各外扩 5px，其顶部会伸到裁剪边界之外，首行最上面约 5px 实际点不到——看着有 24px 目标，却有一半落空。 改成左右各外扩 5px、向上 0、向下 10px：总尺寸仍是 24×24，但命中框顶边 与可见圆顶边齐平，永远不会越过裁剪边界。可见几何不受影响，右上角仍是 14px 圆 + 10px 图标（DESIGN.md §5：hit-testing 与可见几何是独立职责）。 2. 删除按钮继承了引用节点的原生拖拽 globals.css 为让引用能从标签/图标起手拖拽，对 [data-composer-quote] 的 整棵子树恢复 -webkit-user-drag: element；按钮也在子树内。按下 X 后移动 超过原生拖拽阈值时，Chromium 会就地启动引用拖拽（mousedown 的 stopPropagation 只挡冒泡，不取消默认拖拽），随后 click 被取消，表现为 「按住 X 稍微一拖就删不掉、反而拖走整颗引用」。 三处一起处理： - draggable={false}：HTML 规范里「向上找最近 draggable 祖先」的算法会 在此命中 false 并停止，不再取到外层引用节点； - onDragStart 里 preventDefault + stopPropagation：兜底拦掉仍从按钮起手 的拖拽，并阻止 ProseMirror 把它当成引用节点的拖拽接管； - data-quote-remove + globals.css 新增针对性规则关闭 element drag。 选择器 .ProseMirror [data-composer-quote] button[data-quote-remove] 是 0-3-1，高于子树恢复规则 .ProseMirror :is(...) * 的 0-2-0，能覆盖。 （不用内联 style：csstype 没有 WebkitUserDrag，内联写法无法通过 tsc。） 3. 顺带修掉 CI 上 5 项失败的唯一根因 合并 upstream/main 后 docs/design-rules/design-inventory.md 的 GENERATED 区块与源码不同步，scripts/__tests__/design-inventory.test.mjs 的 「CLI --check 在当前台账上通过」失败；Windows unit tests / verify / verify-checks / Desktop Git integration / Windows runner and database checks 五项都是对它的下游断言（日志里 WINDOWS_RUNNER_CHECKS_RESULT: failure，其余只是 test "$X" = "success"）。用仓库脚本重算后一致。 测试： vitest run src/renderer/__tests__/composerChipPresentation.test.tsx 15 pass / 0 fail（新增 3 条：命中区几何、拖拽拦截 + 拖拽后仍可删除、 -webkit-user-drag 覆盖规则与 data-quote-remove 标记） node scripts/design-inventory.mjs --check ✅ GENERATED 区块最新（54 个 surface） Signed-off-by: Battleplus <3559424769@qq.com>
|
本轮处理小结（新增 1 个提交 修掉的两条 P2
两条均已回帖并关闭。 顺带修掉 CI 上 5 项失败的唯一根因
其余 4 项作业的日志都只是 测试 描述已同步更新：按模板把「引用的设计规范」从原来的「不涉及」改为实际依据的 DESIGN.md §5 与 §14.6（本轮动的就是命中区几何与 icon-only 控件的既有约束），并补齐本轮的自动验证明细与「跨平台差异」风险分类。 |
…-button Resolve generated design-inventory.md by regenerating (54 surfaces). composerChipPresentation.test.tsx: 15/15. Signed-off-by: Battleplus <3559424769@qq.com>
…2-quote-remove-button 唯一冲突是生成文件 docs/design-rules/design-inventory.md（本分支与上游改了同一批 surface 行），按仓库约定取上游版本：本 PR 不新增或删除 design surface， ComposerQuoteNode 已在 `desktop.chat.session` 既有行里，改动只在组件内部， 不影响 surface 统计。 验证：apps/desktop/src/renderer/__tests__/composerChipPresentation.test.tsx 15 passed（本机 worktree）。 Signed-off-by: Battleplus <3559424769@qq.com>
MagicLizi
added
touches:core
这次改了什么
摘要
为 composer 中的引用片段（QuoteChip）添加删除按钮，允许用户从 draft 中移除不需要的引用。
本轮（提交
e3a822f）按评审意见补了两处修正：删除按钮的 24px 命中区不再被 composer 的滚动裁剪吞掉，也不再继承引用节点的原生拖拽。变更类型
fix缺陷修复feat新功能refactor/perf重构或性能优化docs/test/chore文档、测试或工程维护范围
after:-inset-x-[5px] after:top-0 after:bottom-[-10px]，替代原先四周各外扩 5px 的after:inset-[-5px]。draggable={false}+onDragStart拦截 +data-quote-remove，以及globals.css中针对性关闭 element drag 的规则。docs/design-rules/design-inventory.md（合并 upstream/main 后 GENERATED 区块已与源码不同步）。.ProseMirror的 padding 或滚动容器本身（那会影响所有 composer 胶囊的共享布局）。UI 变化
::after提供，可见几何仍是右上角 14px 圆 + 10px 图标；本轮把外扩方向从「四周各 5px」改为「左右各 5px、向上 0、向下 10px」，在保持 24×24 的同时让命中框顶边与可见圆顶边齐平，不再越过.ProseMirror的overflow裁剪上边界。title顶替。本按钮用aria-label+ 共享Tip满足，未改动。怎么验证的
自动验证
新增 3 条的测试价值（§3.2）：
keeps the 24px hit target inside the composer scroll clip by never extending upwardComposerQuoteNodeView按钮 DOMafter:top-0改回对称的after:inset-[-5px]does not inherit the quote node native drag, so a drag from the button cannot swallow the clickfireEvent派发的dragstartdraggable={false}或onDragStart的preventDefaultturns the inherited -webkit-user-drag back off.../tags the remove button...globals.css与组件渲染结果data-quote-remove其中
-webkit-user-drag相关两条按globalsSource的既有做法校验源码：jsdom 的 cssstyle 不认识带前缀的该属性，DOM 上观测不到，可观测的行为由上面那条draggable/defaultPrevented用例覆盖。手工验证
globals.css中把选择器特异度写明（0-3-1 压过子树恢复规则的 0-2-0）。未执行的验证
风险
风险分类
影响与回滚
ComposerQuoteNode.tsx（删除按钮）、globals.css（新增一条针对性规则）、composerChipPresentation.test.tsx（新增用例）、design-inventory.md（重算）。globals.css新增规则的选择器只命中[data-composer-quote] button[data-quote-remove]，不影响 mention 胶囊、粘贴文本胶囊或任何其它button[data-quote-remove]之外的元素。-webkit-user-drag是 Chromium/WebKit 专有属性。Electron（Chromium）上生效；该属性在 Firefox 等引擎上被忽略，但那里本就没有基于它的原生拖拽恢复，行为不变。git revert本轮提交即可回到原行为；连同整个 PR revert 可完全移除删除按钮。无数据迁移、无持久化状态、无协议版本依赖。提交前检查
git commit -s，见 DCO）design-inventory.md已用仓库脚本重算）