Skip to content

agent pane: a gallery stage in a chat loads live, at its own size - #21872

Merged
teamleaderleo merged 8 commits into
feat-cmux-nextfrom
claude/inline-gallery-preview
Oct 19, 2026
Merged

teamleaderleo merged 8 commits into
feat-cmux-nextfrom
claude/inline-gallery-preview

Conversation

@teamleaderleo

@teamleaderleo teamleaderleo commented Oct 19, 2026 •

Copy link
Copy Markdown
Collaborator

When an agent works on a webview component and points its chat at the component's gallery stage (http://localhost:5173/gallery/frame.html?entry=… from bun run dev), the chat's preview card drew it as a quarter-size thumbnail that takes no input and opens a tab when clicked. Now a gallery stage loads live in the card, at its own size, after Load preview. You can use the component right there: open its menus, type in it, resize the card. Any other loopback page keeps the thumbnail.

isGalleryFrame (previewUrl.ts) recognizes a loopback URL whose path ends in /frame.html with an entry query. That covers the dev server's /gallery/ and the live gallery's /live/ mounts. The safety model is unchanged:

  • nothing loads until the reader clicks Load preview;
  • the frame stays sandboxed (allow-scripts allow-same-origin, no forms);
  • only loopback hosts qualify, and the pane's CSP and URL+AgentPanePreview.swift already allow them;
  • no Swift change.

This is the smallest step toward previews next to a chat. The other half, opening a PR's gallery or feed card beside the chat that made it, already works without app changes: cmux browser open <url> from an agent lands beside its own chat through caller.

Before / after

Same gallery stage (agent-pane.effort-picker) in a preview card, after Load preview:

Before: a quarter-size thumbnail, no input After: the component at its own size After: a click inside opens its menu

Evidence

  • bun test src/agent-session/acpmux/conversation/: 24 pass. The new PreviewCard.test.tsx covers:
    • isGalleryFrame cases;
    • a gallery stage loads live: no aria-hidden, focusable, and a click stays in the chat;
    • any other loopback page stays a click-to-open thumbnail.
  • vp check --no-fmt --no-lint: no type errors in 1,549 files.
  • vp lint src/agent-session/acpmux/conversation/: clean.
  • The screenshots come from bun run dev on huge-blue (Linux, headless Chromium through Playwright) using the new gallery-stage variant. "After" shows a click inside the live frame opening the component's Effort menu. "Before" is the same variant with the card reverted to feat-cmux-next.
  • Not run: a native build or the app itself. This changes only webview code, which the app bundles. The gallery-stage variant loads the gallery under its other loopback name, so it needs the dev server; a static matrix capture may show it empty.

No new user-facing strings.

Changelog

  • Added: A component gallery preview in an agent chat loads live and can be used in place.

🤖 Generated with Claude Code

