From 178eeae672637ef8456cb50616727bca6d86f3b3 Mon Sep 17 00:00:00 2001
From: kn <kristiannoergaard@gmail.com>
Date: Mon, 19 Oct 2026 14:00:48 +0200
Subject: [PATCH] (Svelte) Let the list modules fill their grid cell

The execution, build, alert, configuration and part lists cap their
scroll area at a fixed height (500px, 60vh, 400px, 360px). Placed in a
grid cell taller than that, a list fills only the top of the cell and
leaves the rest empty while its rows scroll.

Each list is now a flex column that takes the height its container
gives it and scrolls inside. Outside a grid, where there is no height
to fill, the list keeps its natural height, capped at one screen
(max-h-screen).
---
 .../src/lib/amcf/modules/ModuleAlertList.svelte      |  6 ++++--
 .../src/lib/amcf/modules/ModuleBuildList.svelte      |  6 ++++--
 .../lib/amcf/modules/ModuleConfigurationList.svelte  |  6 ++++--
 .../src/lib/amcf/modules/ModuleExecutionList.svelte  |  6 ++++--
 .../src/lib/amcf/modules/ModulePartList.svelte       | 12 +++++++-----
 5 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/Client/svelte/src/lib/amcf/modules/ModuleAlertList.svelte b/Client/svelte/src/lib/amcf/modules/ModuleAlertList.svelte
index 629cf5927..a814ea1a6 100644
--- a/Client/svelte/src/lib/amcf/modules/ModuleAlertList.svelte
+++ b/Client/svelte/src/lib/amcf/modules/ModuleAlertList.svelte
@@ -42,8 +42,10 @@
 </script>
 
 {#if visible}
-	<div class="w-full border rounded-md overflow-hidden">
-		<ScrollArea class="max-h-[500px]">
+	<!-- Fills the space its container gives it (a grid cell) and scrolls inside; in a
+	     stacked page it takes its natural height, at most one screen. -->
+	<div class="w-full flex-1 min-h-0 max-h-screen flex flex-col border rounded-md overflow-hidden">
+		<ScrollArea class="flex-1 min-h-0">
 			<Table.Root>
 				<Table.Header class="sticky top-0 bg-muted z-10">
 					<Table.Row>
diff --git a/Client/svelte/src/lib/amcf/modules/ModuleBuildList.svelte b/Client/svelte/src/lib/amcf/modules/ModuleBuildList.svelte
index a0c699292..5eaae09cc 100644
--- a/Client/svelte/src/lib/amcf/modules/ModuleBuildList.svelte
+++ b/Client/svelte/src/lib/amcf/modules/ModuleBuildList.svelte
@@ -47,8 +47,10 @@
 </script>
 
 {#if visible}
-	<div class="w-full border rounded-md overflow-hidden flex-1 min-h-0 flex flex-col">
-		<ScrollArea class="h-full min-h-0 max-h-[60vh]">
+	<!-- Fills the space its container gives it (a grid cell) and scrolls inside; in a
+	     stacked page it takes its natural height, at most one screen. -->
+	<div class="w-full flex-1 min-h-0 max-h-screen flex flex-col border rounded-md overflow-hidden">
+		<ScrollArea class="flex-1 min-h-0">
 			<Table.Root>
 				<Table.Header class="sticky top-0 bg-muted z-10">
 					<Table.Row>
diff --git a/Client/svelte/src/lib/amcf/modules/ModuleConfigurationList.svelte b/Client/svelte/src/lib/amcf/modules/ModuleConfigurationList.svelte
index acc3896a8..7a05895a2 100644
--- a/Client/svelte/src/lib/amcf/modules/ModuleConfigurationList.svelte
+++ b/Client/svelte/src/lib/amcf/modules/ModuleConfigurationList.svelte
@@ -46,8 +46,10 @@
 </script>
 
 {#if visible}
-	<div class="w-full flex-1 min-h-0 border rounded-md overflow-hidden">
-		<ScrollArea class="h-full max-h-[400px]">
+	<!-- Fills the space its container gives it (a grid cell) and scrolls inside; in a
+	     stacked page it takes its natural height, at most one screen. -->
+	<div class="w-full flex-1 min-h-0 max-h-screen flex flex-col border rounded-md overflow-hidden">
+		<ScrollArea class="flex-1 min-h-0">
 			<Table.Root>
 				<Table.Header class="sticky top-0 bg-muted z-10">
 					<Table.Row>
diff --git a/Client/svelte/src/lib/amcf/modules/ModuleExecutionList.svelte b/Client/svelte/src/lib/amcf/modules/ModuleExecutionList.svelte
index df28eb00b..c0587ab84 100644
--- a/Client/svelte/src/lib/amcf/modules/ModuleExecutionList.svelte
+++ b/Client/svelte/src/lib/amcf/modules/ModuleExecutionList.svelte
@@ -65,8 +65,10 @@
 </script>
 
 {#if visible}
-	<div class="w-full border rounded-md overflow-hidden">
-		<ScrollArea class="*:data-[slot=scroll-area-viewport]:max-h-[500px]">
+	<!-- Fills the space its container gives it (a grid cell) and scrolls inside; in a
+	     stacked page it takes its natural height, at most one screen. -->
+	<div class="w-full flex-1 min-h-0 max-h-screen flex flex-col border rounded-md overflow-hidden">
+		<ScrollArea class="flex-1 min-h-0">
 			<Table.Root>
 				<Table.Header class="sticky top-0 bg-muted z-10">
 					<Table.Row>
diff --git a/Client/svelte/src/lib/amcf/modules/ModulePartList.svelte b/Client/svelte/src/lib/amcf/modules/ModulePartList.svelte
index 9ef9cb833..5dbaea064 100644
--- a/Client/svelte/src/lib/amcf/modules/ModulePartList.svelte
+++ b/Client/svelte/src/lib/amcf/modules/ModulePartList.svelte
@@ -70,7 +70,7 @@
 </script>
 
 {#if visible}
-	<div class="flex flex-col gap-3 w-full min-h-0">
+	<div class="flex flex-col gap-3 w-full flex-1 min-h-0">
 		{#if loading && !details}
 			<p class="text-sm text-muted-foreground">{loadingtext}</p>
 		{:else if errorMessage}
@@ -80,7 +80,7 @@
 		{:else}
 			{#if showdetails}
 			<!-- Build detail header -->
-			<div class="flex gap-3">
+			<div class="flex gap-3 shrink-0">
 				{#if thumbnailURL(details.thumbnail)}
 					<img
 						src={thumbnailURL(details.thumbnail)}
@@ -106,11 +106,13 @@
 			{/if}
 
 			<!-- Part list -->
-			<div class="text-xs font-semibold uppercase tracking-wider text-muted-foreground">
+			<div class="shrink-0 text-xs font-semibold uppercase tracking-wider text-muted-foreground">
 				Parts ({parts.length})
 			</div>
-			<div class="w-full border rounded-md overflow-hidden">
-				<ScrollArea class="max-h-[360px]">
+			<!-- The part table takes the space left below the build details and scrolls inside;
+			     in a stacked page it takes its natural height, at most one screen. -->
+			<div class="w-full flex-1 min-h-0 max-h-screen flex flex-col border rounded-md overflow-hidden">
+				<ScrollArea class="flex-1 min-h-0">
 					<Table.Root>
 						<Table.Header class="sticky top-0 bg-muted z-10">
 							<Table.Row>