From dcf876242b2a1f58fc38a4c61a68cfb51097edf9 Mon Sep 17 00:00:00 2001
From: Felix Ruf <felix.ruf@aoe.com>
Date: Wed, 11 Oct 2023 09:15:22 +0200
Subject: [PATCH] added a minimum height for the central component to fix
 overflowing

---
 .../src/services/useComponentHeights.ts        | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/Resources/src/services/useComponentHeights.ts b/src/Resources/src/services/useComponentHeights.ts
index cec4f8cd5..463640c47 100644
--- a/src/Resources/src/services/useComponentHeights.ts
+++ b/src/Resources/src/services/useComponentHeights.ts
@@ -8,6 +8,8 @@ interface IComponentHeightState {
   screenHeight: number
 }
 
+const MIN_TABLE_HEIGHT = 250;
+
 const listenerActive = ref(false);
 
 const windowWidth = ref(0);
@@ -27,15 +29,25 @@ const componentHeightState = reactive<IComponentHeightState>({
  * Computed maximum possible height of the table body of the ParticipantsTableBody component.
  */
 const maxTableHeight = computed(() => {
-  return componentHeightState.screenHeight - (componentHeightState.navBarHeight + componentHeightState.tableHeadHeight + componentHeightState.mealListHeight + componentHeightState.mealOverviewHeight);
+  const height = componentHeightState.screenHeight - (componentHeightState.navBarHeight + componentHeightState.tableHeadHeight + componentHeightState.mealListHeight + componentHeightState.mealOverviewHeight);
+  if (height < MIN_TABLE_HEIGHT) {
+    return MIN_TABLE_HEIGHT;
+  }
+
+  return height;
 });
 
 /**
  * Computed maximum possible height of the NoParticipations-component.
  */
 const maxNoParticipationsHeight = computed(() => {
-  return componentHeightState.screenHeight - (componentHeightState.navBarHeight + componentHeightState.mealOverviewHeight);
-})
+  const height =  componentHeightState.screenHeight - (componentHeightState.navBarHeight + componentHeightState.mealOverviewHeight);
+  if (height < MIN_TABLE_HEIGHT) {
+    return MIN_TABLE_HEIGHT;
+  }
+
+  return height;
+});
 
 /**
  * Computes the sum of margin-bottom and margin-top of an HTMLELement.