import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client'
import { ThemeProvider } from '@mui/material/styles'
import CssBaseline from '@mui/material/CssBaseline'
import { HashRouter, Route, Routes, Navigate } from "react-router"
import { UserProvider } from './context/UserProvider.tsx'
import { theme } from './theme'
import Entries from './Views/Entries/Entries.tsx'
import LoginView from './Views/Login/Login.tsx'
import Settings from './Views/Settings/Settings.tsx'
import PaymentMethods from './Views/PaymentMethods/PaymentMethods.tsx'
import './index.css'

createRoot(document.getElementById("root")!).render(
  <StrictMode>
    <ThemeProvider theme={theme}>
      <CssBaseline />
      <UserProvider>
        <HashRouter>
          <Routes>
            <Route path="/" element={<Navigate to="/entries" replace />} />
            <Route path="/entries" element={<Entries />} />
            <Route path="/login" element={<LoginView />} />
            <Route path="/settings" element={<Settings />} />
            <Route path="/payment-methods" element={<PaymentMethods />} />
          </Routes>
        </HashRouter>
      </UserProvider>
    </ThemeProvider>
  </StrictMode>
);