makecindy / makecindy/cindy

feat: 引用块(QuoteChip)右上角增加小删除按钮,支持快捷移除添加到对话的文字

Open
#3,172 1 comment 0 reactions 0 assignees View on GitHub
feature
Dominant language
TypeScript
Stars
2.7k
Forks
401
Avg merge
21h 48m
Merged PRs (30d)
776

Description

**提交人**: HalFree
**客户端版本**: 0.1.58

---

## 使用场景 / Use case

在会话消息流中选中回答文字,选区上方会浮出「添加到对话」按钮(SelectionQuoteButton);点击后该段文字作为引用块(QuoteChip)进入当前会话草稿/消息,便于把模型回答中的片段继续追问或引用。

## 当前痛点 / Pain

`QuoteChip` 源码注释明确写明「输入框与消息气泡复用同一套紧凑尺寸……**均不显示关闭按钮**」。这意味着:一旦把某段文字添加进对话,**没有对该小段引用的快捷删除入口**——用户若误加、或加完不想用了,只能清空整段草稿或手动改文本,无法精准移除这一颗引用胶囊。

## 诉求 / Ask

在添加进对话的那小段引用块(QuoteChip)右上角增加一个小的删除按钮,点击即从对话草稿/消息中移除该条引用,不影响其它内容与原文。交互保持轻量、低调(小号图标,hover 显现或常驻小尺寸)。

## 建议方案 / Proposal

**数据层**:引用为 `ChatQuote`(`apps/desktop/src/renderer/lib/chatQuotes.ts`),草稿引用存于 `composerDraftStore`(已有 `appendQuoteToDraft`)。建议对称新增按 id/索引移除引用的方法(如 `removeQuoteFromDraft`),草稿态删除直接走此通道。

**视图层**:
- 改动 `apps/desktop/src/renderer/components/chat/QuoteChip.tsx`(及底层 `InlineReferenceChip`),新增可选 `onRemove` prop;传入时渲染右上角小删除按钮。
- 区分两种场景:输入框草稿内的引用(可删,低风险)vs 已发送消息气泡内的引用(删除涉及消息持久化,需评估是否一并支持)。
- 复用现有 `lucide-react` 图标与 tooltip 体系,保持与现有 action 风格一致。

**范围建议(一期)**:优先支持**草稿/输入框内引用块**的快捷删除(改动最小、风险最低、覆盖绝大多数「加完想反悔」场景);已发送消息内的引用删除列为后续,需单独评估持久化影响。

**关键约束**:
1. 删除只移除该条引用胶囊,不动原文消息、不动其它引用。
2. 草稿态删除可撤销(用户未知是否需 Undo,建议至少不破坏发送)。
3. 已发送消息内的引用删除若一期不做,按钮在该场景不显示,保持现状。

## 关联

- 添加入口:`apps/desktop/src/renderer/components/chat/SelectionQuoteButton.tsx`
- 引用渲染:`apps/desktop/src/renderer/components/chat/QuoteChip.tsx`、`InlineReferenceChip.tsx`
- 草稿存储:`apps/desktop/src/renderer/lib/composerDraftStore.ts`

## 验收 / Acceptance

- [ ] 草稿/输入框内的引用块右上角出现小删除按钮。
- [ ] 点击删除该条引用,其它内容与原文不受影响。
- [ ] 空引用态(删到最后一条)输入框恢复正常可发送状态。
- [ ] 已发送消息内引用:一期不显示删除按钮(或按评估支持,并在提案注明)。
- [ ] 覆盖基础单测(参考 `selectionQuote*`、`chatQuotes` 相关测试)。
---
**版本区域**: CN
**OS**: win32 x64 (10.0.26200)
**界面语言**: zh-CN

Contributor guide

Open the contributing guide

Research direction

Start with apps/desktop/src/renderer/components/chat/QuoteChip.tsx and InlineReferenceChip.tsx, then trace draft updates through composerDraftStore.ts and appendQuoteToDraft. Review the related selectionQuote* and chatQuotes tests before changing behavior. Done means draft quotes can be removed individually without affecting other content, empty drafts remain sendable, and sent-message quotes show no removal control in this phase.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Active
Clarity
Mostly clear
Newbie friendliness
74/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.