import AppLayout from '@/layouts/app-layout';
import { index as veterinaryIndex } from '@/routes/veterinaries';
import { type BreadcrumbItem } from '@/types';
import { Head } from '@inertiajs/react';
import RegisterBannerCard from "@/components/register-banner-card";

const breadcrumbs: BreadcrumbItem[] = [
    {
        title: 'Veterinaria',
        href: veterinaryIndex().url,
    },
];

export default function Veterinary() {
    return (
        <AppLayout breadcrumbs={breadcrumbs}>
            <Head title="Veterinaria" />
            <div className="flex h-full flex-1 flex-col gap-4 overflow-x-auto rounded-xl p-4">
                <RegisterBannerCard
                    img="https://cdn-icons-png.flaticon.com/512/616/616408.png"
                    title="¡Gestiona los servicios veterinarios!"
                    description="Administra los servicios, consultas y registros veterinarios del sistema."
                    items={[
                        "Registra nuevas consultas veterinarias.",
                        "Gestiona tratamientos y seguimientos.",
                        "Consulta el historial clínico de los animales."
                    ]}
                />
                {/* Aquí va el contenido de administración veterinaria */}
            </div>
        </AppLayout>
    );
}
