fix(app): keep session composer within timeline width#464
Conversation
|
Warning Rate limit exceeded
To continue reviewing without waiting, purchase usage credits in the billing tab. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (2)
✨ Finishing Touches🧪 Generate unit tests (beta)
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. Comment |
There was a problem hiding this comment.
Code Review
This pull request updates the message timeline's maximum width constraints for medium viewports and adds a corresponding E2E test case. The review feedback suggests extending the 1000px width cap to the xl breakpoint (1280px) to ensure the timeline remains wider than the composer across all desktop resolutions. Additionally, the reviewer recommends adding an E2E test case specifically for the xl range to verify these layout improvements.
Root cause: - PR #464 fixed the original composer/timeline mismatch by replacing the session timeline medium-width cap with explicit `md:max-w-[800px]`. - The #440 UI slice merge chain later regressed that fix. PR #461 first changed both timeline caps back to `md:max-w-200`, which resolves to about 650px with PawWork's 13px root font. - PR #460 then kept that same `message-timeline.tsx` state while removing dead delete-session code, so #479 surfaced as the composer still appearing wider than the reading column at right-panel-hidden desktop widths. Fix: - Restore both session timeline medium-width caps to `md:max-w-[800px]`. - Keep the existing 2xl timeline cap and composer caps unchanged, preserving the prior #217/#456 intent that composer remains inset at very wide desktop sizes. - Add a focused E2E checkpoint for #479: viewport 1280x900 with `#right-panel[aria-hidden="true"]`, then reuse the existing timeline/composer bounding-box contract. Verification: - Red check: temporarily restored the old `md:max-w-200` cap and confirmed the focused E2E failed at the new 1280px/right-panel-hidden checkpoint with timeline 651px vs composer 720px. - Focused E2E passed: `bun --cwd packages/app test:e2e e2e/app/session.spec.ts -g "session timeline visible content is not narrower than composer shell"`. - Typecheck passed: `bun --cwd packages/app typecheck`. - Diff check passed: `git diff --check`. - PR CI passed, including typecheck, unit-app, unit-opencode, unit-desktop, e2e-artifacts, smoke-macos-arm64, CodeQL, dependency review, commit lint, and PR title lint. Follow-up: - No immediate product follow-up is required for #479. - A separate architecture issue may still be worth opening later for the broader session width contract, because timeline, message item, and composer width values are still split across files and have accumulated breakpoint-specific tests. Closes #479.
Summary
Fix the session timeline width cap so the visible conversation flow stays wider than the composer in the md viewport range.
Why
Fixes #456.
The previous fix shipped in the release asset, but it missed the middle desktop width band. The composer used fixed pixel caps (
720px/920px), while the timeline usedmd:max-w-200. With PawWork's 13px root font size,max-w-200resolves to650px, so the composer could become wider than the message flow around a 893px CSS viewport.Related Issue
Closes #456
Human Review Status
Pending. A human should make the final merge decision after reviewing the final diff and verification evidence.
Review Focus
Check that the timeline width cap change is intentionally scoped to session layout and does not alter global spacing tokens.
Risk Notes
Low. This changes only the centered session timeline max width at
mdand keeps the existing2xlcap unchanged. It does not touch persistence, release packaging, updater, permissions, or dependencies.How To Verify
Screenshots or Recordings
Manual Electron dev verification was performed against the reported layout. The user confirmed the updated UI now looks normal in the thread screenshot.
Checklist
dev, and my PR title and commit messages use Conventional Commits in English