[shivamhwp]

Unproven: physical Mac trackpad pinch and momentum. Desktop recordings use automated wheel input.

Closes #26611

Ordinary vertical scrolling in the expanded image viewer zoomed the content, including expanded Mermaid diagrams. The wheel handler now reserves zoom for pinch/Ctrl+wheel and leaves ordinary scrolling to the existing native scroll area. Horizontal and diagonal scrolling pan without changing the image scale.

This also changes plain mouse-wheel behavior from zoom to pan. Mouse users can zoom with Ctrl+wheel, click, or the existing keyboard controls. This changes scroll behavior and needs Theo's approval before merge.

The shared viewer covers web and Electron images and expanded Mermaid diagrams, including file previews. No native mobile code changes.

Evidence

Baseline 9e09926d97824179d97311d1a810c6b5bb60d2d1; fixed 2d9b7ab5b277953fdb589b467cb2a43e111bb798. Recorded on shiv, macOS 27.0.1 arm64, Electron 44.9.3 and Chromium 152.0.7977.167, with generated test data and isolated recorded app state.

Before, image scrolling changes zoom:

before-image-short.mp4

Before, Mermaid scrolling changes zoom:

before-mermaid-short.mp4

After, image scrolling pans at a fixed zoom, followed by drag, Ctrl+wheel, and reset:

after-image.mp4

After, Mermaid scrolling pans at a fixed zoom, followed by Ctrl+wheel, drag, and reset:

after-mermaid.mp4

Viewer captures, before and after. These use different zoom levels; the videos show scale staying fixed during scrolling.

Validation

• A real Chromium wheel-input regression fails on main because ordinary scrolling is canceled, then passes with the fix. It checks vertical, horizontal and diagonal panning, unchanged image scale during ordinary scrolling, and anchored Ctrl+wheel zoom.
• On corex at the fixed commit, vp test run --project browser src/components/chat/ExpandedImageDialog.browser.test.tsx from apps/web passed both tests. vp run check:changed passed formatting, lint, both knip passes, affected-package typechecks and the focused browser tests.
• Independent Codex review found no code or test issues. Corex's integrated browser panel was unavailable because of its host AppArmor setup.
• On shiv, the real Electron app at the fixed commit passed vertical Mermaid panning, both grid pan axes, click and keyboard zoom/reset, drag, and Ctrl+wheel. Grid vertical wheel changed scrollTop from 616 to 856 and horizontal wheel changed scrollLeft from 868 to 1188 at an unchanged 300% zoom. Ctrl+wheel changed zoom to 448% while page scale stayed 1.
• Baseline recordings used Cua OS wheel input. Fixed recordings use trusted Chromium CDP wheel input in the same Electron renderer because this app rejects Cua background wheel delivery. The fixed run preserved the physical pointer and focus. Unchanged server/desktop bundles were reused with the exact fixed Vite renderer. These are development app tests, not packaged-build tests.
• Physical trackpad gestures, native macOS fullscreen Spaces, and useful horizontal overflow in the narrow Mermaid fixture were not verified. Diagonal scrolling is covered by the Chromium component regression, not the macOS recording.

Implemented by Opus 5.5 in Claude Code. Investigated, tested and reviewed by gpt-6.1-sol in Codex.

[macroscopeapp]

Approvability

Verdict: Needs Human Approval

Macroscope's review found this PR requires human approval — Ordinary scrolling now pans expanded images and Mermaid diagrams, while pinch or Ctrl+scroll zooms. A human should confirm this change to the viewer’s default scroll interaction.

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

[coderabbitai]

Important

Review skipped

Review was skipped as selected files did not have any reviewable changes.

Run configuration

• Source mode: Auto
• Repository: pingdotgg/t3code
• Branch: main
• File: .coderabbit.config.ts
• Commit: 8970a32
• Layers: Repository TS config
• Review profile: CHILL
• Plan: Advanced
• Run ID: 515905d8-2901-4cd1-a9d4-7c44f361757f

Commits

Reviewing files that changed from the base of the PR and between 2d9b7ab and 572de1e.

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

No actionable comments were generated in the recent review.

Recent review info

Run configuration

• Source mode: Auto
• Repository: pingdotgg/t3code
• Branch: main
• File: .coderabbit.config.ts
• Commit: 9e09926
• Layers: Repository TS config
• Review profile: CHILL
• Plan: Advanced
• Run ID: d8503a91-bed2-48c9-bc16-0c4ea38e9f6a

Commits

Reviewing files that changed from the base of the PR and between 9e09926 and 2d9b7ab.

Files selected for processing: 2

• apps/web/src/components/chat/ExpandedImageDialog.browser.test.tsx
• apps/web/src/components/chat/ZoomableImage.tsx

Included review availability: This review used your included allowance. Your plan provides up to 10 included reviews per hour; 8 remain after this review.

Walkthrough

