"use client"

import { CrudDialog } from "@/shared/components/crud-dialog"
import { ColumnHeader } from "@/shared/data-view/table-view"
import { useAuthApi } from "@/shared/useApi"
import { INVENTORY_CATEGORY_ROUTES } from "@garage/api"
import { InventoryCategoryForm } from "./inventory-category-form"

export function InventoryCategoryCrudDialog() {
    const api = useAuthApi()

    return (
        <CrudDialog
            title="Inventory Category"
            queryKey={[INVENTORY_CATEGORY_ROUTES.INDEX]}
            getClient={() => api.inventoryCategories}
            resourceLabel="inventory category"
            columns={() => [
                {
                    accessorKey: "title",
                    header: ({ column }) => <ColumnHeader column={column} title="Title" />,
                },
            ]}
            renderForm={({ resourceId, initialData, onSuccess }) => (
                <InventoryCategoryForm
                    resourceId={resourceId}
                    initialData={initialData}
                    onSuccess={onSuccess}
                />
            )}
        />
    )
}