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

// Provisional scaffold page — naming/design concept still undecided (parked
// 2026-08-24). Metadata reads from the live product instead of a hardcoded
// tagline, unlike every other bespoke page here — see Hero.tsx's comment.
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(),
  ]);
  const productSchema = product
    ? buildProductSchema(product, "https://einfach-produktiv.mk360.de/tasse-die-pause", seller)
    : null;

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