make yeast swapper bilingual with case-insensitive detection

src/lib/components/HefeSwapper.svelte

@@ -3,15 +3,18 @@
 	import { browser } from '$app/environment';
 	import { enhance } from '$app/forms';
 	import { page } from '$app/stores';
-	
+
-	export let item;
+	let { item, multiplier = 1, yeastId = 0, lang = 'de' } = $props();
-	export let multiplier = 1;
+
-	export let yeastId = 0;
-	
 	const dispatch = createEventDispatcher();
-	
+
+	const isEnglish = $derived(lang === 'en');
+	const toggleTitle = $derived(isEnglish
+		? 'Switch between fresh yeast and dry yeast'
+		: 'Zwischen Frischhefe und Trockenhefe wechseln');
+
 	// Get all current URL parameters to preserve state
-	$: currentParams = browser ? new URLSearchParams(window.location.search) : $page.url.searchParams;
+	const currentParams = $derived(browser ? new URLSearchParams(window.location.search) : $page.url.searchParams);
 	
 	function toggleHefe(event) {
 		// If JavaScript is available, prevent form submission and handle client-side
@@ -54,7 +57,7 @@
 	{#each Array.from(currentParams.entries()) as [key, value]}
 		<input type="hidden" name="currentParam_{key}" value={value} />
 	{/each}
-	<button type="submit" on:click={toggleHefe} title="Zwischen Frischhefe und Trockenhefe wechseln">
+	<button type="submit" on:click={toggleHefe} title={toggleTitle}>
 		<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M105.1 202.6c7.7-21.8 20.2-42.3 37.8-59.8c62.5-62.5 163.8-62.5 226.3 0L386.3 160 352 160c-17.7 0-32 14.3-32 32s14.3 32 32 32l111.5 0c0 0 0 0 0 0l.4 0c17.7 0 32-14.3 32-32l0-112c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 35.2L414.4 97.6c-87.5-87.5-229.3-87.5-316.8 0C73.2 122 55.6 150.7 44.8 181.4c-5.9 16.7 2.9 34.9 19.5 40.8s34.9-2.9 40.8-19.5zM39 289.3c-5 1.5-9.8 4.2-13.7 8.2c-4 4-6.7 8.8-8.1 14c-.3 1.2-.6 2.5-.8 3.8c-.3 1.7-.4 3.4-.4 5.1L16 432c0 17.7 14.3 32 32 32s32-14.3 32-32l0-35.1 17.6 17.5c0 0 0 0 0 0c87.5 87.4 229.3 87.4 316.7 0c24.4-24.4 42.1-53.1 52.9-83.8c5.9-16.7-2.9-34.9-19.5-40.8s-34.9 2.9-40.8 19.5c-7.7 21.8-20.2 42.3-37.8 59.8c-62.5 62.5-163.8 62.5-226.3 0l-.1-.1L125.6 352l34.4 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L48.4 288c-1.6 0-3.2 .1-4.8 .3s-3.1 .5-4.6 1z"/></svg>
 	</button>
 </form>

src/lib/components/IngredientsPage.svelte

@@ -25,8 +25,9 @@ const yeastIds = $derived.by(() => {
 			if (list.list) {
 				for (let ingredientIndex = 0; ingredientIndex < list.list.length; ingredientIndex++) {
 					const ingredient = list.list[ingredientIndex];
-					if (ingredient.name === "Frischhefe" || ingredient.name === "Trockenhefe" ||
+					const nameLower = ingredient.name.toLowerCase();
-					    ingredient.name === "Fresh Yeast" || ingredient.name === "Dry Yeast") {
+					if (nameLower === "frischhefe" || nameLower === "trockenhefe" ||
+					    nameLower === "fresh yeast" || nameLower === "dry yeast") {
 						ids[`${listIndex}-${ingredientIndex}`] = yeastCounter++;
 					}
 				}
@@ -408,9 +409,9 @@ span
 		<div class=amount>{@html adjust_amount(item.amount, multiplier)} {item.unit}</div>
 		<div class=name>
 			{@html item.name.replace("{{multiplier}}", isNaN(parseFloat(item.amount)) ? multiplier : multiplier * parseFloat(item.amount))}
-			{#if item.name === "Frischhefe" || item.name === "Trockenhefe" || item.name === "Fresh Yeast" || item.name === "Dry Yeast"}
+			{#if item.name.toLowerCase() === "frischhefe" || item.name.toLowerCase() === "trockenhefe" || item.name.toLowerCase() === "fresh yeast" || item.name.toLowerCase() === "dry yeast"}
 				{@const yeastId = yeastIds[`${listIndex}-${ingredientIndex}`] ?? 0}
-				<HefeSwapper {item} {multiplier} {yeastId} />
+				<HefeSwapper {item} {multiplier} {yeastId} lang={data.lang} />
 			{/if}
 		</div>
 	{/each}

src/routes/[recipeLang]/[name]/+page.ts

@@ -38,9 +38,10 @@ export async function load({ fetch, params, url}) {
                 for (let ingredientIndex = 0; ingredientIndex < list.list.length; ingredientIndex++) {
                     const ingredient = list.list[ingredientIndex];
                     
-                    // Check if this is a yeast ingredient (both German and English names)
+                    // Check if this is a yeast ingredient (both German and English names, case-insensitive)
-                    const isFreshYeast = ingredient.name === "Frischhefe" || ingredient.name === "Fresh Yeast";
+                    const nameLower = ingredient.name.toLowerCase();
-                    const isDryYeast = ingredient.name === "Trockenhefe" || ingredient.name === "Dry Yeast";
+                    const isFreshYeast = nameLower === "frischhefe" || nameLower === "fresh yeast";
+                    const isDryYeast = nameLower === "trockenhefe" || nameLower === "dry yeast";
 
                     if (isFreshYeast || isDryYeast) {
                         // Check if this yeast should be toggled
@@ -57,7 +58,7 @@ export async function load({ fetch, params, url}) {
 
                             if (isFreshYeast) {
                                 // Convert fresh yeast to dry yeast
-                                newName = isEnglish ? "Dry Yeast" : "Trockenhefe";
+                                newName = isEnglish ? "Dry yeast" : "Trockenhefe";
                                 
                                 if (originalUnit === "Prise") {
                                     // "1 Prise Frischhefe" → "1 Prise Trockenhefe"
@@ -74,7 +75,7 @@ export async function load({ fetch, params, url}) {
                                 }
                             } else if (isDryYeast) {
                                 // Convert dry yeast to fresh yeast
-                                newName = isEnglish ? "Fresh Yeast" : "Frischhefe";
+                                newName = isEnglish ? "Fresh yeast" : "Frischhefe";
                                 
                                 if (originalUnit === "Prise") {
                                     // "1 Prise Trockenhefe" → "1 g Frischhefe"