'use client';

import { ShieldCheck, UserCheck, UsersRound } from 'lucide-react';

import type { TableauDeBordUtiG } from '@/lib/api';

import { StatCard } from './dashboard-ui';

/**
 * §5.6.1 : l'UTI-G ne gère que l'existence des UTI-F et n'accède en aucun cas
 * aux ON. Son tableau de bord ne présente donc ni conteneur, ni dossier, ni
 * objet numérique — pas même sous forme de décompte.
 */
export function DashboardUtiG({ donnees }: { donnees: TableauDeBordUtiG }) {
  const { administrateurs_fonctionnels: administrateurs } = donnees;

  return (
    <div className="grid gap-4 sm:grid-cols-3">
      <StatCard
        label="Administrateurs Fonctionnels"
        value={administrateurs.total}
        icon={UsersRound}
        hint="Comptes UTI-F de l’organisation"
      />
      <StatCard
        label="Comptes actifs"
        value={administrateurs.actifs}
        icon={UserCheck}
        hint="Habilités à administrer"
      />
      <StatCard
        label="Comptes désactivés"
        value={administrateurs.inactifs}
        icon={ShieldCheck}
        tone={administrateurs.inactifs > 0 ? 'alerte' : 'neutre'}
        hint="Accès suspendu"
      />
    </div>
  );
}