import "@fontsource/roboto/300.css";
import "@fontsource/roboto/400.css";
import "@fontsource/roboto/500.css";
import "@fontsource/roboto/700.css";
import { LocalizationProvider } from "@mui/x-date-pickers";
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import { ServerApi } from "./api/ServerApi.ts";
import { App } from "./App.tsx";
import { AlertDialogProvider } from "./hooks/context_providers/AlertDialogProvider.tsx";
import { ConfirmDialogProvider } from "./hooks/context_providers/ConfirmDialogProvider.tsx";
import { DarkThemeProvider } from "./hooks/context_providers/DarkThemeProvider.tsx";
import { LoadingMessageProvider } from "./hooks/context_providers/LoadingMessageProvider.tsx";
import { SnackbarProvider } from "./hooks/context_providers/SnackbarProvider.tsx";
import "./index.css";
import { AsyncWidget } from "./widgets/AsyncWidget.tsx";
import { PublicModeProvider } from "./hooks/context_providers/PublicModeProvider.tsx";

createRoot(document.getElementById("root")!).render(
  <StrictMode>
    <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale="en">
      <DarkThemeProvider>
        <AlertDialogProvider>
          <ConfirmDialogProvider>
            <SnackbarProvider>
              <LoadingMessageProvider>
                <PublicModeProvider>
                  <AsyncWidget
                    loadKey={1}
                    load={async () => {
                      await ServerApi.LoadConfig();
                    }}
                    errMsg="Failed to load static server configuration!"
                    build={() => <App />}
                  />
                </PublicModeProvider>
              </LoadingMessageProvider>
            </SnackbarProvider>
          </ConfirmDialogProvider>
        </AlertDialogProvider>
      </DarkThemeProvider>
    </LocalizationProvider>
  </StrictMode>
);
