import { notFound } from "next/navigation";
import { getProduct } from "@/lib/data";
import { ProductForm } from "@/components/ProductForm";
import { updateProductAction } from "@/lib/actions/products";
import {
  Card,
  CardContent,
  CardHeader,
  CardTitle,
} from "@/components/ui/card";

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

  const action = updateProductAction.bind(null, id);

  return (
    <div className="mx-auto max-w-xl px-4 py-8">
      <Card>
        <CardHeader>
          <CardTitle>Modifier le produit</CardTitle>
        </CardHeader>
        <CardContent>
          <ProductForm
            action={action}
            defaultValues={product}
            submitLabel="Enregistrer"
          />
        </CardContent>
      </Card>
    </div>
  );
}