Fix text being cut off on some dialog buttons #237

grunch · 2025-07-25T15:19:28Z

Now the dialog buttons will:

Properly handle longer translations without text being cut off
Maintain proper spacing between buttons
Keep text centered and readable
Resize dynamically based on content length

Summary by CodeRabbit

Style
- Improved layout, padding, and alignment for action buttons in dialogs across key management, relay selection, and trade detail screens.
- Enhanced button text wrapping and centering for better readability.
- Added consistent spacing between dialog buttons for a more polished appearance.

Now the dialog buttons will: - Properly handle longer translations without text being cut off - Maintain proper spacing between buttons - Keep text centered and readable - Resize dynamically based on content length

coderabbitai · 2025-07-25T15:19:35Z

Walkthrough

The changes focus on improving the layout, padding, and alignment of action buttons and their text across several dialogs and screens. Adjustments include wrapping buttons in Flexible widgets, adding horizontal spacing, refining text alignment, and enhancing button padding for a more consistent and visually controlled UI experience. No logic or public API signatures were altered.

Changes

File(s)	Change Summary
lib/features/key_manager/key_management_screen.dart	Expanded button padding, set Row mainAxisSize to min, wrapped Text in Flexible with overflow/softWrap, updated dialog buttons with Flexible, spacing, and centered text.
lib/features/relays/widgets/relay_selector.dart	Dialog action buttons wrapped in Flexible, added horizontal spacing, centered text, and enhanced button padding in add/edit relay dialogs.
lib/features/trades/screens/trade_detail_screen.dart	Cancel trade dialog action buttons wrapped in Flexible, added spacing, centered text, and improved button padding.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

Poem

In dialogs bright, the buttons grew,
With padding plush and spacing new.
Flexible friends now hold their place,
Centered text, a tidy space.
A rabbit hops with UI pride,
For every click is now a smoother ride!
🐇✨

Note

⚡️ Unit Test Generation is now available in beta!

Learn more here, or try it out under "Finishing Touches" below.

📜 Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 8f48d5c and ca522d5.

📒 Files selected for processing (3)

lib/features/key_manager/key_management_screen.dart (2 hunks)
lib/features/relays/widgets/relay_selector.dart (2 hunks)
lib/features/trades/screens/trade_detail_screen.dart (1 hunks)

🧰 Additional context used

📓 Path-based instructions (2)

lib/**/*.dart

📄 CodeRabbit Inference Engine (CLAUDE.md)

lib/**/*.dart: Use S.of(context).yourKey for all user-facing strings
Always check mounted before using context after async operations

Files:

lib/features/relays/widgets/relay_selector.dart
lib/features/trades/screens/trade_detail_screen.dart
lib/features/key_manager/key_management_screen.dart

**/*.dart

📄 CodeRabbit Inference Engine (CLAUDE.md)

**/*.dart: Remove unused imports and dependencies
Use const constructors where possible

Files:

lib/features/relays/widgets/relay_selector.dart
lib/features/trades/screens/trade_detail_screen.dart
lib/features/key_manager/key_management_screen.dart

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

GitHub Check: build

🔇 Additional comments (5)

lib/features/relays/widgets/relay_selector.dart (2)

104-148: Excellent implementation for handling text overflow in dialog buttons!

The changes properly address the PR objectives by:

Wrapping buttons in Flexible widgets to handle longer translations

Adding consistent 8px spacing between buttons

Center-aligning text for better visual presentation

Adding symmetric padding for improved touch targets

192-236: Consistent implementation maintains UI coherence.

The edit dialog follows the same pattern as the add dialog, ensuring consistent behavior across the relay management interface.

lib/features/key_manager/key_management_screen.dart (2)

507-532: Well-implemented text overflow prevention for the generate button.

The combination of MainAxisSize.min, Flexible wrapper, and explicit overflow settings ensures the button text will properly wrap for longer translations without being cut off.

642-680: Consistent dialog button implementation across the application.

The changes follow the established pattern from other dialogs, ensuring consistent behavior and proper handling of longer translations throughout the app.

lib/features/trades/screens/trade_detail_screen.dart (1)

597-632: Consistent dialog button layout ensures uniform user experience.

The cancel trade dialog now follows the same improved layout pattern as other dialogs, providing consistent handling of longer translations and better visual presentation.

✨ Finishing Touches

🧪 Generate unit tests

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch fix/button-text

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

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

Review comments: Directly reply to a review comment made by CodeRabbit. Example:
- I pushed a fix in commit <commit_id>, please review it.
- Explain this complex logic.
- Open a follow-up GitHub issue for this discussion.
Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
- @coderabbitai explain this code block.
- @coderabbitai modularize this function.
PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
- @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
- @coderabbitai read src/utils.ts and explain its main purpose.
- @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
- @coderabbitai help me debug CodeRabbit configuration file.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

@coderabbitai pause to pause the reviews on a PR.
@coderabbitai resume to resume the paused reviews.
@coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
@coderabbitai full review to do a full review from scratch and review all the files again.
@coderabbitai summary to regenerate the summary of the PR.
@coderabbitai generate docstrings to generate docstrings for this PR.
@coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
@coderabbitai generate unit tests to generate unit tests for this PR.
@coderabbitai resolve resolve all the CodeRabbit review comments.
@coderabbitai configuration to show the current CodeRabbit configuration for the repository.
@coderabbitai help to get help.

Other keywords and placeholders

Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (`.coderabbit.yaml`)

You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
Please see the configuration documentation for more information.
If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

Visit our Documentation for detailed information on how to use CodeRabbit.
Join our Discord Community to get help, request features, and share feedback.
Follow us on X/Twitter for updates and announcements.

Fix text being cut off on some dialog buttons

ca522d5

Now the dialog buttons will: - Properly handle longer translations without text being cut off - Maintain proper spacing between buttons - Keep text centered and readable - Resize dynamically based on content length

grunch merged commit 707fb1d into main Jul 25, 2025
2 checks passed

grunch deleted the fix/button-text branch July 25, 2025 15:22

coderabbitai bot mentioned this pull request Jul 25, 2025

Fix Flexible widgets in AlertDialog actions causing crashes #240

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Fix text being cut off on some dialog buttons #237

Fix text being cut off on some dialog buttons #237

Uh oh!

grunch commented Jul 25, 2025 •

edited by coderabbitai bot

Loading

Uh oh!

coderabbitai bot commented Jul 25, 2025 •

edited

Loading

Chat

Support

CodeRabbit Commands (Invoked using PR comments)

Other keywords and placeholders

CodeRabbit Configuration File (`.coderabbit.yaml`)

Documentation and Community

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Fix text being cut off on some dialog buttons #237

Fix text being cut off on some dialog buttons #237

Uh oh!

Conversation

grunch commented Jul 25, 2025 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

coderabbitai bot commented Jul 25, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Poem

Chat

Support

CodeRabbit Commands (Invoked using PR comments)

Other keywords and placeholders

CodeRabbit Configuration File (.coderabbit.yaml)

Documentation and Community

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

grunch commented Jul 25, 2025 •

edited by coderabbitai bot

Loading

coderabbitai bot commented Jul 25, 2025 •

edited

Loading

CodeRabbit Configuration File (`.coderabbit.yaml`)