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 | 1x 1x 1x 9x 9x 9x 9x 9x 4x 3x 9x 9x 1x 8x 3x 5x 2x 3x | import React, { useEffect } from 'react';
import { Navigate, useLocation } from 'react-router-dom';
import { useAuth } from '../contexts/AuthContext';
import { useOrganizationStore } from '../store/organizationStore';
import { useOrganizationInitialization } from '../hooks/useOrganizationInitialization';
import { Loader2 } from 'lucide-react';
export const ProtectedRoute = ({ children }) => {
const { isAuthenticated, loading, authChecked } = useAuth();
const location = useLocation();
if (loading || !authChecked) {
return (
<div className="min-h-screen flex items-center justify-center bg-gray-50">
<div className="text-center">
<Loader2 className="w-12 h-12 animate-spin text-indigo-600 mx-auto mb-4" />
<p className="text-gray-600">Vérification de l'authentification...</p>
</div>
</div>
);
}
if (!isAuthenticated) {
return <Navigate to="/login" replace state={{ from: location.pathname }} />;
}
return children;
};
export const AdminRoute = ({ children }) => {
const { isAuthenticated, loading, authChecked, user } = useAuth();
const location = useLocation();
if (loading || !authChecked) {
return (
<div className="min-h-screen flex items-center justify-center bg-gray-50">
<div className="text-center">
<Loader2 className="w-12 h-12 animate-spin text-indigo-600 mx-auto mb-4" />
<p className="text-gray-600">Vérification de l'authentification...</p>
</div>
</div>
);
}
if (!isAuthenticated) {
return <Navigate to="/login" replace state={{ from: location.pathname }} />;
}
if (user?.role !== 'admin') {
return <Navigate to="/" replace />;
}
return children;
};
export const OwnerRoute = ({ children }) => {
const { isAuthenticated, loading, authChecked } = useAuth();
const { currentOrganization, fetchOrganizations } = useOrganizationStore();
const location = useLocation();
useOrganizationInitialization();
// Rafraîchit les rôles à chaque entrée dans le backoffice : un owner
// rétrogradé par un autre owner est redirigé immédiatement.
useEffect(() => {
if (isAuthenticated && authChecked) {
fetchOrganizations();
}
}, [isAuthenticated, authChecked, fetchOrganizations]);
Iif (loading || !authChecked) {
return (
<div className="min-h-screen flex items-center justify-center bg-gray-50">
<div className="text-center">
<Loader2 className="w-12 h-12 animate-spin text-indigo-600 mx-auto mb-4" />
<p className="text-gray-600">Vérification de l'accès...</p>
</div>
</div>
);
}
if (!isAuthenticated) {
return <Navigate to="/login" replace state={{ from: location.pathname }} />;
}
if (!currentOrganization) {
return (
<div className="min-h-screen flex items-center justify-center bg-gray-50">
<div className="text-center">
<Loader2 className="w-12 h-12 animate-spin text-indigo-600 mx-auto mb-4" />
<p className="text-gray-600">Chargement de l'organisation...</p>
</div>
</div>
);
}
if (currentOrganization.role !== 'owner') {
return <Navigate to={`/${currentOrganization.id}`} replace />;
}
return children;
};
export default ProtectedRoute;
|