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

const title = "Der Eine. – Der Kugelschreiber zu unseren ToDo-Karten.";
const description =
  "Der Eine. ist ein Kugelschreiber aus Metall, mit schwarzer Mine und „Der Eine.“ auf der Seite — der Stift zu unseren ToDo-Karten.";

export const metadata: Metadata = {
  title,
  description,
  alternates: {
    canonical: "/der-eine",
  },
  openGraph: {
    title,
    description,
    url: "/der-eine",
  },
  twitter: {
    title,
    description,
  },
};

export default async function DerEinePage() {
  const [product, seller] = await Promise.all([
    getProductBySlug("stift-kugelschreiber"),
    getCompanySettings(),
  ]);
  const productSchema = product
    ? buildProductSchema(product, "https://einfach-produktiv.mk360.de/der-eine", seller)
    : null;

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