refactor: clean up recipe routes and reduce bundle size

- Eliminate duplicate API fetch in recipe page by passing item from
  server load to universal load instead of fetching twice
- Replace cheerio with simple regex in stripHtmlTags, removing ~200KB
  dependency
- Refactor multiplier buttons in IngredientsPage to use loop instead
  of 5 repeated form elements
- Move /rezepte/untranslated to /[recipeLang]/admin/untranslated and
  delete legacy /rezepte/ layout files

src/lib/components/IngredientsPage.svelte

@@ -124,6 +124,15 @@ const labels = $derived({
 	ingredients: isEnglish ? 'Ingredients' : 'Zutaten'
 });
 
+// Multiplier button options
+const multiplierOptions = [
+	{ value: 0.5, label: '<sup>1</sup>/<sub>2</sub>x' },
+	{ value: 1, label: '1x' },
+	{ value: 1.5, label: '<sup>3</sup>/<sub>2</sub>x' },
+	{ value: 2, label: '2x' },
+	{ value: 3, label: '3x' }
+];
+
 // Calculate yeast IDs for each yeast ingredient
 const yeastIds = $derived.by(() => {
 	const ids = {};
@@ -447,65 +456,31 @@ h3 a:hover {
 
 <h3>{labels.adjustAmount}</h3>
 <div class=multipliers>
-	<form method="get" style="display: inline;">
-		<input type="hidden" name="multiplier" value="0.5" />
-		{#each Array.from(currentParams.entries()) as [key, value]}
-			{#if key !== 'multiplier'}
-				<input type="hidden" name={key} value={value} />
-			{/if}
-		{/each}
-		<button type="submit" class:selected={multiplier==0.5} onclick={(e) => handleMultiplierClick(e, 0.5)}>{@html "<sup>1</sup>/<sub>2</sub>x"}</button>
-	</form>
-	<form method="get" style="display: inline;">
-		<input type="hidden" name="multiplier" value="1" />
-		{#each Array.from(currentParams.entries()) as [key, value]}
-			{#if key !== 'multiplier'}
-				<input type="hidden" name={key} value={value} />
-			{/if}
-		{/each}
-		<button type="submit" class:selected={multiplier==1} onclick={(e) => handleMultiplierClick(e, 1)}>1x</button>
-	</form>
-	<form method="get" style="display: inline;">
-		<input type="hidden" name="multiplier" value="1.5" />
-		{#each Array.from(currentParams.entries()) as [key, value]}
-			{#if key !== 'multiplier'}
-				<input type="hidden" name={key} value={value} />
-			{/if}
-		{/each}
-		<button type="submit" class:selected={multiplier==1.5} onclick={(e) => handleMultiplierClick(e, 1.5)}>{@html "<sup>3</sup>/<sub>2</sub>x"}</button>
-	</form>
-	<form method="get" style="display: inline;">
-		<input type="hidden" name="multiplier" value="2" />
-		{#each Array.from(currentParams.entries()) as [key, value]}
-			{#if key !== 'multiplier'}
-				<input type="hidden" name={key} value={value} />
-			{/if}
-		{/each}
-		<button type="submit" class:selected={multiplier==2} onclick={(e) => handleMultiplierClick(e, 2)}>2x</button>
-	</form>
-	<form method="get" style="display: inline;">
-		<input type="hidden" name="multiplier" value="3" />
-		{#each Array.from(currentParams.entries()) as [key, value]}
-			{#if key !== 'multiplier'}
-				<input type="hidden" name={key} value={value} />
-			{/if}
-		{/each}
-		<button type="submit" class:selected={multiplier==3} onclick={(e) => handleMultiplierClick(e, 3)}>3x</button>
-	</form>
+	{#each multiplierOptions as opt}
+		<form method="get" style="display: inline;">
+			<input type="hidden" name="multiplier" value={opt.value} />
+			{#each Array.from(currentParams.entries()) as [key, value]}
+				{#if key !== 'multiplier'}
+					<input type="hidden" name={key} {value} />
+				{/if}
+			{/each}
+			<button type="submit" class:selected={multiplier === opt.value} onclick={(e) => handleMultiplierClick(e, opt.value)}>{@html opt.label}</button>
+		</form>
+	{/each}
 	<form method="get" style="display: inline;" class="custom-multiplier" onsubmit={handleCustomSubmit}>
 		{#each Array.from(currentParams.entries()) as [key, value]}
 			{#if key !== 'multiplier'}
-				<input type="hidden" name={key} value={value} />
+				<input type="hidden" name={key} {value} />
 			{/if}
 		{/each}
-		<input 
-			type="text" 
-			name="multiplier" 
-			pattern="[0-9]+(\.[0-9]*)?" 
-			title="Enter a positive number (e.g., 2.5, 0.75, 3.14)" 
-			placeholder="…" 
+		<input
+			type="text"
+			name="multiplier"
+			pattern="[0-9]+(\.[0-9]*)?"
+			title="Enter a positive number (e.g., 2.5, 0.75, 3.14)"
+			placeholder="…"
 			class="custom-input"
-			value={multiplier != 0.5 && multiplier != 1 && multiplier != 1.5 && multiplier != 2 && multiplier != 3 ? multiplier : ''}
+			value={!multiplierOptions.some(o => o.value === multiplier) ? multiplier : ''}
 			oninput={handleCustomInput}
 		/>
 		<button type="submit" class="custom-button">x</button>

src/lib/js/stripHtmlTags.ts

@@ -1,10 +1,16 @@
 // Function to strip HTML tags from a string
-import {load} from 'cheerio';
-
 export function stripHtmlTags(input: string | undefined | null): string {
   if (!input) {
     return '';
   }
-  const $ = load(input.replace(/­/g, ''));
-  return $.text();
+  return input
+    .replace(/­/g, '')      // Remove soft hyphens
+    .replace(/<[^>]*>/g, '')    // Remove HTML tags
+    .replace(/&amp;/g, '&')     // Decode common HTML entities
+    .replace(/&lt;/g, '<')
+    .replace(/&gt;/g, '>')
+    .replace(/&quot;/g, '"')
+    .replace(/&#39;/g, "'")
+    .replace(/&nbsp;/g, ' ')
+    .trim();
 }

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

@@ -2,18 +2,13 @@ import { redirect, error } from '@sveltejs/kit';
 import { stripHtmlTags } from '$lib/js/stripHtmlTags';
 
 export async function load({ params, fetch }) {
-    // Fetch recipe data to strip HTML tags server-side
-    // This avoids bundling cheerio in the client bundle
     const isEnglish = params.recipeLang === 'recipes';
     const apiBase = isEnglish ? '/api/recipes' : '/api/rezepte';
 
     const res = await fetch(`${apiBase}/items/${params.name}`);
     if (!res.ok) {
-        // Let the universal load function handle the error
-        return {
-            strippedName: '',
-            strippedDescription: '',
-        };
+        const errorData = await res.json().catch(() => ({ message: 'Recipe not found' }));
+        throw error(res.status, errorData.message);
     }
 
     const item = await res.json();
@@ -21,6 +16,7 @@ export async function load({ params, fetch }) {
     const strippedDescription = stripHtmlTags(item.description);
 
     return {
+        item,
         strippedName,
         strippedDescription,
     };

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

@@ -1,15 +1,10 @@
-import { error } from "@sveltejs/kit";
 import { generateRecipeJsonLd } from '$lib/js/recipeJsonLd';
 
 export async function load({ fetch, params, url, data }) {
     const isEnglish = params.recipeLang === 'recipes';
-    const apiBase = isEnglish ? '/api/recipes' : '/api/rezepte';
 
-    const res = await fetch(`${apiBase}/items/${params.name}`);
-    let item = await res.json();
-    if(!res.ok){
-	    throw error(res.status, item.message)
-    }
+    // Use item from server load - no duplicate fetch needed
+    let item = { ...data.item };
 
     // Check if this recipe is favorited by the user
     let isFavorite = false;
@@ -118,8 +113,11 @@ export async function load({ fetch, params, url, data }) {
     const englishShortName = !isEnglish ? (item.translations?.en?.short_name || '') : '';
     const germanShortName = isEnglish ? (item.germanShortName || '') : item.short_name;
 
+    // Destructure to exclude item (already spread below)
+    const { item: _, ...serverData } = data;
+
     return {
-        ...data,  // Include server load data (strippedName, strippedDescription)
+        ...serverData,  // Include server load data (strippedName, strippedDescription)
         ...item,
         isFavorite,
         multiplier,

src/routes/[recipeLang=recipeLang]/admin/untranslated/+page.server.ts

@@ -1,12 +1,13 @@
 import type { PageServerLoad } from "./$types";
 import { redirect, error } from '@sveltejs/kit';
 
-export const load: PageServerLoad = async ({ fetch, locals }) => {
+export const load: PageServerLoad = async ({ fetch, locals, url, params }) => {
 	const session = await locals.auth();
 
 	// Redirect to login if not authenticated
 	if (!session?.user?.nickname) {
-		throw redirect(302, '/login?callbackUrl=/rezepte/untranslated');
+		const callbackUrl = encodeURIComponent(url.pathname);
+		throw redirect(302, `/login?callbackUrl=${callbackUrl}`);
 	}
 
 	// Check user group permission
@@ -21,6 +22,7 @@ export const load: PageServerLoad = async ({ fetch, locals }) => {
 			return {
 				untranslated: [],
 				session,
+				recipeLang: params.recipeLang,
 				error: 'Fehler beim Laden der unübersetzten Rezepte'
 			};
 		}
@@ -29,12 +31,14 @@ export const load: PageServerLoad = async ({ fetch, locals }) => {
 
 		return {
 			untranslated,
-			session
+			session,
+			recipeLang: params.recipeLang
 		};
 	} catch (e) {
 		return {
 			untranslated: [],
 			session,
+			recipeLang: params.recipeLang,
 			error: 'Fehler beim Laden der unübersetzten Rezepte'
 		};
 	}

src/routes/[recipeLang=recipeLang]/admin/untranslated/+page.svelte

@@ -127,16 +127,16 @@ h1 {
 			<Card
 				{recipe}
 				{current_month}
-				routePrefix="/rezepte"
+				routePrefix="/{data.recipeLang}"
 				translationStatus={recipe.translationStatus}
 			></Card>
 		{/each}
 	</Recipes>
 {:else}
 	<div class="empty-state">
-		<p>🎉 Alle Rezepte sind übersetzt!</p>
+		<p>Alle Rezepte sind übersetzt!</p>
 		<p style="font-size: 1rem; margin-top: 1rem;">
-			<a href="/rezepte">Zurück zu den Rezepten</a>
+			<a href="/{data.recipeLang}">Zurück zu den Rezepten</a>
 		</p>
 	</div>
 {/if}

src/routes/[recipeLang=recipeLang]/administration/+page.svelte

@@ -16,7 +16,7 @@
 			description: isEnglish
 				? 'View and manage recipes that need translation'
 				: 'Rezepte ansehen und verwalten, die übersetzt werden müssen',
-			href: '/rezepte/untranslated',
+			href: `/${data.recipeLang}/admin/untranslated`,
 			icon: '🌐'
 		},
 		{

src/routes/rezepte/+layout.server.ts

@@ -1,9 +0,0 @@
-import type { LayoutServerLoad } from './$types';
-
-export const load: LayoutServerLoad = async ({ locals }) => {
-	const session = await locals.auth();
-
-	return {
-		session
-	};
-};

src/routes/rezepte/+layout.svelte

@@ -1,43 +0,0 @@
-<script lang="ts">
-	import { page } from '$app/stores';
-	import Header from '$lib/components/Header.svelte';
-	import UserHeader from '$lib/components/UserHeader.svelte';
-	import LanguageSelector from '$lib/components/LanguageSelector.svelte';
-
-	let { data, children } = $props();
-	let user = $derived(data.session?.user);
-
-	function isActive(path: string) {
-		const currentPath = $page.url.pathname;
-		return currentPath.startsWith(path);
-	}
-</script>
-
-<Header>
-	{#snippet links()}
-		<ul class="site_header">
-			<li><a href="/rezepte" class:active={isActive('/rezepte') && $page.url.pathname === '/rezepte'}>Alle Rezepte</a></li>
-			{#if user}
-				<li><a href="/rezepte/favorites" class:active={isActive('/rezepte/favorites')}>Favoriten</a></li>
-			{/if}
-			<li><a href="/rezepte/season" class:active={isActive('/rezepte/season')}>Saison</a></li>
-			<li><a href="/rezepte/category" class:active={isActive('/rezepte/category')}>Kategorie</a></li>
-			<li><a href="/rezepte/icon" class:active={isActive('/rezepte/icon')}>Icon</a></li>
-			<li><a href="/rezepte/tag" class:active={isActive('/rezepte/tag')}>Tags</a></li>
-		</ul>
-	{/snippet}
-
-	{#snippet language_selector_mobile()}
-		<LanguageSelector />
-	{/snippet}
-
-	{#snippet language_selector_desktop()}
-		<LanguageSelector />
-	{/snippet}
-
-	{#snippet right_side()}
-		<UserHeader {user} recipeLang="rezepte" lang="de"></UserHeader>
-	{/snippet}
-
-	{@render children()}
-</Header>