import { Head } from '@inertiajs/react'; import { useEffect, useState } from 'react'; import AppLayout from '@/layouts/app-layout'; import { Pagination } from '@/components/pagination'; import { Card, CardContent, CardFooter, CardHeader, CardTitle } from '@/components/ui/card'; import { Button } from '@/components/ui/button'; import { Calendar, FileText, Download } from 'lucide-react'; import { Skeleton } from '@/components/ui/skeleton'; import { SingleImageLightbox } from '@/components/image-lightbox'; const globalStyles = ` .diet-photo-container img { height: 100% !important; object-fit: cover !important; width: 100% !important; } `; import { type BreadcrumbItem } from '@/types'; interface Diet { id: number; name: string; breakfast_photo: string | null; lunch_photo: string | null; breakfast_body: string | null; lunch_body: string | null; diet_attachment: string | null; published_at: string; } interface PaginationData { current_page: number; last_page: number; per_page: number; total: number; } interface DietsData { diets: Diet[]; pagination: PaginationData; } interface DietsProps { page?: string | number; } const getBreadcrumbs = (): BreadcrumbItem[] => [ { title: 'Strona Główna', href: '/', }, { title: 'Pilotaż "Dobry posiłek"', href: '/diety', }, ]; export default function Diets({ page = 1 }: DietsProps) { const [dietsData, setDietsData] = useState(null); const [loading, setLoading] = useState(true); const [currentPage, setCurrentPage] = useState(typeof page === 'string' ? parseInt(page) : page); const fetchDiets = (page: number) => { setLoading(true); fetch(`/api/diets?page=${page}&per_page=7`) .then(response => response.json()) .then(data => { setDietsData(data); setLoading(false); }) .catch(error => { console.error('Błąd podczas pobierania diet:', error); setLoading(false); }); }; useEffect(() => { fetchDiets(currentPage); }, [currentPage]); useEffect(() => { const initialPage = typeof page === 'string' ? parseInt(page) : page; if (initialPage !== currentPage) { setCurrentPage(initialPage); } }, [page]); const handlePageChange = (page: number) => { setCurrentPage(page); window.scrollTo(0, 0); if (page === 1) { window.history.pushState({}, '', '/diety'); } else { window.history.pushState({}, '', `/diety?strona=${page}`); } }; const formatDate = (dateString: string) => { const date = new Date(dateString); return date.toLocaleDateString('pl-PL', { day: 'numeric', month: 'long', year: 'numeric' }); }; return (