import './globals.css';

import type { Metadata } from "next";
import { Suspense } from "react";
import { ThemeProvider } from "@/components/provider/Theme/theme-provider";
import { Toaster } from "@/components/ui/sonner";
import { AgentationGuard } from "@/components/AgentationGuard";
import RouteChange from "./RouteChange";

export const metadata: Metadata = {
  title: '大厂保卫战',
  description: '保住KPI，战胜空降VP。一款讽刺大厂文化的塔防游戏。',
};

interface RootLayoutProps {
  children: React.ReactNode;
}

export default function RootLayout(props: RootLayoutProps) {
  return (
    <html lang="zh-CN" suppressHydrationWarning>
      <head>
        <link rel="preconnect" href="https://fonts.googleapis.com" />
        <link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin="anonymous" />
        <link
          href="https://fonts.googleapis.com/css2?family=Press+Start+2P&family=VT323:wght@400&display=swap"
          rel="stylesheet"
        />
      </head>
      <body className="antialiased">
        <ThemeProvider>
          {props.children}
          <Toaster position="top-center" />
        </ThemeProvider>
        <AgentationGuard />
        <Suspense>
          <RouteChange />
        </Suspense>
      </body>
    </html>
  );
}
