import { notFound } from 'next/navigation'
import type { Metadata } from 'next'

import DynamicPageRenderer from '../../components/dynamic/DynamicPageRenderer'
import { getCategoriesResult, getCmsPageResult } from '../../lib/cms'

const lang = 'th'

const reservedSlugs = new Set([
  'about',
  'article',
  'category',
  'contact',
  'coupons',
  'faq',
  'order',
  'products',
  'profile',
  'search',
  'scent-guide',
  'shop',
  'track',
  'wishlist',
])

function normalizeSlug(slug: string) {
  return slug.trim().replace(/^\/+|\/+$/g, '').toLowerCase()
}

function isReservedSlug(slug: string) {
  return reservedSlugs.has(normalizeSlug(slug))
}

export async function generateMetadata({ params }: { params: Promise<{ slug: string }> }): Promise<Metadata> {
  const { slug } = await params
  if (isReservedSlug(slug)) return { title: 'Page Not Found | HomAroma' }

  const pageResult = await getCmsPageResult(slug, lang)
  if (!pageResult.ok || !pageResult.data.isPublished) return { title: 'Page Not Found | HomAroma' }

  return {
    title: `${pageResult.data.title} | HomAroma`,
  }
}

export default async function CmsCustomPage({ params }: { params: Promise<{ slug: string }> }) {
  const { slug } = await params
  if (isReservedSlug(slug)) notFound()

  const [pageResult, categoriesResult] = await Promise.all([
    getCmsPageResult(slug, lang),
    getCategoriesResult(lang),
  ])

  if (!pageResult.ok) {
    if (pageResult.status === 404) notFound()

    return (
      <main className="min-h-[70vh] bg-pop-bg px-6 py-24">
        <div className="mx-auto max-w-3xl rounded-3xl border border-rose-100 bg-white px-6 py-16 text-center shadow-brutal">
          <p className="text-xs font-bold uppercase tracking-[0.28em] text-rose-500">CMS Page Error</p>
          <h1 className="mt-4 text-3xl font-semibold text-pop-black md:text-4xl">
            ไม่สามารถโหลดหน้านี้ได้
          </h1>
          <p className="mt-4 text-sm text-rose-500">{pageResult.error}</p>
        </div>
      </main>
    )
  }

  const page = pageResult.data
  if (!page.isPublished) notFound()

  const categories = categoriesResult.ok ? categoriesResult.data : []
  const sections = page.sections?.filter((section) => section.isActive) ?? []

  if (!categoriesResult.ok) {
    console.error(`[website-cms] categories unavailable for CMS page "${slug}": ${categoriesResult.error}`)
  }

  return (
    <main className="min-h-[70vh] bg-pop-bg">
      {sections.length > 0 ? (
        <DynamicPageRenderer sections={sections} categories={categories} lang={lang} />
      ) : (
        <div className="mx-auto max-w-4xl px-6 py-24 text-center">
          <p className="text-xs font-bold uppercase tracking-[0.28em] text-pop-pink">HomAroma</p>
          <h1 className="mt-4 text-4xl font-semibold text-pop-black md:text-5xl">{page.title}</h1>
          <p className="mt-5 text-gray-600">
            หน้านี้ถูกเผยแพร่แล้ว แต่ยังไม่มี section ที่เปิดใช้งานใน Page Builder
          </p>
        </div>
      )}
    </main>
  )
}