import AdminLayout from '@admin/layouts/admin/admin-layout';
import { Head } from '@inertiajs/react';
import { ReactNode } from 'react';
import PackageForm, { PackageData } from './PackageForm';

interface Props {
    readonly package: PackageData;
    readonly error?: string;
    readonly errors?: Record<string, string>;
}

export default function Edit({ package: pkg, error, errors }: Props) {
    console.log('Editing package:', pkg);
    return (
        <>
            <Head title={`Edit Package: ${pkg.name} - Admin Panel`} />

            <div className="space-y-6">
                <PackageForm package={pkg} isEdit={true} />
            </div>
        </>
    );
}

Edit.layout = (page: ReactNode) => (
    <AdminLayout
        breadcrumbs={[
            { title: 'Dashboard', href: route('admin.dashboard') },
            { title: 'Packages', href: route('admin.packages.index') },
            { title: 'Edit', href: '#' },
        ]}
    >
        {page}
    </AdminLayout>
);
