feat(web): arrow through a message's images as one gallery

[brahimhamichan]

Problem

When an assistant response embeds several images, clicking one opens the expanded preview with only that image. The dialog already supports multi-image navigation (arrow keys, chevrons, an n/m counter) — user attachment rows use it — but markdown images always pass a single-item list, so sequential images can't be flipped through.

Change

Preview-enabled markdown images in the same message body now form one gallery in document order. Each image registers its full preview item (including originalUrl and media actions) keyed by its element, and a click assembles the gallery from the message scope, so the existing dialog navigation works across all of them. Linked images and link favicons stay out of the gallery, and images outside a message body (e.g. the work-log viewed image) keep their single-image preview.

No new UI: this only feeds the existing ExpandedImageDialog navigation, so there's no added rendering cost while the timeline is idle.

Verification

• New unit tests: document-order collection with the clicked index, preservation of per-image media actions, unregistered siblings skipped, single-image fallback outside a message, and gallery membership markers (linked images excluded).
• vp test run apps/web/src/components/ChatMarkdown.gallery.test.tsx — 5 passed.
• Verified by hand in a locally installed build: clicking any of four images in one response and arrowing through them (clip incoming below).

---

Written by Claude Fable 5 on Claude Code.

---

Note

Low Risk
Localized chat markdown preview behavior with unit tests; reuses existing ExpandedImageDialog navigation and no auth or data-path changes.

Overview
Markdown image previews in a single message now open as one gallery, so the existing expanded-image dialog can move between them in document order (arrows/chevrons) instead of always showing only the clicked image.

Preview-enabled standalone images register their full ExpandedImageItem (including originalUrl and media actions) on mount via a data-preview-image marker and a WeakMap; on expand, markdownImageGalleryPreview gathers all marked siblings under the same .chat-markdown scope. Linked images and link favicons stay excluded (still gated by MarkdownLinkContext), and images outside a message body fall back to a single-item preview.

Adds ChatMarkdown.gallery.test.tsx covering gallery ordering/index, skipped unregistered siblings, orphan fallback, and membership vs linked-image exclusion.

^{Reviewed by Cursor Bugbot for commit 208b0dd. Bugbot is set up for automated code reviews on this repo. Configure here.}

Note

Add arrow-through image gallery preview to ChatMarkdown messages

• Adds a WeakMap registry and registerMarkdownGalleryImage utility that associate each mounted preview-enabled markdown image element with its expanded-image item.
• Adds markdownImageGalleryPreview, which finds marked images under the clicked image's nearest .chat-markdown ancestor, returns their registered items in document order with the correct clicked index, and falls back to a single-image preview outside a message scope.
• Updates expandableMarkdownImageProps to register each image via ref, emit the gallery marker attribute, and pass the computed gallery preview to the expansion callback instead of a one-image preview.
• Linked images and link favicons are excluded from gallery membership; each image still retains its individual source and action metadata.
• Risk: markdownImageGalleryPreview relies on the .chat-markdown ancestor and the marker attribute on img elements in ChatMarkdown.tsx; images rendered outside that scope or without registration fall back to single-image preview.

^{Macroscope summarized 208b0dd.}

Screenshots

Four inline images in one assistant response:

After clicking the first image and pressing the right arrow key — the dialog shows the second image with the (2/4) counter and both navigation chevrons:

[macroscopeapp]

Approvability

Verdict: Not approved

Macroscope's review found this PR not approvable — This changes the default interaction for expandable markdown images by introducing gallery navigation across images in a message. The implementation is localized and tested, but the user-facing behavior is a new capability on an existing production path.

^{You can add or adjust custom eligibility rules. Learn more.}

[juliusmarminge]

Superseded by #10625 (merged) — markdown images in a message now form one gallery with arrow navigation on main.