27 lines
847 B
React
27 lines
847 B
React
import React from 'react';
|
|
import { Navigate, Outlet } from 'react-router-dom';
|
|
import useAuthStore from '../../store/authStore';
|
|
|
|
const ProtectedRoute = () => {
|
|
// Grab the state directly from your Zustand store
|
|
const { isAuthenticated, isLoading } = useAuthStore();
|
|
|
|
// 1. App is currently pinging Django to verify the HttpOnly cookie
|
|
if (isLoading) {
|
|
return (
|
|
<div style={{ display: 'flex', justifyContent: 'center', marginTop: '20vh' }}>
|
|
<h2>Loading Secure Environment...</h2>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
// 2. The check failed (no cookie or expired cookie)
|
|
if (!isAuthenticated) {
|
|
return <Navigate to="/login" replace />;
|
|
}
|
|
|
|
// 3. The check passed! Render the layout shell and the protected children
|
|
return <Outlet />;
|
|
};
|
|
|
|
export default ProtectedRoute; |