Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 | 1x 1x 1x 1x | import React from 'react';
import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom';
import { QueryClient, QueryClientProvider } from 'react-query';
import { Toaster } from 'react-hot-toast';
import { AuthProvider, useAuth } from './contexts/AuthContext';
import Layout from './components/Layout';
import Login from './pages/Login';
import Register from './pages/Register';
import Dashboard from './pages/Dashboard';
import Jobs from './pages/Jobs';
import JobDetails from './pages/JobDetails';
import CreateJob from './pages/CreateJob';
import Candidates from './pages/Candidates';
import CandidateDetails from './pages/CandidateDetails';
import Applications from './pages/Applications';
import Profile from './pages/Profile';
import Employers from './pages/Employers';
import EmployerDetails from './pages/EmployerDetails';
import Resumes from './pages/Resumes';
const queryClient = new QueryClient();
function ProtectedRoute({ children, allowedRoles = [] }) {
const { user, loading } = useAuth();
if (loading) {
return (
<div className="min-h-screen flex items-center justify-center">
<div className="animate-spin rounded-full h-32 w-32 border-b-2 border-primary-600"></div>
</div>
);
}
if (!user) {
return <Navigate to="/login" replace />;
}
if (allowedRoles.length > 0 && !allowedRoles.includes(user.role)) {
return <Navigate to="/dashboard" replace />;
}
return children;
}
function AppRoutes() {
const { user } = useAuth();
return (
<Routes>
<Route path="/login" element={!user ? <Login /> : <Navigate to="/dashboard" replace />} />
<Route path="/register" element={!user ? <Register /> : <Navigate to="/dashboard" replace />} />
<Route path="/" element={<Layout />}>
<Route index element={<Navigate to="/dashboard" replace />} />
<Route path="dashboard" element={
<ProtectedRoute>
<Dashboard />
</ProtectedRoute>
} />
<Route path="jobs" element={
<ProtectedRoute>
<Jobs />
</ProtectedRoute>
} />
<Route path="jobs/create" element={
<ProtectedRoute allowedRoles={['employer', 'recruiter']}>
<CreateJob />
</ProtectedRoute>
} />
<Route path="jobs/:id" element={
<ProtectedRoute>
<JobDetails />
</ProtectedRoute>
} />
<Route path="candidates" element={
<ProtectedRoute allowedRoles={['admin', 'recruiter', 'employer']}>
<Candidates />
</ProtectedRoute>
} />
<Route path="candidates/:id" element={
<ProtectedRoute allowedRoles={['admin', 'recruiter', 'employer']}>
<CandidateDetails />
</ProtectedRoute>
} />
<Route path="applications" element={
<ProtectedRoute>
<Applications />
</ProtectedRoute>
} />
<Route path="employers" element={
<ProtectedRoute allowedRoles={['admin', 'recruiter']}>
<Employers />
</ProtectedRoute>
} />
<Route path="employers/:id" element={
<ProtectedRoute allowedRoles={['admin', 'recruiter']}>
<EmployerDetails />
</ProtectedRoute>
} />
<Route path="resumes" element={
<ProtectedRoute allowedRoles={['candidate']}>
<Resumes />
</ProtectedRoute>
} />
<Route path="profile" element={
<ProtectedRoute>
<Profile />
</ProtectedRoute>
} />
</Route>
</Routes>
);
}
function App() {
return (
<QueryClientProvider client={queryClient}>
<AuthProvider>
<Router>
<div className="App">
<AppRoutes />
<Toaster position="top-right" />
</div>
</Router>
</AuthProvider>
</QueryClientProvider>
);
}
export default App;
|