import { BrowserRouter, Routes, Route, Navigate } from "react-router-dom";

import Login from "@/pages/Login";

import DashboardLayout from "./layouts/DashboardLayout";

// import ProtectedRoute from "./components/ProtectedRoutes/ProtectedRoutes";

import ProtectedRoute from "./auth/ProtectedRoute";
import PublicRoute from "./auth/PublicRoute";
import { AuthProvider } from "./context/AuthContext";
import Department from "./pages/Department";
import Doctor from "./pages/Doctor";
import Blog from "./pages/Blog";
import BlogEditorPage from "./pages/BlogEditor";
import Appointment from "./pages/Appointment";
import EmailPage from "./pages/email";
import CareerPage from "./pages/Career";
import CandidatePage from "./pages/candidates";
import InquiryPage from "./pages/inquiry";
import AcademicsPage from "./pages/Academics";
import NewsPage from "./pages/newsMedia";

export default function App() {
	return (
		<BrowserRouter>
			<AuthProvider>
				<Routes>
					<Route element={<PublicRoute />}>
						<Route path="/" element={<Login />} />
					</Route>

					<Route element={<ProtectedRoute />}>
						<Route element={<DashboardLayout />}>
							<Route path="/department" element={<Department />} />
							<Route path="/doctor" element={<Doctor />} />
							<Route path="/blog" element={<Blog />} />
							<Route path="/blog/create" element={<BlogEditorPage />} />
							<Route path="/blog/edit/:id" element={<BlogEditorPage />} />
							<Route path="/appointment" element={<Appointment />} />
							<Route path="/email" element={<EmailPage />} />
							<Route path="/career" element={<CareerPage />} />
							<Route path="/candidate" element={<CandidatePage />} />
							<Route path="/inquiry" element={<InquiryPage />} />
							<Route path="/academics" element={<AcademicsPage />} />
							<Route path="/news" element={<NewsPage />} />
						</Route>
					</Route>

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