Ordinary wheel input now pans the image viewer without zooming. Ctrl+wheel zooms the image. The accessible description and browser test reflect these interactions.

Changes: Image viewer wheel interaction

Layer / File(s)	Summary
Wheel interaction and regression coverage apps/web/src/components/chat/ZoomableImage.tsx, apps/web/src/components/chat/ExpandedImageDialog.browser.test.tsx	The wheel handler zooms only for Ctrl+wheel and leaves ordinary wheel input available for panning. The accessible description identifies scrolling and dragging as pan controls. The browser test checks wheel cancellation, zoom, panning, and preservation of the image position under the viewport center during zoom.

Priority: Low

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Bug fix · Severity of issue fixed: Low

Possibly related PRs

• pingdotgg/t3code#25246: This PR changes the same image viewer wheel handler and adds browser-test coverage for its interaction behavior.

Suggested reviewers: juliusmarminge, t3dotgg

Merge Risk: Minimal · previous review 2d9b7

Ordinary scrolling pans while Ctrl+scroll zooms. No actionable merge risk remains.

Pre-merge checks: 4

Check name	Status	Explanation
Title check		The title clearly summarizes the primary behavior change: scrolling now pans expanded images and Mermaid diagrams.
Linked Issues check		[#26611] requires that ordinary trackpad or wheel scrolling in the expanded Mermaid and image viewer pan the content, and that pinch zoom still zoom it. At the reviewed head, ZoomableImage.tsx chang…
Out of Scope Changes check		The reviewed diff from merge base 9e09926d to head 2d9b7ab5 touches two files. ZoomableImage.tsx changes the wheel handler so only Ctrl+wheel zooms. It also updates the aria-description to nam…
Description check		The description states the purpose clearly: plain wheel input in the expanded image and Mermaid viewer currently zooms, and the fix limits zoom to pinch and Ctrl+wheel so ordinary scrolling pans throu…

Full details: Linked Issues check

Explanation

[#26611] requires that ordinary trackpad or wheel scrolling in the expanded Mermaid and image viewer pan the content, and that pinch zoom still zoom it. At the reviewed head, ZoomableImage.tsx changes the viewport wheel listener to return early unless event.ctrlKey is set. Ordinary wheel events are no longer canceled or converted to zoom, so the overflow-auto viewport handles them through native scrolling. Trackpad pinch on macOS Chromium and Safari arrives as a ctrlKey wheel event, so pinch zoom stays active. The Ctrl+wheel zoom factor stays at 0.01, as before. The browser regression in ExpandedImageDialog.browser.test.tsx checks that plain wheel input is not canceled, that image scale stays fixed during vertical, horizontal and diagonal panning, and that Ctrl+wheel zoom is anchored to the pointer. The PR also reports Electron checks for Mermaid panning and zoom controls. The PR recordings show the before and after behavior. The source diff does not directly show that the expanded Mermaid view uses ZoomableImage. This link rests on the PR description and the before-Mermaid recording. Physical trackpad pinch and momentum were not verified, and that gap is not a coding requirement failure. Non-coding items, such as the approval note from Theo, do not apply here.

Full details: Out of Scope Changes check

Explanation

The reviewed diff from merge base 9e09926d to head 2d9b7ab5 touches two files. ZoomableImage.tsx changes the wheel handler so only Ctrl+wheel zooms. It also updates the aria-description to name pinch, Ctrl+scroll, and scroll or drag. The aria text supports the changed input model and is not unrelated. ExpandedImageDialog.browser.test.tsx adds one regression test for the new behavior. Test code supports the requirement. The removed plain-wheel zoom branch is the behavior that #26611 asks to change. No unrelated files or features appear in the diff. The plain-wheel-to-pan change is a deliberate behavior change that the PR states, and the issue requests it. The PR notes that the change needs owner approval before merge. That note is a process condition, not a code scope issue.

Full details: Description check

Explanation

The description states the purpose clearly: plain wheel input in the expanded image and Mermaid viewer currently zooms, and the fix limits zoom to pinch and Ctrl+wheel so ordinary scrolling pans through the native scroll area. It names the linked issue (#26611), the affected surfaces (web and Electron images, expanded Mermaid diagrams, file previews), and flags the behavior change and the need for maintainer approval. Verification is detailed: a Chromium browser regression that fails on main and passes with the fix, a focused vitest run, check:changed, Electron checks on macOS, before/after recordings and captures, and explicit gaps (physical trackpad, macOS fullscreen Spaces, packaged builds). The template's Scope and approval section is only partly satisfied, because the description requests approval from Theo but does not link a triaged issue or approval comment for the direction. The Problem and Change headings are not used as separate sections, though the content for both appears in the opening paragraphs. Those gaps are minor, so the description is mostly complete.

Finishing Touches

🧪 Generate unit tests (beta)

• Create a new PR

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

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

[shivamhwp]

[gpt-6.1-sol][Codex] on behalf of shivam.

Before and after evidence for this PR. Generated test data only; macOS 27.0.1, Electron 44.9.3. Baseline 9e09926d97824179d97311d1a810c6b5bb60d2d1, fixed 2d9b7ab5b277953fdb589b467cb2a43e111bb798.

Before, image scrolling changes zoom:

before-image-short.mp4

Before, Mermaid scrolling changes zoom:

before-mermaid-short.mp4

After, scrolling pans the image at a fixed zoom, followed by other zoom and pan controls:

after-image.mp4

After, scrolling pans the Mermaid diagram at a fixed zoom, followed by other zoom and pan controls:

after-mermaid.mp4

Viewer captures use different zoom levels; the videos establish scale preservation during scrolling.

[maria-rcks]

Note

Written by gpt-6.1-sol on behalf of Maria

thanks @shivamhwp. the native overflow panning and ctrl-wheel guard already provide the smallest correct fix, so i kept your implementation and regression test intact. merged current main (8970a32104e0) into your branch without rewriting history. head: 572de1e066a26bd3f16b8cf8b862f829da36ab73. the diff remains two files, with no unrelated changes.

verification:

• reproduced the regression on current main: ordinary wheel was canceled; the existing regression failed there and both browser tests passed with the fix.
• blacksmith vp run check:changed passed format, lint, both knip passes, affected typechecks, browser tests and react compiler checks.
• real web client, system chrome: uploaded image and mermaid attachment expansion, vertical/horizontal panning, ctrl-wheel zoom, click zoom, keyboard reset and closing. an ordinary 180px wheel changed scrollTop by 180 while width stayed 2240px; main shrank that same image to 1563px. mermaid wheel panned 120px at unchanged width, then ctrl-wheel zoomed.
• all 31 head checks are green; cafe reports mergeable. the latest bot review has no actionable findings.
• two independent code reviews approved this head with no findings. uploaded recording playback and seeking passed.

unverified this run: physical trackpad pinch/momentum, packaged electron, native mobile and macos fullscreen spaces. the shared web/electron viewer changes; native mobile is unaffected. maintainer approval of the wheel behavior change remains for review.

matching image data and wheel input, before and after:

[maria-rcks]

Note

Written by gpt-6.1-sol on behalf of Maria

Verified in a real dev environment

verified as-is at 572de1e066a26bd3f16b8cf8b862f829da36ab73 on this linux boat vm. no code changes or pushes.

• reproduced on current github/main (616c426f5f) in ../main, installed with vp i, then stopped its captured dev process before starting the exact pr head. both used real dev servers and isolated state.
• used repo playwright and /usr/bin/google-chrome, at 1440×1000. created a project pointing to a real git repo through the app. a real codex gpt-6.1-sol turn created the architecture image and mermaid response. preserved that app-created state for matching before/after data. a second real codex turn completed through the pr web client and confirmed the file dimensions. no replay provider, mock, fixture, or demo data.
• ordinary vertical, horizontal, and diagonal wheel input pans both expanded markdown images and mermaid diagrams at unchanged scale on the pr. main changes scale on vertical and diagonal input.
• nearby behavior passed: anchored ctrl+wheel zoom (image anchor drift below 0.001), drag panning, click zoom, keyboard plus/minus and 0 reset, arrow-key panning, escape, and the close button. the second provider response appeared in the client.
• blacksmith ran the existing ExpandedImageDialog.browser.test.tsx: both tests passed. github currently reports 21 successful and 10 skipped checks, none failing or pending.

measured through the running client with the same initial zoom and wheel inputs:

                         main                          pr
image, wheel y=180       width 2520 -> 1758.14          width 2520 -> 2520
                                                       scrollTop 525 -> 705
image, wheel x=120                                      scrollLeft 646 -> 766
image, wheel -40,-40                                    x 766 -> 726; y 705 -> 665
mermaid, wheel y=180     width 1312.5 -> 915.69          width 1312.5 -> 1312.5
                                                       scrollTop 525 -> 705
pr codex turn            completed; client displayed:
                         "width: 1600px, height: 1200px."
                         "provider verification complete."

screenshots follow the identical 180px vertical wheel input. the recording shows main first, then the pr; each shows image followed by mermaid, with vertical/horizontal/diagonal wheel, ctrl+wheel, drag, reset, and click zoom. inspected the captures and watched the full exported recording. uploaded playback and seeking also passed in t3's browser.

Not verified

physical trackpad pinch and momentum, packaged electron, macos/windows behavior, native ios/android, remote/relay/tunnel connections, and separate file-preview entry points were not exercised on this linux web run. ctrl+wheel covers the zoom event path, not physical pinch hardware. the first codex turn's optional html preview tool timed out; it still completed and its actual image and mermaid rendered in the client. neither provider turn stalled for ten minutes.

maintainer approval of the default wheel interaction remains a review decision. no merge, close, rebase, force-push, or label changes.