import { ContactForm } from "@/components/ContactForm";
import DetailInfo from "@/components/detailPage/detailInfo";
import { getAllProducts } from "@/lib/api";
import { Product } from "@/lib/products";
import { generateSlug } from "@/lib/slug";
import { notFound } from "next/navigation";

export async function generateStaticParams() {
  const products = await getAllProducts();

  return products.map((product) => ({
    slug: generateSlug(product.name_uz),
  }));
}

async function getProduct(slug: string): Promise<Product | undefined> {
  const products = await getAllProducts();
  console.log("slug: ", slug);

  return products.find((product) => generateSlug(product.name_uz) === slug);
}

export default async function Page({ params }: { params: { slug: string } }) {
  const product = await getProduct(params.slug);

  if (!product) {
    notFound();
  }

  return (
    <div>
      <DetailInfo product={product} />
      <section id="contact">
        <ContactForm />
      </section>
    </div>
  );
}
