import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
import { ThemeProvider } from "react-jss";
import { BrowserRouter } from "react-router-dom";

import IntlProvider from "@/i18n/IntlProvider";
import theme from "@/theme";

import AppRouter from "./root/AppRouter";
import ScrollToTop from "./root/components/ScrollToTop";
import SessionContextProvider from "./SessionContext";

const queryClient = new QueryClient();

export default function App() {
  return (
    <BrowserRouter>
      <SessionContextProvider>
        <QueryClientProvider client={queryClient}>
          <ThemeProvider theme={theme}>
            <IntlProvider>
              <AppRouter />
              <ScrollToTop />
            </IntlProvider>
          </ThemeProvider>
          <ReactQueryDevtools initialIsOpen={false} />
        </QueryClientProvider>
      </SessionContextProvider>
    </BrowserRouter>
  );
}
