canina/frontend/admin-panel/src/components/ProtectedRoute.tsx

44 lines
1.1 KiB
TypeScript

import { useState, useEffect } from 'react';
import { Navigate, Outlet } from 'react-router-dom';
import api from '../services/api';
export default function ProtectedRoute() {
const token = localStorage.getItem('adminToken');
const [isValidating, setIsValidating] = useState(true);
const [isValid, setIsValid] = useState(true);
useEffect(() => {
if (!token) {
setIsValid(false);
setIsValidating(false);
return;
}
api.get('/users/profile')
.then(() => {
setIsValid(true);
})
.catch(() => {
localStorage.removeItem('adminToken');
setIsValid(false);
})
.finally(() => {
setIsValidating(false);
});
}, [token]);
if (!token || !isValid) {
return <Navigate to="/login" replace />;
}
if (isValidating) {
return (
<div className="min-h-screen flex items-center justify-center bg-gray-50">
<div className="w-8 h-8 border-4 border-purple-600 border-t-transparent rounded-full animate-spin"></div>
</div>
);
}
return <Outlet />;
}