import { Head, router } from '@inertiajs/react';
import Heading from '@/components/heading';
import { dashboard } from '@/routes';
import { create, index } from '@/routes/admin/journal-entries';
import { JournalEntryForm } from './journal-entry-form';
import type {
    AccountOption,
    CostCenterOption,
    JournalTypeOption,
} from './journal-entry-form';

export default function JournalEntriesCreate({
    accounts,
    costCenters,
    journalTypes,
}: {
    accounts: AccountOption[];
    costCenters: CostCenterOption[];
    journalTypes: JournalTypeOption[];
}) {
    return (
        <>
            <Head title="Nouvelle écriture" />

            <div className="flex h-full flex-1 flex-col gap-6 p-4 md:p-6">
                <Heading
                    title="Nouvelle écriture"
                    description="Saisir une écriture comptable en brouillon"
                />

                <JournalEntryForm
                    accounts={accounts}
                    costCenters={costCenters}
                    journalTypes={journalTypes}
                    onCancel={() => router.get(index.url())}
                />
            </div>
        </>
    );
}

JournalEntriesCreate.layout = {
    breadcrumbs: [
        { title: 'Tableau de bord', href: dashboard() },
        { title: 'Écritures', href: index() },
        { title: 'Créer', href: create() },
    ],
};
