import { Routes, Route, Navigate } from 'react-router-dom';
import ProtectedRoute from './components/ProtectedRoute';
import RoleRoute from './components/RoleRoute';
import DashboardLayout from './components/DashboardLayout';
import Login from './pages/Login';
import Register from './pages/Register';
import DashboardHome from './pages/DashboardHome';
import Patients from './pages/Patients';
import Appointments from './pages/Appointments';
import MedicalReports from './pages/MedicalReports';
import Report from './pages/Report';
import Profile from './pages/Profile';

function App() {
  return (
    <Routes>
      <Route path="/login" element={<Login />} />
      <Route path="/register" element={<Register />} />

      <Route
        path="/dashboard"
        element={
          <ProtectedRoute>
            <DashboardLayout />
          </ProtectedRoute>
        }
      >
        <Route index element={<DashboardHome />} />
        <Route
          path="patients"
          element={
            <RoleRoute allowedRoles={['receptionist']}>
              <Patients />
            </RoleRoute>
          }
        />
        <Route path="appointments" element={<Appointments />} />
        <Route
          path="medical-reports"
          element={
            <RoleRoute allowedRoles={['doctor']}>
              <MedicalReports />
            </RoleRoute>
          }
        />
        <Route path="report" element={<Report />} />
        <Route path="profile" element={<Profile />} />
      </Route>

      <Route path="/" element={<Navigate to="/dashboard" replace />} />
      <Route path="*" element={<Navigate to="/dashboard" replace />} />
    </Routes>
  );
}

export default App;
