import "@/app/globals.css"
import "@scandic-hotels/design-system/style.css"

import Script from "next/script"

import TrpcProvider from "@/lib/trpc/Provider"

import AdobeScript from "@/components/Current/AdobeScript"
import Footer from "@/components/Current/Footer"
import VwoScript from "@/components/Current/VwoScript"
import { getIntl } from "@/i18n"
import ServerIntlProvider from "@/i18n/Provider"

import type { Metadata } from "next"

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

export const metadata: Metadata = {
  description: "New web",
  title: "Scandic Hotels New Web",
}

export default async function RootLayout({
  children,
  params,
  header,
}: React.PropsWithChildren<
  LayoutArgs<LangParams> & {
    header: React.ReactNode
  }
>) {
  const { defaultLocale, locale, messages } = await getIntl()
  return (
    <html lang={params.lang}>
      <head>
        <Script
          data-cookieconsent="ignore"
          src="/_static/dist/js/cookie-bot.js?1705409331007"
        />
        <Script
          strategy="beforeInteractive"
          data-blockingmode="auto"
          data-cbid="6d539de8-3e67-4f0f-a0df-8cef9070f712"
          data-culture="@cultureCode"
          id="Cookiebot"
          src="https://consent.cookiebot.com/uc.js"
        />
        <Script id="ensure-datalayer">{`
          window.datalayer = window.datalayer || {}
        `}</Script>
        <AdobeScript />
        <VwoScript />
      </head>
      <body>
        <ServerIntlProvider intl={{ defaultLocale, locale, messages }}>
          <TrpcProvider lang={params.lang}>
            {header}
            {children}
            <Footer lang={params.lang} />
          </TrpcProvider>
        </ServerIntlProvider>
        <Script id="page-tracking">{`
          typeof _satellite !== "undefined" && _satellite.pageBottom();
        `}</Script>
      </body>
    </html>
  )
}
