import React from 'react'
import ReactDOM from 'react-dom/client'
import {RouterProvider, createRouter} from '@tanstack/react-router'
import {routeTree} from './routeTree.gen'
import {MantineProvider} from "@mantine/core";
import {QueryClient, QueryClientProvider} from "@tanstack/react-query";
import {Provider} from "react-redux";
import {store} from "./redux/store.ts";

import '@mantine/core/styles.css';
import '@mantine/notifications/styles.css';
import './main.scss';
import {Notifications} from "@mantine/notifications";
import {ModalsProvider} from "@mantine/modals";

// Configuring router
const router = createRouter({routeTree})
declare module '@tanstack/react-router' {
    interface Register {
        router: typeof router
    }
}

// Configuring query
const queryClient = new QueryClient();

ReactDOM.createRoot(document.getElementById('root')!).render(
    <React.StrictMode>
        <Provider store={store}>
            <QueryClientProvider client={queryClient}>
                <MantineProvider defaultColorScheme={"dark"}>
                    <ModalsProvider>
                        <RouterProvider router={router}/>
                        <Notifications/>
                    </ModalsProvider>
                </MantineProvider>
            </QueryClientProvider>
        </Provider>
    </React.StrictMode>,
)