import { ProductForm } from "@/components/dashboard/catalog/ProductForm";
import { EditLockIndicator } from "@/components/dashboard/EditLockIndicator";
import {
  getProductById,
  getCategoryOptions,
  getBrandOptions,
  getManufacturerOptions,
  getSupplierOptions,
  getTaxClassOptions,
  getEuResponsiblePersonOptions,
} from "@/actions/catalog";
import { notFound } from "next/navigation";

type Option = { id: string; name: string };
type CompanyOption = { id: string; name: string };

export default async function EditProductPage({
  params,
}: {
  params: Promise<{ id: string }>;
}) {
  const { id } = await params;

  if (!id) {
    return notFound();
  }

  const result = await getProductById(id);

  if (!result.success || !result.data) {
    return notFound();
  }

  const product = result.data;

  const [
    categories,
    brands,
    manufacturers,
    suppliers,
    taxClasses,
    euResponsiblePersons,
  ] = await Promise.all([
    getCategoryOptions({}),
    getBrandOptions({}),
    getManufacturerOptions({}),
    getSupplierOptions({}),
    getTaxClassOptions({}),
    getEuResponsiblePersonOptions({}),
  ]);

  return (
    <div className="max-w-screen-2xl mx-auto px-4 sm:px-6 lg:px-8 py-10">
      <div className="mb-8 text-center">
        <h1 className="text-3xl font-bold">Produkt bearbeiten</h1>
        <p className="text-muted-foreground mt-2">
          Details für Produkt &quot;{product.name}&quot; aktualisieren.
        </p>
      </div>
      
      <EditLockIndicator entityType="product" entityId={id} />

      <ProductForm
        initialData={product}
        categories={(categories as any) || []}
        brands={(brands as any) || []}
        manufacturers={(manufacturers as any) || []}
        suppliers={(suppliers as any) || []}
        taxClasses={(taxClasses as any) || []}
        euResponsiblePersons={(euResponsiblePersons as any) || []}
      />
    </div>
  );
}