import { Head } from '@inertiajs/react'; import { useEffect, useState } from 'react'; import { type BreadcrumbItem } from '@/types'; import AppLayout from '@/layouts/app-layout'; import { Phone } from 'lucide-react'; interface TelephoneData { name: string; number: string; } interface TelephoneEntry { type: string; data: TelephoneData; } interface TelephoneItem { id: number; section: string; telephones: TelephoneEntry[]; sort_order: number; created_at: string; updated_at: string; } interface TelephonesApiResponse { telephones: TelephoneItem[]; } const getBreadcrumbs = (): BreadcrumbItem[] => [ { title: 'Strona Główna', href: '/', }, { title: 'Telefony', href: '/telefony', }, ]; export default function Telephones() { const [telephonesData, setTelephonesData] = useState(null); const [loading, setLoading] = useState(true); useEffect(() => { setLoading(true); fetch('/api/telephones') .then(response => response.json()) .then(data => { setTelephonesData(data); setLoading(false); }) .catch(error => { console.error('Error fetching telephones:', error); setTelephonesData(null); setLoading(false); }); }, []); return (

Telefony

{loading ? (
Wczytywanie zawartości...
) : !telephonesData || !telephonesData.telephones || telephonesData.telephones.length === 0 ? (
Brak danych.
) : (
{telephonesData.telephones.map((item) => (

{item.section}

))}
)}
); }