From f23aab4b3f2c5dbfdd1c4e7131fec4555d1a93a8 Mon Sep 17 00:00:00 2001
From: Anika Raemer <araemer@laptop-anika.raemer.net>
Date: Sun, 7 Sep 2025 20:57:13 +0200
Subject: [PATCH] validate ingredient groups as well as ingredient lists of all
 groups

---
 .../src/components/IngredientListEditor.tsx    |  1 +
 frontend/src/components/RecipeEditor.tsx       | 18 ++++++++++++++++--
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/IngredientListEditor.tsx b/frontend/src/components/IngredientListEditor.tsx
index d0d4189..bbc2750 100644
--- a/frontend/src/components/IngredientListEditor.tsx
+++ b/frontend/src/components/IngredientListEditor.tsx
@@ -27,6 +27,7 @@ export function IngredientListEditor({ ingredients, onChange }: IngredientListEd
 
   return (
     <div>
+      <h3 className="subsection-heading">Ingredients</h3>
       {ingredients.map((ing, index) => (
         <div key={index} className="flex gap-2 mb-2 items-center">
           <input
diff --git a/frontend/src/components/RecipeEditor.tsx b/frontend/src/components/RecipeEditor.tsx
index be32a18..be3acb4 100644
--- a/frontend/src/components/RecipeEditor.tsx
+++ b/frontend/src/components/RecipeEditor.tsx
@@ -2,6 +2,7 @@ import { useState } from "react"
 import type { Recipe } from "../types/recipe"
 import type { IngredientGroup } from "../types/ingredientGroup"
 import { IngredientGroupListEditor } from "./IngredientGroupListEditor"
+import { IngredientListEditor } from "./IngredientListEditor"
 
 type RecipeEditorProps = {
   recipe: Recipe
@@ -39,10 +40,23 @@ export default function RecipeEditor({ recipe, onSave, onCancel }: RecipeEditorP
       newErrors.title = true
     }
 
-    // the incredient list must not be empty
-    // @todo enhance validation and visualization of ingredient errors
+    /* there must be at least one ingredient group
+     * no group may contain an empty ingredient list
+     * @todo check whether all ingredients are valid
+     * @todo enhance visualization of ingredient errors
+     */
     if (!draft.ingredientGroupList || draft.ingredientGroupList.length === 0) {
       newErrors.ingredients = true
+    } else {
+      let isAnyIngredientListEmpty = draft.ingredientGroupList.some(
+        ingGrp => {
+          return !ingGrp.ingredientList || ingGrp.ingredientList.length === 0
+        }
+      )
+      console.log(isAnyIngredientListEmpty)
+      if(isAnyIngredientListEmpty){
+        newErrors.ingredients = true
+      }
     }
 
     setErrors(newErrors)