Commit 3143335fc3a568cbbb5174764961889272135cb9 | the-knife

author	Afonso Ferreira <99990310+Aforno@users.noreply.github.com> 2026-10-07 23:58:53+01:00
committer	GitHub <noreply@github.com> 2026-10-07 17:58:53-05:00
log	3143335fc3a568cbbb5174764961889272135cb9
tree	112c81e1487de6d945d57da3495f99a71b6bfbf5
parent	46dd0949053ae387e785c5e9801725a9ccc28de1
signature	Signed by PGP key B5690EEEBB952194

fix(web): cancelling a new citation no longer leaves a stray space (#16828)

2 files changed, 31 insertions(+), 14 deletions(-)

apps
- web
  - src
    components
    ComposerPromptEditorTiptap.tsx
    chat
    ChatComposer.tsx

apps/web/src/components/ComposerPromptEditorTiptap.tsx+18-12

 @@ -183,12 +183,16 @@ export type ComposerCitationCommentRequest = {
   value: string;
   citationStart: number;
   sourceAnchor: AssistantCitationSourceAnchor;
+  insertedSpaces: CitationInsertedSpaces;
 };
+// Spaces added around a freshly inserted citation, removed with it if its comment is cancelled.
+type CitationInsertedSpaces = { before: boolean; after: boolean };
 type OpenCitationComment = {
   key: string;
   sourceAnchor?: AssistantCitationSourceAnchor;
-  removeOnCancel?: boolean;
+  removeOnCancel?: CitationInsertedSpaces;
 };
 const ComposerCitationCommentContext = createContext<{
 @@ -392,18 +396,20 @@ function ComposerCitationNodeView({ node, editor, getPos }: NodeViewProps) {
     [editor, nodePos],
   );
+  // Undo a fresh insertion: drop the chip and the spaces inserted with it.
+  const removeOnCancel = commentTarget?.removeOnCancel;
   const onRemove = useCallback(() => {
-    if (!editor.isEditable) return;
+    if (!editor.isEditable || !removeOnCancel) return;
     const pos = nodePos();
     if (pos === null) return;
-    const current = editor.state.doc.nodeAt(pos);
+    const { doc } = editor.state;
+    const current = doc.nodeAt(pos);
     if (!current) return;
-    editor
+    const end = pos + current.nodeSize;
-      .chain()
+    const from = removeOnCancel.before && doc.textBetween(pos - 1, pos) === " " ? pos - 1 : pos;
-      .focus()
+    const to = removeOnCancel.after && doc.textBetween(end, end + 1) === " " ? end + 1 : end;
-      .deleteRange({ from: pos, to: pos + current.nodeSize })
+    editor.chain().focus().deleteRange({ from, to }).run();
-      .run();
+  }, [editor, nodePos, removeOnCancel]);
-  }, [editor, nodePos]);
   // Put the caret right after the chip so Enter sends and typing continues the prompt.
   const onRestoreFocus = useCallback(() => {
 @@ -450,7 +456,7 @@ function ComposerCitationNodeView({ node, editor, getPos }: NodeViewProps) {
             if (open && !editor.isEditable) return;
             commentContext.onOpenChange(citeKey, open);
           },
-          ...(commentTarget?.removeOnCancel ? { onCancel: onRemove } : {}),
+          ...(removeOnCancel ? { onCancel: onRemove } : {}),
           onSave: onSaveComment,
           onSaveAndSend: (comment) => {
             if (!onSaveComment(comment)) return false;
 @@ -1531,7 +1537,7 @@ function ComposerPromptEditorTiptapInner(props: ComposerPromptEditorProps) {
           setOpenCitation({
             key: citeKey,
             sourceAnchor: pendingCitation.sourceAnchor,
-            removeOnCancel: true,
+            removeOnCancel: pendingCitation.insertedSpaces,
           });
         }
       }
 @@ -1618,7 +1624,7 @@ function ComposerPromptEditorTiptapInner(props: ComposerPromptEditorProps) {
           setOpenCitation({
             key: citeKey,
             sourceAnchor: request.sourceAnchor,
-            removeOnCancel: true,
+            removeOnCancel: request.insertedSpaces,
           });
         }
       },

apps/web/src/components/chat/ChatComposer.tsx+13-2

 @@ -200,7 +200,11 @@ import {
   shouldUseRestingComposerLayout,
 } from "../composerFooterLayout";
 import { measureRestingComposerControls } from "./restingComposerControlsMeasurement";
-import { type ComposerPromptEditorHandle, ComposerPromptEditor } from "../ComposerPromptEditor";
+import {
+  type ComposerCitationCommentRequest,
+  type ComposerPromptEditorHandle,
+  ComposerPromptEditor,
+} from "../ComposerPromptEditor";
 import {
   ComposerContextActionsContext,
   composerContextRecordsFromDraft,
 @@ -3832,7 +3836,11 @@ export const ChatComposer = memo(function ChatComposer(props: ChatComposerProps)
         expectedText?: string;
         expandedCursorAfterReplace?: number;
         focusEditorAfterReplace?: boolean;
-        citationComment?: { start: number; sourceAnchor: AssistantCitationSourceAnchor };
+        citationComment?: {
+          start: number;
+          sourceAnchor: AssistantCitationSourceAnchor;
+          insertedSpaces: ComposerCitationCommentRequest["insertedSpaces"];
+        };
       },
     ): boolean => {
       if (
 @@ -3862,6 +3870,7 @@ export const ChatComposer = memo(function ChatComposer(props: ChatComposerProps)
           value: next.text,
           citationStart: options.citationComment.start,
           sourceAnchor: options.citationComment.sourceAnchor,
+          insertedSpaces: options.citationComment.insertedSpaces,
         });
       }
       promptRef.current = next.text;
 @@ -6122,6 +6131,8 @@ export const ChatComposer = memo(function ChatComposer(props: ChatComposerProps)
               citationComment: {
                 start: cursor + (needsLeadingSpace ? 1 : 0),
                 sourceAnchor: options.citationCommentAnchor,
+                // An existing space after the cursor is consumed and re-emitted, so it stays.
+                insertedSpaces: { before: needsLeadingSpace, after: rangeEnd === cursor },
               },
               focusEditorAfterReplace: false,
             }