import type { Metadata } from "next";
import { notFound } from "next/navigation";
import Container from "@/components/ui/Container";
import ProductDetail from "@/components/shop/ProductDetail";
import StoreSubNav from "@/components/shop/StoreSubNav";
import { getStoreProductBySlug } from "@/lib/api";

export const revalidate = 300;

export async function generateMetadata({ params }: { params: { slug: string } }): Promise<Metadata> {
  const product = await getStoreProductBySlug(params.slug);
  if (!product) return {};
  return {
    title: `${product.name} | allBETs`,
    description: product.description || undefined
  };
}

export default async function ProductDetailPage({ params }: { params: { slug: string } }) {
  const product = await getStoreProductBySlug(params.slug);
  if (!product) notFound();

  return (
    <>
      <StoreSubNav active="all-goods" />
      <section>
        <Container>
          <ProductDetail product={product} />
        </Container>
      </section>
    </>
  );
}