import type { Metadata } from "next";
import { notFound } from "next/navigation";
import { ProductBlocks } from "../components/ProductBlocks";
import { Footer } from "../components/Footer";
import { getProductBySlug, getCompanySettings } from "../lib/payload";
import { buildProductSchema } from "../lib/structuredData";

// "Die Pause." finally has real copy and a name (2026-08-29) — first PDP
// migrated off its own hand-coded Hero/Pricing onto the block-driven
// system (Products.layout/ProductBlocks.tsx), now that both exist. Was a
// provisional scaffold before (naming/design undecided, parked
// 2026-08-24); Hero.tsx/Pricing.tsx in ./components are dead code now,
// kept only until a next cleanup pass removes them.
export async function generateMetadata(): Promise<Metadata> {
  const product = await getProductBySlug("tasse-die-pause");
  const title = product ? `${product.name} – einfach produktiv.` : "Tasse – einfach produktiv.";
  const description = product?.descriptionText || undefined;
  return {
    title,
    description,
    alternates: { canonical: "/tasse-die-pause" },
    openGraph: { title, description, url: "/tasse-die-pause" },
    twitter: { title, description },
  };
}

export default async function TasseDiePausePage() {
  const [product, seller] = await Promise.all([
    getProductBySlug("tasse-die-pause"),
    getCompanySettings(),
  ]);
  if (!product) notFound();
  const productSchema = buildProductSchema(product, "https://einfach-produktiv.mk360.de/tasse-die-pause", seller);

  return (
    <>
      <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(productSchema) }} />
      <main className="flex flex-col flex-1">
        <ProductBlocks product={product} />
      </main>
      <Footer />
    </>
  );
}