import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { BrowserRouter } from "react-router-dom";
import { TooltipProvider } from "@/components/ui/tooltip";
import { Toaster } from "@/components/ui/toaster";
import App from "./App.tsx";
import "./index.css";
import { AuthProvider } from "@/hooks/useAuth";
import { AppModeProvider } from "@/context/AppModeContext";
import { UserSettingsProvider } from "@/hooks/useUserSettings";
import { ThemeProvider } from "next-themes";

const queryClient = new QueryClient();

createRoot(document.getElementById("root")!).render(
  <StrictMode>
    <QueryClientProvider client={queryClient}>
      <AuthProvider>
        <AppModeProvider>
          <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
            <UserSettingsProvider>
              <BrowserRouter>
                <TooltipProvider>
                  <App />
                  <Toaster />
                </TooltipProvider>
              </BrowserRouter>
            </UserSettingsProvider>
          </ThemeProvider>
        </AppModeProvider>
      </AuthProvider>
    </QueryClientProvider>
  </StrictMode>,
);