import { notFound } from "next/navigation"

import { serverClient } from "@/lib/trpc/server"

import { Blocks } from "@/components/Loyalty/Blocks"
import Sidebar from "@/components/Loyalty/Sidebar"
import MaxWidth from "@/components/MaxWidth"

import styles from "./page.module.css"

import type { LangParams, PageArgs, UriParams } from "@/types/params"

export default async function LoyaltyPage({
  params,
  searchParams,
}: PageArgs<LangParams, UriParams>) {
  try {
    if (!searchParams.uri) {
      throw new Error("Bad URI")
    }

    const loyaltyPage = await serverClient().contentstack.loyaltyPage.get({
      href: searchParams.uri,
      locale: params.lang,
    })

    return (
      <section className={styles.content}>
        <aside>
          {loyaltyPage.sidebar
            ? loyaltyPage.sidebar.map((block, i) => (
                <Sidebar key={i} block={block} />
              ))
            : null}
        </aside>
        <MaxWidth className={styles.blocks} tag="main">
          <Blocks blocks={loyaltyPage.blocks} />
        </MaxWidth>
      </section>
    )
  } catch (err) {
    return notFound()
  }
}
