import { overview } from "@/constants/routes/webviews"
import { serverClient } from "@/lib/trpc/server"

import MaxWidth from "@/components/MaxWidth"
import Surprises from "@/components/MyPages/Surprises"
import TrackingSDK from "@/components/TrackingSDK"
import Blocks from "@/components/Webviews/AccountPage/Blocks"
import LinkToOverview from "@/components/Webviews/LinkToOverview"
import { getLang } from "@/i18n/serverContext"

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

export default async function AccountPage() {
  const caller = await serverClient()
  const accountPageRes = await caller.contentstack.accountPage.get()

  if (!accountPageRes) {
    return null
  }

  const { tracking, accountPage } = accountPageRes

  const lang = await getLang()
  const linkToOverview = `/${lang}/webview${accountPage.url}` !== overview[lang]

  return (
    <>
      <MaxWidth className={styles.blocks} tag="main">
        {linkToOverview ? <LinkToOverview /> : null}
        <Blocks content={accountPage.content} />
      </MaxWidth>

      <Surprises />
      <TrackingSDK pageData={tracking} />
    </>
  )
}
