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

import { Blocks } from "@/components/Loyalty/Blocks/WebView"
import Sidebar from "@/components/Loyalty/Sidebar"
import MaxWidth from "@/components/MaxWidth"
import Title from "@/components/TempDesignSystem/Text/Title"
import LinkToOverview from "@/components/Webviews/LinkToOverview"

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

import { LangParams } from "@/types/params"

export default async function AboutScandicFriends({ lang }: LangParams) {
  const loyaltyPage = await serverClient().contentstack.loyaltyPage.get()
  if (!loyaltyPage) {
    return null
  }
  return (
    <section className={styles.content}>
      <LinkToOverview lang={lang} />

      {loyaltyPage.sidebar ? (
        <section className={styles.sidebar}>
          <Sidebar blocks={loyaltyPage.sidebar} lang={lang} />
        </section>
      ) : null}

      <MaxWidth tag="main">
        <Title>{loyaltyPage.heading}</Title>
        <Blocks blocks={loyaltyPage.blocks} lang={lang} />
      </MaxWidth>
    </section>
  )
}
