import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout';
import DrugDeleteAction from '@/Pages/Drug/DrugDeleteAction';
import { DrugsTable } from '@/Pages/Drug/DrugsTable';
import { Drug, DrugsResponse } from '@/types';
import { Head } from '@inertiajs/react';
import { ColumnDef } from '@tanstack/react-table';

interface AdminListProps {
    drugs: DrugsResponse;
    canEdit: boolean;
    canCreate: boolean;
}

export default function AdminList({
    drugs,
    canEdit,
    canCreate,
}: AdminListProps) {
    const tableColumns: ColumnDef<Drug>[] = [
        {
            accessorKey: 'name',
            header: 'Nome',
        },
        {
            accessorKey: 'active_ingredient',
            header: 'Principio attivo',
        },
        {
            accessorKey: 'package_unit',
            header: 'Contenuto',
        },
        {
            accessorKey: 'administration_condition',
            header: 'Modalità di somministrazione',
        },
        {
            id: 'actions',
            cell: ({ row }) => {
                const drug: Drug = row.original;

                return canEdit ? <DrugDeleteAction drug={drug} /> : null;
            },
        },
    ];

    return (
        <AuthenticatedLayout
            backLink={route('dashboard')}
            backLinkLabel="Dashboard"
        >
            <Head title="Farmaci" />

            <div className="py-2">
                <div className="mx-auto max-w-7xl sm:px-6 lg:px-8">
                    <div className="overflow-hidden sm:rounded-lg">
                        <div className="p-6 text-gray-900">
                            <div className="scroll-m-20 text-4xl font-light tracking-tight lg:text-5xl">
                                Farmaci
                            </div>
                            <div className="container mx-auto py-10">
                                <DrugsTable
                                    columns={tableColumns}
                                    data={drugs.data}
                                    rowCount={drugs.total}
                                    pageSize={drugs.per_page}
                                    pageCount={drugs.last_page}
                                    canEdit={canEdit}
                                    canCreate={canCreate}
                                />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </AuthenticatedLayout>
    );
}
