import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import { StyledEngineProvider, CssBaseline } from '@mui/material';
import AppRoutes from './routes/routes';
import { AuthProvider } from '@/hooks/auth';
import { AlertProvider } from '@/hooks/alert';
import { ResourceFlowProvider } from '@/hooks/resource-flow';
import RoleThemeProvider from '@/theme/role-theme-provider';
import './index.css';

createRoot(document.getElementById('root')!).render(
  <StrictMode>
    <AuthProvider>
      <StyledEngineProvider injectFirst>
        <RoleThemeProvider>
          <CssBaseline />
          <AlertProvider>
            <ResourceFlowProvider>
              <AppRoutes />
            </ResourceFlowProvider>
          </AlertProvider>
        </RoleThemeProvider>
      </StyledEngineProvider>
    </AuthProvider>
  </StrictMode>,
);