63 lines
2.4 KiB
TypeScript
63 lines
2.4 KiB
TypeScript
|
import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
|
||
|
|
import LoginPage from '../pages/LoginPage';
|
||
|
|
import HomePage from '../pages/HomePage'; // Crearemos esta página simple
|
||
|
|
import { useAuth } from '../contexts/AuthContext';
|
||
|
|
import ChangePasswordPage from '../pages/ChangePasswordPage'; // Crearemos esta
|
||
|
|
import MainLayout from '../layouts/MainLayout'; // Crearemos este
|
||
|
|
|
||
|
|
// Componente para proteger rutas
|
||
|
|
const ProtectedRoute: React.FC<{ children: JSX.Element }> = ({ children }) => {
|
||
|
|
const { isAuthenticated, isLoading } = useAuth();
|
||
|
|
|
||
|
|
if (isLoading) {
|
||
|
|
// Muestra algo mientras verifica el token (ej: un spinner)
|
||
|
|
return <div>Cargando...</div>;
|
||
|
|
}
|
||
|
|
|
||
|
|
return isAuthenticated ? children : <Navigate to="/login" replace />;
|
||
|
|
};
|
||
|
|
|
||
|
|
// Componente para rutas públicas (redirige si ya está logueado)
|
||
|
|
const PublicRoute: React.FC<{ children: JSX.Element }> = ({ children }) => {
|
||
|
|
const { isAuthenticated, isLoading } = useAuth();
|
||
|
|
|
||
|
|
if (isLoading) {
|
||
|
|
return <div>Cargando...</div>;
|
||
|
|
}
|
||
|
|
|
||
|
|
return !isAuthenticated ? children : <Navigate to="/" replace />;
|
||
|
|
};
|
||
|
|
|
||
|
|
|
||
|
|
const AppRoutes = () => {
|
||
|
|
return (
|
||
|
|
<BrowserRouter>
|
||
|
|
<Routes>
|
||
|
|
{/* Rutas Públicas */}
|
||
|
|
<Route path="/login" element={<PublicRoute><LoginPage /></PublicRoute>} />
|
||
|
|
<Route path="/change-password" element={<ProtectedRoute><ChangePasswordPage /></ProtectedRoute>} /> {/* Asumimos que se accede logueado */}
|
||
|
|
|
||
|
|
{/* Rutas Protegidas dentro del Layout Principal */}
|
||
|
|
<Route
|
||
|
|
path="/*" // Captura todas las demás rutas
|
||
|
|
element={
|
||
|
|
<ProtectedRoute>
|
||
|
|
<MainLayout> {/* Layout que tendrá la navegación principal */}
|
||
|
|
{/* Aquí irán las rutas de los módulos */}
|
||
|
|
<Routes>
|
||
|
|
<Route index element={<HomePage />} /> {/* Página por defecto al loguearse */}
|
||
|
|
{/* <Route path="/usuarios" element={<GestionUsuariosPage />} /> */}
|
||
|
|
{/* <Route path="/zonas" element={<GestionZonasPage />} /> */}
|
||
|
|
{/* ... otras rutas de módulos ... */}
|
||
|
|
<Route path="*" element={<Navigate to="/" replace />} /> {/* Redirige rutas no encontradas al home */}
|
||
|
|
</Routes>
|
||
|
|
</MainLayout>
|
||
|
|
</ProtectedRoute>
|
||
|
|
}
|
||
|
|
/>
|
||
|
|
</Routes>
|
||
|
|
</BrowserRouter>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default AppRoutes;
|