import "@/css/main.scss";
import { Header } from "@/components/layout/Header";
import { Footer } from "@/components/layout/Footer";
import { Metadata } from "next";
import { NuqsAdapter } from "nuqs/adapters/next/app";

const baseUrlMetadata = process.env.URL
  ? { metadataBase: new URL(process.env.URL) }
  : {};

export const metadata: Metadata = {
  title: {
    template: "%s | Chateau Neuf – Det Norske Studentersamfund",
    default: "Chateau Neuf – Det Norske Studentersamfund",
  },
  alternates: {
    canonical: "./",
  },
  description:
    "Chateau Neuf er studenthuset i Oslo og tilholdsstedet for foreningene i Studentersamfundet.",
  openGraph: {
    siteName: "Chateau Neuf – Det Norske Studentersamfund",
    locale: "nb-NO",
    type: "website",
  },
  ...baseUrlMetadata,
};

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html lang="no">
      <head>
        <link rel="preconnect" href="https://use.typekit.net" crossOrigin="anonymous" />
        <link rel="preconnect" href="https://p.typekit.net" crossOrigin="anonymous" />
        {/*
          Load Adobe Fonts without blocking render: the stylesheet is requested
          with media="print" (fetched but not applied), then the inline script
          below swaps it to media="all" once it has loaded.
        */}
        <link
          id="typekit-css"
          rel="stylesheet"
          href="https://use.typekit.net/spa5smt.css"
          media="print"
          suppressHydrationWarning
        />
        <script>
          {`(function(){var l=document.getElementById('typekit-css');if(!l)return;function s(){l.media='all'}if(l.sheet){s()}else{l.addEventListener('load',s)}})();`}
        </script>
        {process.env.UMAMI_SCRIPT_URL && process.env.UMAMI_WEBSITE_ID && (
          <script
            defer
            src={process.env.UMAMI_SCRIPT_URL}
            data-website-id={process.env.UMAMI_WEBSITE_ID}
          ></script>
        )}
      </head>
      <body>
        <NuqsAdapter>
          <Header />
          {children}
          <Footer />
        </NuqsAdapter>
      </body>
    </html>
  );
}
