import type { Metadata } from "next";
import { draftMode } from "next/headers";
import { WeeklyImpulsesHero } from "./components/WeeklyImpulsesHero";
import { HowItWorks } from "./components/HowItWorks";
import { WeeklyBenefits } from "./components/WeeklyBenefits";
import { Newsletter } from "../components/Newsletter";
import { Footer } from "../components/Footer";
import { TestimonialsGrid } from "../components/TestimonialsGrid";
import { LiveTestimonialsGrid } from "../components/LiveTestimonialsGrid";
import { getTestimonials } from "../lib/payload";

const title = "Impulse & Tipps – Wöchentliche Klarheit für deinen Alltag";
const description =
  "Einmal pro Woche bekommst du konkrete Impulse, die dich wirklich weiterbringen – kurz, praktisch und direkt umsetzbar. Kostenlos, jeden Mittwoch, jederzeit abbestellbar.";

export const metadata: Metadata = {
  title,
  description,
  alternates: {
    canonical: "/newsletter",
  },
  openGraph: {
    title,
    description,
    url: "/newsletter",
    images: ["/hero-weekly-impulses.png"],
  },
  twitter: {
    title,
    description,
    images: ["/hero-weekly-impulses.png"],
  },
};

// Route is "/newsletter" — not "/impulse-tipps" or similar — because that
// path already existed as a dangling link from two places (Navbar's
// "Newsletter" CTA button and Tools.tsx's "Impulse & Tipps" → "Anmelden"
// card). Both point at the same underlying thing (signing up for the
// weekly newsletter), so this page resolves both at once instead of
// picking a new URL and leaving one of them still dangling.
export default async function NewsletterPage() {
  const testimonials = await getTestimonials("newsletter");
  const { isEnabled: isPreview } = await draftMode();

  return (
    <>
      <main className="flex flex-col flex-1">
        <WeeklyImpulsesHero />
        <HowItWorks />
        <WeeklyBenefits />
        {isPreview ? (
          <LiveTestimonialsGrid testimonials={testimonials} />
        ) : (
          <TestimonialsGrid testimonials={testimonials} />
        )}
        <Newsletter
          title="Wöchentliche Impulse für mehr Klarheit"
          description="Melde dich jetzt an und erhalte jeden Mittwoch neue Impulse & Tipps direkt in dein Postfach."
        />
      </main>
      <Footer />
    </>
  );
}