LathanDevers
74 lines
3.2 KiB
TypeScript
74 lines
3.2 KiB
TypeScript
import React from 'react';
|
|
import { Loader, Lock, KeyRound } from "lucide-react";
|
|
import { useNavigate } from "react-router-dom"; // Assurez-vous d'utiliser react-router
|
|
import { Card } from '@/components/ui/Card';
|
|
import { Button } from '@/components/ui/Button';
|
|
import StatusBadge from '../ui/StatusBadge';
|
|
import type { User } from '@/types/User';
|
|
|
|
interface AccessWidgetProps {
|
|
user: User | null;
|
|
isLoading: boolean;
|
|
error: string | null;
|
|
}
|
|
|
|
export const AccessWidget: React.FC<AccessWidgetProps> = ({
|
|
user,
|
|
isLoading,
|
|
error,
|
|
}) => {
|
|
// Hook de navigation
|
|
const navigate = useNavigate();
|
|
|
|
return (
|
|
<Card className="flex flex-col h-full">
|
|
<div className="p-6 border-b border-slate-300/30 dark:border-slate-700/30">
|
|
<h2 className="text-lg font-black text-slate-900 dark:text-slate-100 flex items-center gap-3">
|
|
<div className="p-2 rounded-xl bg-[#e8e8e8] dark:bg-[#1e293b] shadow-[3px_3px_6px_#c5c5c5,-3px_-3px_6px_#ffffff] dark:shadow-[3px_3px_6px_#121926,-3px_-3px_6px_#2a3850]">
|
|
<Lock className="w-5 h-5 text-blue-600 dark:text-blue-500" />
|
|
</div>
|
|
Sécurité de l'accès
|
|
</h2>
|
|
</div>
|
|
|
|
{isLoading && !error && (
|
|
<div className="p-8 flex justify-center items-center flex-1">
|
|
<Loader className="w-6 h-6 animate-spin text-blue-600" />
|
|
</div>
|
|
)}
|
|
|
|
{!isLoading && !error && (
|
|
<div className="p-6 space-y-8 flex-1">
|
|
|
|
{/* MFA */}
|
|
<div className="flex items-center justify-between">
|
|
<div>
|
|
<p className="text-sm font-bold text-slate-900 dark:text-slate-200">Authentification (MFA)</p>
|
|
<p className="text-xs font-medium text-slate-500 dark:text-slate-400 mt-1">Exigée par GISE</p>
|
|
</div>
|
|
<StatusBadge status={user?.mfa_enabled ? "Actif" : "Hors Ligne"} />
|
|
</div>
|
|
|
|
{/* MOT DE PASSE (Lien vers la sous-page) */}
|
|
<div className="pt-8 border-t border-slate-300/30 dark:border-slate-700/30">
|
|
<p className="text-sm font-bold text-slate-900 dark:text-slate-200 mb-1">Mot de passe institutionnel</p>
|
|
<p className="text-xs font-medium text-slate-500 dark:text-slate-400 mb-5">Dernière modification : Il y a 43 jours</p>
|
|
|
|
<Button
|
|
variant="primary"
|
|
size="sm"
|
|
// Navigation vers votre route dédiée
|
|
onClick={() => navigate('/settings/security/password')}
|
|
leftIcon={<KeyRound className="w-4 h-4" />}
|
|
className="w-full sm:w-auto"
|
|
>
|
|
Modifier le mot de passe
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
)}
|
|
</Card>
|
|
);
|
|
}
|
|
|
|
export default AccessWidget; |