import type React from "react"
import type { Metadata } from "next"
import { GeistSans } from "geist/font/sans"
import { GeistMono } from "geist/font/mono"
import { Analytics } from "@vercel/analytics/next"
import { Toaster } from "sonner"
import { NotificationProvider } from "@/contexts/notification-context"
import { ThemeProvider } from "@/contexts/ThemeContext"
import { ConfigProvider } from "@/contexts/ConfigContext"
import { I18nProvider } from "@/lib/i18n"
import "./globals.css"
import { Suspense } from "react"
import { LoadingScreen } from "@/components/ui/loading-spinner"
import { AuthProvider } from "@/contexts/AuthContext"

export const metadata: Metadata = {
  title: "GoHorseJobs - Find your next opportunity",
  description: "Connecting candidates and companies quickly and directly",
  generator: "v0.app",
  icons: {
    icon: "/logohorse.png",
    shortcut: "/logohorse.png",
    apple: "/logohorse.png",
  },
}

export default function RootLayout({
  children,
}: Readonly<{
  children: React.ReactNode
}>) {
  const shouldLoadAnalytics =
    process.env.VERCEL === "1" || Boolean(process.env.NEXT_PUBLIC_VERCEL_ANALYTICS_ID)

  return (
    <html lang="en">
      <body className={`font-sans ${GeistSans.variable} ${GeistMono.variable} antialiased`}>
        <ConfigProvider>
          <I18nProvider>
            <ThemeProvider>
              <AuthProvider>
                <NotificationProvider>
                  <Suspense fallback={<LoadingScreen text="GoHorse Jobs" />}>{children}</Suspense>
                  <Toaster
                    position="top-right"
                    richColors
                    closeButton
                    expand={false}
                    duration={4000}
                  />
                </NotificationProvider>
              </AuthProvider>
            </ThemeProvider>
          </I18nProvider>
        </ConfigProvider>
        {process.env.NODE_ENV === "production" && shouldLoadAnalytics && <Analytics />}
      </body>
    </html>
  )
}
