import React from 'react';
import ReactDOM from 'react-dom/client';
import { BrowserRouter, Routes, Route } from 'react-router-dom';
import './index.css';

import { AdminPage } from './pages/AdminPage';
import { StaffLogin, StaffRegister } from './pages/AuthPages';
import { MainLayout } from './layouts/MainLayout';
import { PatientSearch } from './pages/PatientSearch';
import { PatientProfile } from './pages/PatientProfile';
import { DocumentEditor } from './pages/DocumentEditor';
import { BillEditor } from './pages/BillEditor';
import { Statistics } from './pages/Statistics';

ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
  <React.StrictMode>
    <BrowserRouter>
      <Routes>
        <Route path="/admin" element={<AdminPage />} />
        <Route path="/login" element={<StaffLogin />} />
        <Route path="/register" element={<StaffRegister />} />

        <Route element={<MainLayout />}>
          <Route path="/" element={<PatientSearch />} />
          <Route path="/patients/:id" element={<PatientProfile />} />
          <Route path="/patients/:id/documents/new" element={<DocumentEditor />} />
          <Route path="/patients/:id/bills/new" element={<BillEditor />} />
          <Route path="/statistics" element={<Statistics />} />
          <Route path="/billing" element={<Statistics />} /> {/* Redirecting billing to stats for now */}
        </Route>
      </Routes>
    </BrowserRouter>
  </React.StrictMode>
);