Skip to content

feat(chat): improve attachment label display#242

Merged
remarkablemark merged 2 commits into
masterfrom
feat/attachments
Jul 12, 2026
Merged

feat(chat): improve attachment label display#242
remarkablemark merged 2 commits into
masterfrom
feat/attachments

Conversation

@remarkablemark

@remarkablemark remarkablemark commented Jul 12, 2026

Copy link
Copy Markdown
Member

What is the motivation for this pull request?

Improve how image attachments are labeled in the chat UI — both in the input prefix and in rendered messages.

plan.md

What is the current behavior?

  • Clipboard-pasted images display their raw temp filename (e.g. [some-uuid.png]).
  • Pasting an image into the middle of existing input text could drop or misplace the surrounding text.

What is the new behavior?

  • Clipboard images are numbered sequentially as Image 1, Image 2, etc.; file-path attachments continue to show their basename (e.g. [diagram.png]).
  • A new getAttachmentLabels helper centralises this logic and is shared by both ChatInput and Message.
  • getInsertedText correctly isolates only the pasted segment so that prefix/suffix text around the cursor is preserved when an image is pasted mid-input.

Checklist:

Display clipboard-pasted temporary images as `[Image 1]`, `[Image 2]`, while preserving actual filenames for drag-and-drop and pasted-path attachments. Keep labels consistent after submission.

Changes:

- Add a shared attachment-label helper that identifies clipboard images by their location under `TEMP_IMAGES_DIRECTORY`.
- Number only clipboard images in attachment order; mixed input should render like `[Image 1] [diagram.png] [Image 2]`.
- Use the helper in both `ChatInput` and submitted user-message rendering.
- Keep attachment paths, submission payloads, cleanup behavior, and session storage unchanged.
- Preserve filename labels for all non-clipboard attachments.
Images dropped directly beside or within existing text now become attachment
badges, while surrounding text and cursor position are preserved.

The fix is to detect the newly inserted drag-and-drop substring by comparing
the previous and next input values, then extract the image from that inserted
segment. That would support dropping an image directly beside existing text
without requiring a space.
@codecov

codecov Bot commented Jul 12, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.

Files with missing lines Coverage Δ
src/components/Chat/ChatInput.tsx 100.00% <100.00%> (ø)
src/components/Chat/attachments.ts 100.00% <100.00%> (ø)
src/components/Messages/Message.tsx 100.00% <100.00%> (ø)
🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@remarkablemark remarkablemark self-assigned this Jul 12, 2026
@remarkablemark remarkablemark added bug Something isn't working enhancement New feature or request labels Jul 12, 2026
@remarkablemark remarkablemark merged commit c4168d7 into master Jul 12, 2026
18 checks passed
@remarkablemark remarkablemark deleted the feat/attachments branch July 12, 2026 06:36
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bug Something isn't working enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant