import type { Metadata } from 'next'
import { notFound } from 'next/navigation'
import SeoCategoryPage from '@/components/SeoCategoryPage'
import { getHreflangAlternates } from '@/lib/localeRoutes'
import { getSeoPageBySlug } from '@/lib/seoPages'
import { siteConfig } from '@/lib/site'

/**
 * Template für SEO-Subpages. Neue Seite in 3 Schritten:
 *
 * 1. Profil in `lib/seoPages.ts` anlegen (SeoPageProfile) und den Slug
 *    bei deutschen Seiten in `germanSeoPageSlugs` eintragen — damit landen
 *    Sitemap-Eintrag und /de/<slug>-Redirect automatisch.
 *    Englische Seiten zusätzlich in `app/sitemap.ts` ergänzen.
 * 2. `app/<slug>/page.tsx` anlegen:
 *
 *      import { buildSeoPageMetadata, createSeoPage } from '@/lib/seoPageFactory'
 *
 *      export const metadata = buildSeoPageMetadata('<slug>')
 *      export default createSeoPage('<slug>')
 *
 * 3. Interne Links setzen: `relatedLinks` thematisch passender Profile
 *    auf die neue Seite zeigen lassen.
 */
export function buildSeoPageMetadata(slug: string): Metadata {
  const profile = getSeoPageBySlug(slug)

  if (!profile) {
    return {}
  }

  const languages = getHreflangAlternates(profile.canonical)

  return {
    title: profile.metaTitle,
    description: profile.metaDescription,
    alternates: { canonical: profile.canonical, ...(languages && { languages }) },
    openGraph: {
      title: profile.metaTitle,
      description: profile.metaDescription,
      url: `${siteConfig.domain}${profile.canonical}`,
      type: 'website',
      images: [{ url: '/og-image.png', width: 1200, height: 630, alt: profile.metaTitle }],
    },
    twitter: {
      card: 'summary_large_image',
      title: profile.metaTitle,
      description: profile.metaDescription,
      images: ['/og-image.png'],
    },
  }
}

export function createSeoPage(slug: string) {
  const profile = getSeoPageBySlug(slug)

  return function SeoPage() {
    if (!profile) notFound()
    return <SeoCategoryPage profile={profile} />
  }
}
