feat: add image handling to recipes

- Implemented image downloading and optimization in QuickImportService.
- Added imageUrl field to CreateRecipeDto for recipe creation.
- Created an endpoint in RecipesController to update recipe images.
- Enhanced RecipesService to handle image URL updates and optimizations.
- Updated Docker Compose to mount a volume for recipe images.
- Refactored frontend to display images in recipe grids and detail views.
- Added a new utility function for downloading and optimizing images.
- Created a new API route for handling image uploads.
- Introduced RecipeGrid component for better recipe display.
- Updated RecipeDetailClient to manage image updates and display.
- Added migration for new imageUrl column in the Recipe table.

frontend/app/recipes/[id]/page.tsx

@@ -0,0 +1,27 @@
+import { fetchJson } from '../../../lib/api';
+import type { Recipe } from '../../../features/inventory/types';
+import Navigation from '../../Navigation';
+import RecipeDetailClient from './RecipeDetailClient';
+import { notFound } from 'next/navigation';
+
+interface Props {
+  params: Promise<{ id: string }>;
+}
+
+export default async function RecipeDetailPage({ params }: Props) {
+  const { id } = await params;
+  let recipe: Recipe;
+
+  try {
+    recipe = await fetchJson<Recipe>(`/api/recipes/${id}`);
+  } catch {
+    notFound();
+  }
+
+  return (
+    <main style={{ padding: '1rem', maxWidth: '900px', margin: '0 auto' }}>
+      <Navigation />
+      <RecipeDetailClient recipe={recipe} />
+    </main>
+  );
+}