import { createRoot } from 'react-dom/client';
import { BrowserRouter } from 'react-router-dom';
import { ThemeProvider } from '@mui/material/styles';
import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
import { ruRU } from '@mui/x-date-pickers/locales';
import ruLocale from 'date-fns/locale/ru';
import { AuthProvider } from './app/context/AuthProvider';
import theme from './app/theme/theme';
import './index.css';
import App from './App';
import { ToastContainer } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';

const baseName = (process.env.REACT_APP_ROOT_PATH || '/').replace(/\/$/, '');

createRoot(document.getElementById('root')).render(
  <ThemeProvider theme={theme}>
    <LocalizationProvider
      dateAdapter={AdapterDateFns}
      adapterLocale={ruLocale}
      localeText={
        ruRU.components.MuiLocalizationProvider.defaultProps.localeText
      }
    >
      <AuthProvider>
        <BrowserRouter
          basename={baseName}
          future={{
            v7_startTransition: true,
            v7_relativeSplatPath: true,
          }}
        >
          <App />
          <ToastContainer autoClose={2000} style={{ zIndex: 10000 }} />
        </BrowserRouter>
      </AuthProvider>
    </LocalizationProvider>
  </ThemeProvider>,
);