From db1f6ef7e6d964db5093e7a4e6f43c1c0404f8b5 Mon Sep 17 00:00:00 2001 From: Nanook Claw Date: Fri, 8 May 2026 22:44:04 +0000 Subject: [PATCH] fix(frontend): make bulk-review env list scrollable above max-height (#736) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The bulk-review dialog rendered every selected environment in an unbounded Column inside the AlertDialog. With a large selection (e.g. 129 envs at 4k/100% scale, 50% browser zoom in the report) the list overflowed the dialog/viewport and was unreachable without zooming the browser out — there was no scroll affordance and the action buttons sat below the overflow. Wrap the env list in a Scrollbar+SingleChildScrollView with BoxConstraints(maxHeight: 240) so the list scrolls in place once it exceeds the cap. Bordered container, dividers, and the rest of the dialog layout are unchanged. 240px is roughly 10-11 rows at the existing bodySmall + level1 vertical padding, matching the maintainer comment in the issue ("scrollable container of sorts beyond a maximum height"). Signed-off-by: Nanook Claw --- .../bulk_environment_review_dialog.dart | 48 +++++++++++-------- 1 file changed, 27 insertions(+), 21 deletions(-) diff --git a/frontend/lib/ui/artefact_page/bulk_environment_review_dialog.dart b/frontend/lib/ui/artefact_page/bulk_environment_review_dialog.dart index 13bb2130e..46b5cb438 100644 --- a/frontend/lib/ui/artefact_page/bulk_environment_review_dialog.dart +++ b/frontend/lib/ui/artefact_page/bulk_environment_review_dialog.dart @@ -112,28 +112,34 @@ class _BulkEnvironmentReviewDialogState border: Border.all(color: Colors.grey[300]!), borderRadius: BorderRadius.circular(4), ), - child: Column( - mainAxisSize: MainAxisSize.min, - children: [ - for (var i = 0; i < widget.environments.length; i++) ...[ - Padding( - padding: const EdgeInsets.symmetric( - horizontal: Spacing.level2, - vertical: Spacing.level1, - ), - child: Align( - alignment: Alignment.centerLeft, - child: Text( - '${widget.environments[i].environment.name} ' - '(${widget.environments[i].environment.architecture})', - style: Theme.of(context).textTheme.bodySmall, + constraints: const BoxConstraints(maxHeight: 240), + child: Scrollbar( + thumbVisibility: true, + child: SingleChildScrollView( + child: Column( + mainAxisSize: MainAxisSize.min, + children: [ + for (var i = 0; i < widget.environments.length; i++) ...[ + Padding( + padding: const EdgeInsets.symmetric( + horizontal: Spacing.level2, + vertical: Spacing.level1, + ), + child: Align( + alignment: Alignment.centerLeft, + child: Text( + '${widget.environments[i].environment.name} ' + '(${widget.environments[i].environment.architecture})', + style: Theme.of(context).textTheme.bodySmall, + ), + ), ), - ), - ), - if (i != widget.environments.length - 1) - Divider(height: 1, color: Colors.grey[300]), - ], - ], + if (i != widget.environments.length - 1) + Divider(height: 1, color: Colors.grey[300]), + ], + ], + ), + ), ), ), const SizedBox(height: Spacing.level4),