import type { Metadata } from "next";
import { Inter, Cormorant_Garamond } from "next/font/google";
import Script from "next/script";
import "./globals.css";
import { SoundProvider } from "@/components/providers/sound-provider";
import Preloader from "@/components/preloader";

const inter = Inter({
  variable: "--font-inter",
  subsets: ["latin"],
  display: "optional",
});

const cormorant = Cormorant_Garamond({
  variable: "--font-cormorant",
  subsets: ["latin"],
  weight: ["300", "400", "500", "600", "700"],
  style: ["normal", "italic"],
  display: "optional",
});

const SITE_URL = "https://entscheidomat.com";
const SITE_NAME = "Entscheidomat";
const SITE_TITLE = "Entscheidomat – Lass den Zufall entscheiden";
const SITE_DESCRIPTION =
  "Münze werfen, Glücksrad drehen, würfeln, eine Zufallszahl erzeugen, den Magic 8-Ball fragen, eine Liste auslosen oder den Ja-Nein-Generator befragen – wunderschön animiert, komplett anpassbar und kostenlos.";

export const metadata: Metadata = {
  metadataBase: new URL(SITE_URL),
  title: {
    default: SITE_TITLE,
    template: "%s – Entscheidomat",
  },
  description: SITE_DESCRIPTION,
  keywords: [
    "Münzwurf",
    "Glücksrad",
    "Würfel",
    "Zufallsgenerator",
    "Entscheidung",
    "Kopf oder Zahl",
    "Ja Nein Generator",
  ],
  alternates: {
    canonical: "/",
  },
  verification: {
    google: "8AohGR6zT7xA_1au64S-bh1i0GDPx7d-cbMdS518NkE",
  },
  openGraph: {
    type: "website",
    locale: "de_DE",
    url: SITE_URL,
    siteName: SITE_NAME,
    title: SITE_TITLE,
    description: SITE_DESCRIPTION,
  },
  twitter: {
    card: "summary_large_image",
    title: SITE_TITLE,
    description: SITE_DESCRIPTION,
  },
};

const jsonLd = {
  "@context": "https://schema.org",
  "@graph": [
    {
      "@type": "WebSite",
      "@id": `${SITE_URL}/#website`,
      url: SITE_URL,
      name: SITE_NAME,
      description: SITE_DESCRIPTION,
      inLanguage: "de-DE",
    },
    {
      "@type": "Organization",
      "@id": `${SITE_URL}/#organization`,
      name: SITE_NAME,
      url: SITE_URL,
    },
  ],
};

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html
      lang="de"
      data-preloader="active"
      className={`${inter.variable} ${cormorant.variable} h-full antialiased`}
    >
      <body className="flex min-h-full flex-col">
        <Script
          id="adsense"
          async
          src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-278277014424875"
          crossOrigin="anonymous"
          strategy="beforeInteractive"
        />
        <script
          type="application/ld+json"
          dangerouslySetInnerHTML={{
            __html: JSON.stringify(jsonLd).replace(/</g, "\\u003c"),
          }}
        />
        <Script
          src="https://cloud.umami.is/script.js"
          data-website-id="15bab46b-b1a9-4d2f-9c69-deaef60a0cfc"
          strategy="afterInteractive"
        />
        <Preloader />
        <SoundProvider>{children}</SoundProvider>
      </body>
    </html>
  );
}
