Skip to content

[MT-23013] Keep connection dialogs usable on short viewports#39

Merged
kyrylo-yevdokymov merged 3 commits into
mainfrom
fix/mt-23013-dialog-overflow
Jul 14, 2026
Merged

[MT-23013] Keep connection dialogs usable on short viewports#39
kyrylo-yevdokymov merged 3 commits into
mainfrom
fix/mt-23013-dialog-overflow

Conversation

@kyrylo-yevdokymov

@kyrylo-yevdokymov kyrylo-yevdokymov commented Jul 13, 2026

Copy link
Copy Markdown
Contributor

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

Before After

Verification

  • npm test — 58 tests passed
  • npm run lint — 0 errors; 4 existing warnings
  • npm run build — passed
  • git diff --check main...fix/mt-23013-dialog-overflow — passed

Kyrylo Yevdokymov and others added 3 commits July 13, 2026 13:23
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>
@coderabbitai

coderabbitai Bot commented Jul 13, 2026

Copy link
Copy Markdown

Warning

Review limit reached

@kyrylo-yevdokymov, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 53 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

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 configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 2f8bdee1-f68b-4fd3-99f2-644ac293daac

📥 Commits

Reviewing files that changed from the base of the PR and between 9ce8945 and 232aa5e.

📒 Files selected for processing (2)
  • frontend/src/components/connections/dialogAtoms.tsx
  • frontend/src/components/connections/dialogStyles.ts

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.

@kyrylo-yevdokymov

Copy link
Copy Markdown
Contributor Author

@coderabbitai review

@coderabbitai

coderabbitai Bot commented Jul 13, 2026

Copy link
Copy Markdown
✅ Action performed

Review finished.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

@kyrylo-yevdokymov
kyrylo-yevdokymov marked this pull request as ready for review July 13, 2026 10:43

@roman-adamchik roman-adamchik left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm

@kyrylo-yevdokymov
kyrylo-yevdokymov merged commit f3b347b into main Jul 14, 2026
9 checks passed
@kyrylo-yevdokymov
kyrylo-yevdokymov deleted the fix/mt-23013-dialog-overflow branch July 14, 2026 15:17
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.

4 participants