When a turn starts or mentions a component gallery stage on loopback
(`/gallery/frame.html?entry=<id>` from `bun run dev`, or the live
gallery's `/live/frame.html`), its preview card now draws the component
at its own size and takes input after Load preview, so the reader tries
the component in the chat instead of a quarter-size thumbnail that opens a
tab. Any other loopback page keeps the thumbnail. The frame stays
sandboxed (scripts, same origin, no forms) and loads nothing until the
click.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@coderabbitai

coderabbitai Bot commented Oct 19, 2026 •

Copy link
Copy Markdown

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration
  • Configuration used: Repository: manaflow-ai/cmux/.coderabbit.yaml
  • Review profile: ASSERTIVE
  • Plan: Advanced
  • Run ID: 7e3ad01e-3058-4aff-9726-afbc75579fef

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@github-actions

github-actions Bot commented Oct 19, 2026 •

Copy link
Copy Markdown
Contributor

Receipt for 1467da4 (this PR's head; a new push replaces it)

  • Visual review: HQ feed card · gallery before/after runs
  • Checks: this head
  • App of this head (app.zip, kept 1 day): gh workflow run reload-build.yml -R manaflow-ai/cmux --ref feat-cmux-next -f tag=pr21872 -f ref=claude/inline-gallery-preview -f platform=macos -f backend_mode=local

@teamleaderleo

Copy link
Copy Markdown
Collaborator Author

Bead cx-nlmjw created for this PR by the cmux coordinator.

@blacksmith-sh

blacksmith-sh Bot commented Oct 19, 2026 •

Copy link
Copy Markdown

Found 10 test failures on Blacksmith runners:

Failures

Test View Logs
/tmp/tmp5nw7t6nh/summary-missing.json (live):/summary-missing.json (live): View Logs
/tmp/tmpa266kpxp/summary-fail.json (live):/summary-fail.json (live): View Logs
test/agent-pane-mode-keys.test.ts/agent-pane-mode-keys.test View Logs
test/agent-pane-mode-keys.test.ts/agent-pane-mode-keys.test View Logs
test/check-system-blue.test.ts/check-system-blue.test View Logs
test/check-system-blue.test.ts/check-system-blue.test View Logs
test/composer-footer-plain.test.ts/composer-footer-plain.test View Logs
test/composer-footer-plain.test.ts/composer-footer-plain.test View Logs
test/theme-colors.test.ts/theme-colors.test View Logs
test/theme-colors.test.ts/theme-colors.test View Logs

Fix with [code]smith
Need help on this PR? Tag @codesmith-bot with what you need.

@github-actions

github-actions Bot commented Oct 19, 2026 •

Copy link
Copy Markdown
Contributor

red: web / Web status; do not merge until green; see lane-rules
red: web / react-apps-check; do not merge until green; see lane-rules
red: web / react-apps-check (1); do not merge until green; see lane-rules
red: web / react-apps-check (2); do not merge until green; see lane-rules

@github-actions

github-actions Bot commented Oct 19, 2026 •

Copy link
Copy Markdown
Contributor

cmux status (one comment, edited in place; each line is updated by the job that owns it)

Unclear: web / react-apps-check failed: no known signature; failed step: Check webview test shards.

CI failed on 1467da4373 (run 39219631323 attempt 1): 2 code, 1 unknown.

Job Verdict Why
web / react-apps-check (2) code a web test failed
web / react-apps-check (1) code a web test failed
web / react-apps-check unknown no known signature; failed step: Check webview test shards

Failures:

  • seen on other PRs check-system-blue.test.ts check-system-blue > this checkout is within its baseline: failed (job)
  • seen on other PRs composer-footer-plain.test.ts at 760 px (light): off, the chips draw as today: failed (job)
  • seen on other PRs composer-footer-plain.test.ts at 760 px (light): on, plain text at rest, same labels, no overlap: failed (job)
  • seen on other PRs composer-footer-plain.test.ts at 760 px (dark): off, the chips draw as today: failed (job)
  • seen on other PRs composer-footer-plain.test.ts at 760 px (dark): on, plain text at rest, same labels, no overlap: failed (job)
  • seen on other PRs composer-footer-plain.test.ts at 480 px (light): off, the chips draw as today: failed (job)
  • seen on other PRs composer-footer-plain.test.ts at 480 px (light): on, plain text at rest, same labels, no overlap: failed (job)
  • seen on other PRs composer-footer-plain.test.ts at 480 px (dark): off, the chips draw as today: failed (job)
  • seen on other PRs agent-pane-mode-keys.test.ts the trigger and every menu row draw the mode's own shield: failed (job)
Matched log lines
web / react-apps-check (2): (fail) check-system-blue > this checkout is within its baseline [1241.27ms]
web / react-apps-check (1): (fail) the trigger and every menu row draw the mode's own shield [1141.87ms]

Not re-run automatically: web / react-apps-check (2), web / react-apps-check (1), web / react-apps-check are not machine failures.

Written by scripts/ci/classify_failures.py (ci-failure-attribution.yml); signatures are its SIGNATURES table. A machine verdict is the runner's fault, not this PR's; yours means the failing file is one this PR changes, also red on main that main's latest full suite fails the same way, seen on other PRs that it failed on another pull request's run lately.

CI fast guards failed on 1467da4373 (https://github.com/manaflow-ai/cmux/actions/runs/39219631323). It does not block the merge; a red guard merged into main breaks it for every open PR.
The log named no failed step; see the run.

Agents: python3 scripts/ci/guard_attribution.py fix applies the mechanical fixes locally.

@github-actions

github-actions Bot commented Oct 19, 2026 •

Copy link
Copy Markdown
Contributor

CI fast guards failed on 1c9cdfdf60 (https://github.com/manaflow-ai/cmux/actions/runs/39203544445). It does not block the merge; a red guard merged into main breaks it for every open PR.
The log named no failed step; see the run.

Agents: python3 scripts/ci/guard_attribution.py fix applies the mechanical fixes locally. This comment is updated in place on each push.

@teamleaderleo

Copy link
Copy Markdown
Collaborator Author

The red CI / web / react-apps-check shard is webviews/test/static-status-loops.test.ts ("Static status indicators stop every pane loop"), and it's base-red. It fails the same way with this PR's files reverted to origin/feat-cmux-next: CMUX_BROWSER_TESTS=1 bun test test/static-status-loops.test.ts on huge-blue, Expected 1 / Received 5. The test was last changed by #21800. I merged the current base into this branch (7075915) so the checks rerun on it.

@teamleaderleo
teamleaderleo temporarily deployed to cmux-tui-merge-tree October 19, 2026 03:02 — with GitHub Actions Inactive
teamleaderleo and others added 3 commits October 19, 2026 04:46
…nd loading one keeps its height

Red: isGalleryFrame accepts any loopback frame.html?entry=, and there is
no gallery-sized placeholder or estimate (previewFrameHeight missing).

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…d loading it keeps its height

isGalleryFrame takes only /gallery/, /live/, /latest/ and /wt/<name>/
frame.html on loopback, since the address comes from reply text. A gallery
stage's placeholder and the virtualizer's estimate now take the live
frame's 360px, so Load preview no longer moves the transcript; preview
rows always use the card's fixed estimate instead of measuring the URL as
prose. Ordinary previews keep 180px.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@teamleaderleo

Copy link
Copy Markdown
Collaborator Author

Fix pushed (1c9cdfd): live gallery stages are now limited to the gallery's own mounts (/gallery/, /live/, /latest/, /wt//frame.html) on loopback. A stage's placeholder and the row estimate use the live frame's 360px, so Load preview no longer moves the transcript; ordinary previews stay at 180px. Tests in PreviewCard.test.tsx (red at 7354cbc).

- regenerated Packages/macOS/CmuxNext/ci-target-graph.json
- vp fmt webviews/src/agent-session/acpmux/replyHref.ts
- vp fmt webviews/src/pages/markdown/README.md
- vp fmt webviews/src/pages/markdown/links.ts
- vp fmt webviews/test/markdown-cmux-app-links.test.ts

Autofix-Run: https://github.com/manaflow-ai/cmux/actions/runs/39212132724
…8099

# Conflicts:
#	webviews/src/agent-session/acpmux/replyHref.ts
#	webviews/src/pages/markdown/links.ts
@cursor

cursor Bot commented Oct 19, 2026

Copy link
Copy Markdown

Bugbot needs on-demand usage enabled

Bugbot uses usage-based billing for this team and requires on-demand usage to be enabled.

A team admin can enable on-demand usage in the Cursor dashboard.

@teamleaderleo
teamleaderleo merged commit fead540 into feat-cmux-next Oct 19, 2026
@teamleaderleo
teamleaderleo deleted the claude/inline-gallery-preview branch October 19, 2026 19:39
@teamleaderleo

Copy link
Copy Markdown
Collaborator Author

Merged by the coord-2 rescue lane at the reviewed head. Every red on this head also fails on feat-cmux-next from the same morning, in unrelated PRs (#21697, #21729, #21623, #21272): cmux-next checks fails on Motion tokens at the base file TabCell+HibernationRing.swift:109, and react-apps-check fails on check-system-blue, composer-footer-plain, theme-colors and agent-pane-mode-keys.

@github-actions

github-actions Bot commented Oct 19, 2026 •

Copy link
Copy Markdown
Contributor

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant