Fix right sidebar persistence on iPad landscape mode

[2witstudios]

Summary

This PR fixes the right sidebar (assistant panel) behavior on iPad landscape mode to be persistent at 1024px+, matching the left sidebar behavior. Previously, the right sidebar would only become persistent at 1280px+ on all platforms, creating an inconsistent experience on iPad.

Key Changes

• Updated shouldOverlayRightSidebar logic to use the tablet-specific breakpoint (isSheetBreakpoint) when on iPad, making it persistent at 1024px+ in landscape mode
• Updated comments to reflect that both sidebars are now persistent on iPad at 1024px+
• Simplified the right sidebar toggle logic by removing the now-redundant comment about iPad left sidebar persistence
• Fixed the right sidebar render condition to properly handle the tablet persistent state by adding !isSheetBreakpoint check and applying responsive classes based on device tier

Implementation Details

• The right sidebar now respects the same tablet breakpoint logic as the left sidebar
• On iPad landscape (1024px+): both sidebars are persistent
• On desktop (1024-1279px): both sidebars are in overlay mode
• On desktop (1280px+): both sidebars are persistent
• The render logic now conditionally applies Tailwind classes (hidden xl:flex vs flex) based on whether the device is a tablet, ensuring proper display in persistent mode

https://claude.ai/code/session_016yT6CmMAp7za8dpRJ6JKp2

Summary by CodeRabbit

• Bug Fixes
  • Improved responsive sidebar behavior on tablets to ensure both sidebars remain accessible in landscape orientation (1024px+).
  • Enhanced sidebar persistence and overlay logic for consistent display behavior across tablet and desktop layouts.
  • Optimized responsive breakpoint handling for better visual consistency across different screen sizes.

[chatgpt-codex-connector]

You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard.
To continue using code reviews, you can upgrade your account or add credits to your account and enable them for code reviews in your settings.

[coderabbitai]

Caution

Review failed

The pull request is closed.

📝 Walkthrough

Walkthrough

The Layout component's responsive sidebar behavior is adjusted so both sidebars persist as non-overlays at tablet breakpoints (1024px+) rather than only the left sidebar. Right sidebar overlay logic now depends on tablet state, with updated wrapper classes and toggle flows.

Changes

Cohort / File(s)	Summary
Sidebar Responsive Behavior apps/web/src/components/layout/Layout.tsx	Modified tablet breakpoint logic to treat both sidebars as persistent at 1024px+ landscape; right sidebar overlay rendering now gated by tablet state and sheet breakpoint conditions. Updated wrapper classes to differentiate tablet (flex w-[18rem]) from desktop (hidden xl:flex 2xl:w-80) layouts. Adjusted toggle flow logic to prevent unintended panel closures when sidebars are persistent.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

• Enable desktop content mode on iOS and optimize sidebar layout for iPad #416 — Directly modifies the same Layout.tsx sidebar overlay and persistence logic with breakpoint-based rendering adjustments.
• fix(ui): fix Activity and History buttons not opening sheet on mobile #273 — Updates Layout.tsx sidebar and sheet state management alongside toggle handler logic, related to the panel state flow changes.

Poem

🐰 Two burrows now rest at tablet's gentle gaze,
Persistent panels side-by-side through responsive maze,
No more unwanted closures when sidebars take their stand,
With wrapper classes flexing 'cross desktop's wider land!
A layout refined, where breakpoints understand. 🎉

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch claude/fix-right-sidebar-ipad-Nv9OV

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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