Files
recipe-app/frontend/app/recipes/page.tsx
T
Nils-Johan Gynther 73bf5193c4 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.
2026-04-15 19:46:50 +02:00

34 lines
1.0 KiB
TypeScript

import Link from 'next/link';
import { fetchJson } from '../../lib/api';
import type { Recipe } from '../../features/inventory/types';
import Navigation from '../Navigation';
import RecipeGrid from './RecipeGrid';
export default async function RecipesPage() {
const recipes = await fetchJson<Recipe[]>('/api/recipes');
return (
<main style={{ padding: '1rem', maxWidth: '1000px', margin: '0 auto' }}>
<Navigation />
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1.5rem' }}>
<h1 style={{ margin: 0 }}>Recept</h1>
<Link
href="/recipes/create"
style={{
padding: '0.5rem 1rem',
background: '#0070f3',
color: 'white',
borderRadius: '4px',
textDecoration: 'none',
fontWeight: 500,
fontSize: '1rem',
}}
>
Lägg till nytt recept
</Link>
</div>
<RecipeGrid recipes={recipes} />
</main>
);
}