[MT-23013] Keep connection dialogs usable on short viewports#39
Conversation
The connection dialogs (Cloud/Relay/Webhook/About) had no max-height: when the content grew past the viewport (e.g. SMTP Relay with the config-pin banner and Advanced section expanded on a short screen) the fixed-centered panel clipped at both edges and the action buttons became unreachable. Cap the shared shell at 85vh and make it a flex column: the title row stays pinned, the lead + form body scrolls (overflow-y: auto), and the shared DialogActions row is sticky at the bottom of the scroll area with an opaque background, so Save/Cancel/Remove stay visible at any viewport height. Spacing is preserved via a margin/padding swap on the actions row and applies to all four dialogs through dialogStyles. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
|
Warning Review limit reached
Next review available in: 53 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (2)
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 |
|
@coderabbitai review |
✅ Action performedReview finished.
|
What & why
Fixes MT-23013, a sub-task of MT-22849, by capping connection-dialog height, scrolling the body, and keeping the action row reachable.
Long relay-dialog content previously exceeded short viewports because the shared shell had no bounded flex/overflow structure.
Impact
Titles remain stable while long form content scrolls and Save/Cancel actions stay available.
Screenshots
Verification
npm test— 58 tests passednpm run lint— 0 errors; 4 existing warningsnpm run build— passedgit diff --check main...fix/mt-23013-dialog-overflow— passed