From c8ff0dd9dd6e941db3e81b959f6af60e882f16f1 Mon Sep 17 00:00:00 2001
From: franc <franc@FRANCESCOSBUSIN>
Date: Wed, 16 Apr 2025 11:20:33 +0200
Subject: [PATCH] Make a searchResultPartial and initial HomePage with filter
 system

---
 .../Views/Home/Index.cshtml                   |  6 +++
 .../Views/Home/_SearchResultsPartial.cshtml   | 54 +++++++++++++++++++
 2 files changed, 60 insertions(+)
 create mode 100644 Francesco.Recipes.World/Views/Home/Index.cshtml
 create mode 100644 Francesco.Recipes.World/Views/Home/_SearchResultsPartial.cshtml

diff --git a/Francesco.Recipes.World/Views/Home/Index.cshtml b/Francesco.Recipes.World/Views/Home/Index.cshtml
new file mode 100644
index 0000000..8de8ea4
--- /dev/null
+++ b/Francesco.Recipes.World/Views/Home/Index.cshtml
@@ -0,0 +1,6 @@
+<form hx-get="/Home/Search" hx-target="#search-results" hx-trigger="keyup changed delay:300ms" onsubmit="return false;" class="mb-4">
+	<input type="text" name="query" class="form-control" placeholder="Suchen nach Rezepten oder Zutaten..." autocomplete="off" />
+</form>
+
+<div id="search-results" class="mt-4"></div>
+
diff --git a/Francesco.Recipes.World/Views/Home/_SearchResultsPartial.cshtml b/Francesco.Recipes.World/Views/Home/_SearchResultsPartial.cshtml
new file mode 100644
index 0000000..e18ad55
--- /dev/null
+++ b/Francesco.Recipes.World/Views/Home/_SearchResultsPartial.cshtml
@@ -0,0 +1,54 @@
+@model IEnumerable<Francesco.Recipes.World.Models.BackendModels.Recipe.Recipe>
+
+@if (!Model.Any())
+{
+	<p class="text-muted">Keine Ergebnisse gefunden.</p>
+}
+else
+{
+	<div class="row">
+		@foreach (var recipe in Model)
+		{
+			<div class="col-md-4 mb-3">
+				<div class="card h-100 shadow-sm">
+					<div class="recipe-image">
+						@{
+							var mediaFile = recipe.MediaFiles.FirstOrDefault();
+						}
+						@if (mediaFile != null && mediaFile.Data != null)
+						{
+							<img src="data:@mediaFile.MimeType;base64,@Convert.ToBase64String(mediaFile.Data)"
+								 alt="@recipe.Name"
+								 class="card-img-top" />
+						}
+						else
+						{
+							<img src="~/images/placeholder.png"
+								 alt="Platzhalter"
+								 class="card-img-top" />
+						}
+					</div>
+
+					<div class="card-body d-flex flex-column justify-content-between">
+						<div>
+							<h5 class="card-title">@recipe.Name</h5>
+							<p class="card-text text-muted mb-2">
+								<i class="bi bi-clock"></i>
+								@recipe.PreparationTime.Hours h @recipe.PreparationTime.Minutes min
+							</p>
+						</div>
+
+						<div>
+							<button class="btn btn-outline-secondary"
+									hx-post="/Recipe/ToggleFavorite"
+									hx-vals='{"id": "@recipe.Id"}'
+									hx-swap="outerHTML">
+								<i class="bi @((recipe.IsFavorite) ? "bi-star-fill" : "bi-star")"></i>
+							</button>
+						</div>
+					</div>
+				</div>
+			</div>
+		}
+	</div>
+}