import { db } from "@/lib/db"
import { notFound } from "next/navigation"
import { ProductForm } from "@/components/admin/product-form"
import { Button } from "@/components/ui/button"
import { updateProduct, deleteProduct } from "../actions"
import { normalizeProductArrays } from "@/lib/json-array"

export const metadata = { title: "Admin — Modifier le produit" }

export default async function EditProductPage({ params }: { params: Promise<{ id: string }> }) {
  const { id } = await params
  const [productRaw, categories, drops] = await Promise.all([
    db.product.findUnique({ where: { id } }),
    db.category.findMany({ orderBy: { name: "asc" } }),
    db.drop.findMany({ orderBy: { releaseDate: "desc" } }),
  ])

  if (!productRaw) notFound()
  const product = normalizeProductArrays(productRaw)

  const updateWithId = updateProduct.bind(null, id)
  const deleteWithId = deleteProduct.bind(null, id)

  return (
    <div>
      <div className="flex items-center justify-between mb-8">
        <h1 className="text-2xl font-heading font-bold uppercase tracking-tight text-[var(--text)]">
          Modifier « {product.name} »
        </h1>
        <form action={deleteWithId}>
          <Button type="submit" variant="destructive" size="sm">
            Supprimer
          </Button>
        </form>
      </div>
      <ProductForm
        action={updateWithId}
        categories={categories}
        drops={drops}
        submitLabel="Enregistrer"
        defaultValues={{
          name: product.name,
          description: product.description,
          price: product.price,
          stock: product.stock,
          categoryId: product.categoryId,
          dropId: product.dropId,
          editionSize: product.editionSize,
          active: product.active,
          images: product.images,
          sizes: product.sizes,
          styles: product.styles,
          materials: product.materials,
        }}
      />
    </div>
  )
}