import { jsx as e, jsxs as s } from "react/jsx-runtime";
import { useState as c, useRef as le, useCallback as ne, useEffect as ce } from "react";
import { useNavigate as ie } from "react-router-dom";
import { useTranslation as de } from "react-i18next";
import { Monitor as y, Tablet as oe, Smartphone as me, Loader2 as he, AlertTriangle as S, RefreshCw as B, Users as P, UserCheck as M, UserX as ue, UserPlus as xe, Activity as E, Key as ve, Shield as ge, Globe as be, TrendingUp as Ne, Clock as fe } from "lucide-react";
import { h as pe, i as x, B as ye } from "./index-Dh9kUeDn.js";
import { a as I } from "./applicationAnalyticsApi-CFD-N7xu.js";
const L = {
  Desktop: /* @__PURE__ */ e(y, { className: "w-4 h-4" }),
  Mobile: /* @__PURE__ */ e(me, { className: "w-4 h-4" }),
  Tablet: /* @__PURE__ */ e(oe, { className: "w-4 h-4" }),
  Unknown: /* @__PURE__ */ e(y, { className: "w-4 h-4 opacity-50" })
}, H = [
  "#3b82f6",
  "#22c55e",
  "#f59e0b",
  "#6b7280"
], F = [
  "#3b82f6",
  "#8b5cf6",
  "#22c55e",
  "#f59e0b",
  "#ef4444"
], we = ({ data: r }) => !r || !r.byDeviceType?.length && !r.byBrowser?.length ? /* @__PURE__ */ e("div", { className: "text-center py-8 text-[var(--text-secondary)]", children: "No device data available" }) : /* @__PURE__ */ s("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
  /* @__PURE__ */ s("div", { children: [
    /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-[var(--text-secondary)] mb-3", children: "By Device Type" }),
    /* @__PURE__ */ e("div", { className: "space-y-3", children: r.byDeviceType.map((l, n) => /* @__PURE__ */ s("div", { className: "flex items-center gap-3", children: [
      /* @__PURE__ */ s("div", { className: "flex items-center gap-2 w-28", children: [
        L[l.deviceType] || L.Unknown,
        /* @__PURE__ */ e("span", { className: "text-sm", children: l.deviceType })
      ] }),
      /* @__PURE__ */ e("div", { className: "flex-1 h-6 bg-[var(--bg-secondary)] rounded-full overflow-hidden", children: /* @__PURE__ */ e(
        "div",
        {
          className: "h-full rounded-full transition-all duration-500",
          style: {
            width: `${l.percentage}%`,
            backgroundColor: H[n % H.length]
          }
        }
      ) }),
      /* @__PURE__ */ s("div", { className: "w-20 text-right", children: [
        /* @__PURE__ */ e("span", { className: "font-medium", children: l.count }),
        /* @__PURE__ */ s("span", { className: "text-xs text-[var(--text-secondary)] ml-1", children: [
          "(",
          l.percentage.toFixed(1),
          "%)"
        ] })
      ] })
    ] }, l.deviceType)) })
  ] }),
  /* @__PURE__ */ s("div", { children: [
    /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-[var(--text-secondary)] mb-3", children: "By Browser" }),
    /* @__PURE__ */ e("div", { className: "space-y-3", children: r.byBrowser.map((l, n) => {
      const a = Math.max(...r.byBrowser.map((v) => v.count), 1), d = l.count / a * 100;
      return /* @__PURE__ */ s("div", { className: "flex items-center gap-3", children: [
        /* @__PURE__ */ e("div", { className: "w-24 text-sm", children: l.browser }),
        /* @__PURE__ */ e("div", { className: "flex-1 h-6 bg-[var(--bg-secondary)] rounded-full overflow-hidden", children: /* @__PURE__ */ e(
          "div",
          {
            className: "h-full rounded-full transition-all duration-500",
            style: {
              width: `${d}%`,
              backgroundColor: F[n % F.length]
            }
          }
        ) }),
        /* @__PURE__ */ e("div", { className: "w-12 text-right font-medium", children: l.count })
      ] }, l.browser);
    }) })
  ] })
] }), V = ["#ef4444", "#f59e0b", "#22c55e", "#3b82f6"], Ce = ({ data: r }) => {
  if (!r)
    return /* @__PURE__ */ e("div", { className: "text-center py-8 text-[var(--text-secondary)]", children: "No engagement data available" });
  const l = Math.max(...r.sessionDistribution.map((a) => a.count), 1), n = Math.max(...r.peakUsageHours.map((a) => a.accessCount), 1);
  return /* @__PURE__ */ s("div", { className: "space-y-6", children: [
    /* @__PURE__ */ s("div", { children: [
      /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-[var(--text-secondary)] mb-3", children: "Session Duration Distribution" }),
      /* @__PURE__ */ e("div", { className: "space-y-3", children: r.sessionDistribution.map((a, d) => {
        const v = a.count / l * 100;
        return /* @__PURE__ */ s("div", { className: "flex items-center gap-3", children: [
          /* @__PURE__ */ e("div", { className: "w-20 text-sm", children: a.label }),
          /* @__PURE__ */ e("div", { className: "flex-1 h-6 bg-[var(--bg-secondary)] rounded-full overflow-hidden", children: /* @__PURE__ */ e(
            "div",
            {
              className: "h-full rounded-full transition-all duration-500",
              style: {
                width: `${v}%`,
                backgroundColor: V[d % V.length]
              }
            }
          ) }),
          /* @__PURE__ */ s("div", { className: "w-16 text-right", children: [
            /* @__PURE__ */ e("span", { className: "font-medium", children: a.count }),
            /* @__PURE__ */ e("span", { className: "text-xs text-[var(--text-secondary)] ml-1", children: "sessions" })
          ] })
        ] }, a.bucket);
      }) })
    ] }),
    /* @__PURE__ */ s("div", { children: [
      /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-[var(--text-secondary)] mb-3", children: "Peak Usage Hours" }),
      /* @__PURE__ */ e("div", { className: "flex items-end gap-1 h-32 overflow-x-auto pb-2", children: r.peakUsageHours.map((a) => {
        const d = a.accessCount / n * 100;
        return /* @__PURE__ */ s(
          "div",
          {
            className: "flex-1 min-w-[20px] flex flex-col items-center gap-1",
            children: [
              /* @__PURE__ */ e(
                "div",
                {
                  className: "w-full bg-gradient-to-t from-blue-500 to-cyan-500 rounded-t transition-all duration-300 hover:opacity-80",
                  style: {
                    height: `${d}%`,
                    minHeight: a.accessCount > 0 ? "4px" : "0"
                  },
                  title: `${a.hour}h: ${a.accessCount} accesses`
                }
              ),
              a.hour % 3 === 0 && /* @__PURE__ */ s("span", { className: "text-xs text-[var(--text-secondary)]", children: [
                a.hour,
                "h"
              ] })
            ]
          },
          a.hour
        );
      }) })
    ] }),
    /* @__PURE__ */ s("div", { className: "grid grid-cols-2 gap-4 pt-4 border-t border-[var(--border-color)]", children: [
      /* @__PURE__ */ s("div", { className: "text-center p-3 bg-[var(--bg-secondary)] rounded-lg", children: [
        /* @__PURE__ */ e("div", { className: "text-2xl font-bold text-blue-600", children: r.dailyActiveUsers }),
        /* @__PURE__ */ e("div", { className: "text-xs text-[var(--text-secondary)] mt-1", children: "Daily Active Users" })
      ] }),
      /* @__PURE__ */ s("div", { className: "text-center p-3 bg-[var(--bg-secondary)] rounded-lg", children: [
        /* @__PURE__ */ s("div", { className: "text-2xl font-bold text-green-600", children: [
          (r.retentionRate * 100).toFixed(1),
          "%"
        ] }),
        /* @__PURE__ */ e("div", { className: "text-xs text-[var(--text-secondary)] mt-1", children: "Retention Rate" })
      ] })
    ] })
  ] });
}, ke = {
  Active: "#22c55e",
  Inactive: "#ef4444"
};
function Be() {
  const { t: r } = de(["admin", "navigation"]), l = ie(), { currentTenant: n, isGlobalView: a } = pe(), [d, v] = c(!0), [R, U] = c(!1), [o, z] = c(30), [m, G] = c(null), [$, K] = c([]), [w, O] = c([]), [q, X] = c([]), [D, J] = c([]), [C, Q] = c([]), [u, W] = c(null), [Y, Z] = c(null), [_, ee] = c(null), [T, f] = c(null), p = le(null), k = ne(async (t) => {
    try {
      f(null);
      const [
        i,
        h,
        N,
        g,
        A,
        se,
        te,
        re,
        ae
      ] = await Promise.all([
        x.dashboard.getOverview(o, { signal: t }),
        x.dashboard.getByStatus({ signal: t }),
        x.dashboard.getByRole({ signal: t }),
        x.dashboard.getTrends(o, { signal: t }),
        x.dashboard.getLatestActiveSessions(5, { signal: t }),
        x.dashboard.getSecurityAlerts(3, 24, { signal: t }),
        x.dashboard.getActiveSessions({ signal: t }),
        I.getDeviceStats(o, { signal: t }),
        I.getEngagementMetrics(o, { signal: t })
      ]);
      t?.aborted || (G(i ?? null), K(h ?? []), O(N ?? []), X(g ?? []), J(A ?? []), Q(se ?? []), W(te ?? null), Z(re ?? null), ee(ae ?? null));
    } catch (i) {
      if (i instanceof Error && i.name === "CanceledError")
        return;
      console.error("Failed to load dashboard data:", i);
      const h = i;
      h.response?.status === 401 ? f("Session expirée. Veuillez vous reconnecter.") : h.response?.status === 403 ? f("Vous n'avez pas les permissions nécessaires pour accéder au dashboard.") : f("Erreur lors du chargement des données. Vérifiez que l'API est accessible.");
    } finally {
      t?.aborted || (v(!1), U(!1));
    }
  }, [o, n?.id, a]);
  ce(() => {
    p.current?.abort();
    const t = new AbortController();
    return p.current = t, k(t.signal), () => {
      t.abort();
    };
  }, [k]);
  const j = () => {
    p.current?.abort();
    const t = new AbortController();
    p.current = t, U(!0), k(t.signal);
  };
  return d ? /* @__PURE__ */ e("div", { className: "flex items-center justify-center min-h-[400px]", children: /* @__PURE__ */ e(he, { className: "w-8 h-8 animate-spin text-[var(--color-primary-600)]" }) }) : /* @__PURE__ */ s("div", { className: "space-y-6", children: [
    /* @__PURE__ */ e(
      ye,
      {
        items: [
          { label: r("header.title") },
          { label: r("dashboard.title") }
        ]
      }
    ),
    T && /* @__PURE__ */ s("div", { className: "bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-lg p-4 flex items-center gap-3", children: [
      /* @__PURE__ */ e(S, { className: "w-5 h-5 text-red-600 dark:text-red-400 flex-shrink-0" }),
      /* @__PURE__ */ e("div", { className: "flex-1", children: /* @__PURE__ */ e("p", { className: "text-red-800 dark:text-red-200 font-medium", children: T }) }),
      /* @__PURE__ */ e(
        "button",
        {
          onClick: j,
          className: "text-red-600 dark:text-red-400 hover:text-red-800 dark:hover:text-red-200",
          children: /* @__PURE__ */ e(B, { className: "w-5 h-5" })
        }
      )
    ] }),
    /* @__PURE__ */ s("div", { className: "flex items-center justify-between", children: [
      /* @__PURE__ */ s("div", { children: [
        /* @__PURE__ */ s("h1", { className: "text-2xl font-bold text-[var(--text-primary)] flex items-center gap-2", children: [
          /* @__PURE__ */ e(P, { className: "w-6 h-6" }),
          r("admin:header.title")
        ] }),
        /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)] mt-1", children: "Vue d'ensemble de la gestion des utilisateurs" })
      ] }),
      /* @__PURE__ */ s("div", { className: "flex items-center gap-3", children: [
        /* @__PURE__ */ s(
          "select",
          {
            value: o,
            onChange: (t) => z(Number(t.target.value)),
            className: "input",
            children: [
              /* @__PURE__ */ e("option", { value: 7, children: "7 derniers jours" }),
              /* @__PURE__ */ e("option", { value: 30, children: "30 derniers jours" }),
              /* @__PURE__ */ e("option", { value: 90, children: "90 derniers jours" })
            ]
          }
        ),
        /* @__PURE__ */ s(
          "button",
          {
            onClick: j,
            disabled: R,
            className: "btn btn-secondary flex items-center gap-2",
            children: [
              /* @__PURE__ */ e(B, { className: `w-4 h-4 ${R ? "animate-spin" : ""}` }),
              "Actualiser"
            ]
          }
        )
      ] })
    ] }),
    /* @__PURE__ */ s("div", { className: "grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4", children: [
      /* @__PURE__ */ e(
        b,
        {
          title: "Total Utilisateurs",
          value: m?.totalUsers ?? 0,
          icon: /* @__PURE__ */ e(P, { className: "w-5 h-5" }),
          color: "blue"
        }
      ),
      /* @__PURE__ */ e(
        b,
        {
          title: "Actifs",
          value: m?.activeUsers ?? 0,
          icon: /* @__PURE__ */ e(M, { className: "w-5 h-5" }),
          color: "green"
        }
      ),
      /* @__PURE__ */ e(
        b,
        {
          title: "Inactifs",
          value: m?.inactiveUsers ?? 0,
          icon: /* @__PURE__ */ e(ue, { className: "w-5 h-5" }),
          color: "red"
        }
      ),
      /* @__PURE__ */ e(
        b,
        {
          title: "Nouveaux",
          value: m?.newUsers ?? 0,
          icon: /* @__PURE__ */ e(xe, { className: "w-5 h-5" }),
          color: "blue",
          subtitle: `${o} derniers jours`
        }
      ),
      /* @__PURE__ */ e(
        b,
        {
          title: "Sessions",
          value: m?.totalSessions ?? 0,
          icon: /* @__PURE__ */ e(E, { className: "w-5 h-5" }),
          color: "green",
          subtitle: `${o} derniers jours`
        }
      ),
      /* @__PURE__ */ e(
        b,
        {
          title: "Connexions Echouées",
          value: m?.failedLogins ?? 0,
          icon: /* @__PURE__ */ e(S, { className: "w-5 h-5" }),
          color: (m?.failedLogins ?? 0) > 10 ? "red" : "yellow",
          subtitle: `${o} derniers jours`
        }
      )
    ] }),
    (C?.length ?? 0) > 0 && /* @__PURE__ */ s("div", { className: "card p-4 border-l-4 border-red-500", children: [
      /* @__PURE__ */ s("h3", { className: "font-semibold text-red-600 flex items-center gap-2 mb-3", children: [
        /* @__PURE__ */ e(S, { className: "w-5 h-5" }),
        "Alertes Sécurité (",
        C?.length ?? 0,
        ")"
      ] }),
      /* @__PURE__ */ e("div", { className: "space-y-2 max-h-40 overflow-y-auto", children: (C ?? []).slice(0, 5).map((t) => /* @__PURE__ */ s(
        "button",
        {
          type: "button",
          className: "w-full flex items-center justify-between p-2 bg-red-50 dark:bg-red-900/20 rounded cursor-pointer hover:bg-red-100 dark:hover:bg-red-900/30 text-left",
          onClick: () => l(`/administration/users/${t.userId}`),
          children: [
            /* @__PURE__ */ s("div", { children: [
              /* @__PURE__ */ e("span", { className: "font-medium", children: t.fullName }),
              /* @__PURE__ */ e("span", { className: "ml-2 text-sm text-[var(--text-secondary)]", children: t.email })
            ] }),
            /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
              /* @__PURE__ */ s("span", { className: "text-xs text-red-600 font-medium", children: [
                t.failedAttempts,
                " échecs"
              ] }),
              /* @__PURE__ */ s("span", { className: "text-xs text-[var(--text-secondary)]", children: [
                t.ipAddresses?.length ?? 0,
                " IP(s)"
              ] })
            ] })
          ]
        },
        t.userId
      )) })
    ] }),
    /* @__PURE__ */ s("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6", children: [
      /* @__PURE__ */ s("div", { className: "card p-4", children: [
        /* @__PURE__ */ s("h3", { className: "font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e(M, { className: "w-5 h-5" }),
          "Utilisateurs par Statut"
        ] }),
        /* @__PURE__ */ e("div", { className: "space-y-3", children: ($ ?? []).map((t) => {
          const i = ($ ?? []).reduce((N, g) => N + g.count, 0), h = i > 0 ? t.count / i * 100 : 0;
          return /* @__PURE__ */ s("div", { className: "flex items-center gap-3", children: [
            /* @__PURE__ */ e("div", { className: "w-24 text-sm", children: t.status === "Active" ? "Actifs" : "Inactifs" }),
            /* @__PURE__ */ e("div", { className: "flex-1 h-6 bg-[var(--bg-secondary)] rounded-full overflow-hidden", children: /* @__PURE__ */ e(
              "div",
              {
                className: "h-full rounded-full transition-all duration-500",
                style: {
                  width: `${h}%`,
                  backgroundColor: ke[t.status] || "#6b7280"
                }
              }
            ) }),
            /* @__PURE__ */ s("div", { className: "w-20 text-right", children: [
              /* @__PURE__ */ e("span", { className: "font-medium", children: t.count }),
              /* @__PURE__ */ s("span", { className: "text-xs text-[var(--text-secondary)] ml-1", children: [
                "(",
                h.toFixed(0),
                "%)"
              ] })
            ] })
          ] }, t.status);
        }) })
      ] }),
      /* @__PURE__ */ s("div", { className: "card p-4", children: [
        /* @__PURE__ */ s("h3", { className: "font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e(ve, { className: "w-5 h-5" }),
          "Utilisateurs par Rôle"
        ] }),
        /* @__PURE__ */ e("div", { className: "space-y-3", children: (w?.length ?? 0) > 0 ? (w ?? []).map((t, i) => {
          const h = Math.max(...(w ?? []).map((A) => A.count), 1), N = t.count / h * 100, g = ["#3b82f6", "#8b5cf6", "#22c55e", "#f59e0b", "#ef4444"];
          return /* @__PURE__ */ s("div", { className: "flex items-center gap-3", children: [
            /* @__PURE__ */ e("div", { className: "w-32 text-sm truncate", title: t.roleName, children: t.roleName }),
            /* @__PURE__ */ e("div", { className: "flex-1 h-6 bg-[var(--bg-secondary)] rounded-full overflow-hidden", children: /* @__PURE__ */ e(
              "div",
              {
                className: "h-full rounded-full transition-all duration-500",
                style: {
                  width: `${N}%`,
                  backgroundColor: g[i % g.length]
                }
              }
            ) }),
            /* @__PURE__ */ e("div", { className: "w-12 text-right font-medium", children: t.count })
          ] }, t.roleName);
        }) : /* @__PURE__ */ e("div", { className: "text-center py-4 text-[var(--text-secondary)]", children: "Aucun rôle configuré" }) })
      ] })
    ] }),
    /* @__PURE__ */ s("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6", children: [
      /* @__PURE__ */ s("div", { className: "card p-4", children: [
        /* @__PURE__ */ s("h3", { className: "font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e(ge, { className: "w-5 h-5" }),
          "Configuration Système"
        ] }),
        /* @__PURE__ */ s("div", { className: "grid grid-cols-2 gap-4", children: [
          /* @__PURE__ */ s("div", { className: "text-center p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
            /* @__PURE__ */ e("div", { className: "text-3xl font-bold text-purple-600", children: m?.totalRoles ?? 0 }),
            /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-secondary)]", children: "Rôles" })
          ] }),
          /* @__PURE__ */ s("div", { className: "text-center p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
            /* @__PURE__ */ e("div", { className: "text-3xl font-bold text-green-600", children: m?.totalPermissions ?? 0 }),
            /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-secondary)]", children: "Permissions" })
          ] }),
          /* @__PURE__ */ s("div", { className: "text-center p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
            /* @__PURE__ */ e("div", { className: "text-3xl font-bold text-blue-600", children: m?.usersLoggedInRecently ?? 0 }),
            /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-secondary)]", children: "Connectés récemment" })
          ] }),
          /* @__PURE__ */ s("div", { className: "text-center p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
            /* @__PURE__ */ e("div", { className: "text-3xl font-bold text-orange-600", children: u?.totalActiveSessions ?? 0 }),
            /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-secondary)]", children: "Sessions actives" })
          ] })
        ] })
      ] }),
      /* @__PURE__ */ s("div", { className: "card p-4", children: [
        /* @__PURE__ */ s("h3", { className: "font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e(y, { className: "w-5 h-5" }),
          "Sessions Actives"
        ] }),
        u && ((u.byBrowser?.length ?? 0) > 0 || (u.byCountry?.length ?? 0) > 0) ? /* @__PURE__ */ s("div", { className: "grid grid-cols-2 gap-4", children: [
          /* @__PURE__ */ s("div", { children: [
            /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-[var(--text-secondary)] mb-2", children: "Par Navigateur" }),
            /* @__PURE__ */ e("div", { className: "space-y-2", children: (u.byBrowser ?? []).map((t) => /* @__PURE__ */ s("div", { className: "flex items-center justify-between text-sm", children: [
              /* @__PURE__ */ e("span", { children: t.browser }),
              /* @__PURE__ */ e("span", { className: "font-medium", children: t.count })
            ] }, t.browser)) })
          ] }),
          /* @__PURE__ */ s("div", { children: [
            /* @__PURE__ */ s("h4", { className: "text-sm font-medium text-[var(--text-secondary)] mb-2 flex items-center gap-1", children: [
              /* @__PURE__ */ e(be, { className: "w-4 h-4" }),
              " Par Pays"
            ] }),
            /* @__PURE__ */ e("div", { className: "space-y-2", children: (u.byCountry?.length ?? 0) > 0 ? (u.byCountry ?? []).map((t) => /* @__PURE__ */ s("div", { className: "flex items-center justify-between text-sm", children: [
              /* @__PURE__ */ e("span", { children: t.country }),
              /* @__PURE__ */ e("span", { className: "font-medium", children: t.count })
            ] }, t.country)) : /* @__PURE__ */ e("span", { className: "text-[var(--text-secondary)] text-sm", children: "Non disponible" }) })
          ] })
        ] }) : /* @__PURE__ */ e("div", { className: "text-center py-8 text-[var(--text-secondary)]", children: "Aucune session active" })
      ] })
    ] }),
    /* @__PURE__ */ s("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6", children: [
      /* @__PURE__ */ s("div", { className: "card p-4", children: [
        /* @__PURE__ */ s("h3", { className: "font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e(y, { className: "w-5 h-5" }),
          "Appareils & Navigateurs"
        ] }),
        /* @__PURE__ */ e(we, { data: Y })
      ] }),
      /* @__PURE__ */ s("div", { className: "card p-4", children: [
        /* @__PURE__ */ s("h3", { className: "font-semibold mb-4 flex items-center gap-2", children: [
          /* @__PURE__ */ e(E, { className: "w-5 h-5" }),
          "Engagement Utilisateurs"
        ] }),
        /* @__PURE__ */ e(Ce, { data: _ })
      ] })
    ] }),
    /* @__PURE__ */ s("div", { className: "card p-4", children: [
      /* @__PURE__ */ s("h3", { className: "font-semibold mb-4 flex items-center gap-2", children: [
        /* @__PURE__ */ e(Ne, { className: "w-5 h-5" }),
        "Tendances (",
        o,
        " derniers jours)"
      ] }),
      /* @__PURE__ */ e("div", { className: "h-64", children: /* @__PURE__ */ e(Ae, { data: q ?? [] }) })
    ] }),
    /* @__PURE__ */ s("div", { className: "card p-4", children: [
      /* @__PURE__ */ s("h3", { className: "font-semibold mb-4 flex items-center gap-2", children: [
        /* @__PURE__ */ e(fe, { className: "w-5 h-5" }),
        "Dernières Sessions Actives"
      ] }),
      (D?.length ?? 0) > 0 ? /* @__PURE__ */ e("div", { className: "overflow-x-auto", children: /* @__PURE__ */ s("table", { className: "w-full", children: [
        /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ s("tr", { className: "border-b border-[var(--border-color)]", children: [
          /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium", children: "Utilisateur" }),
          /* @__PURE__ */ e("th", { className: "text-right p-3 font-medium", children: "Durée" })
        ] }) }),
        /* @__PURE__ */ e("tbody", { children: (D ?? []).map((t) => /* @__PURE__ */ s(
          "tr",
          {
            className: "border-b border-[var(--border-color)] hover:bg-[var(--bg-secondary)] cursor-pointer",
            onClick: () => l(`/administration/users/${t.userId}`),
            children: [
              /* @__PURE__ */ e("td", { className: "p-3 font-medium", children: t.fullName }),
              /* @__PURE__ */ e("td", { className: "p-3 text-right", children: /* @__PURE__ */ e("span", { className: "px-2 py-1 rounded text-xs font-medium bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400", children: t.duration }) })
            ]
          },
          t.userId + t.loginAt
        )) })
      ] }) }) : /* @__PURE__ */ e("div", { className: "text-center py-8 text-[var(--text-secondary)]", children: "Aucune session active" })
    ] })
  ] });
}
function b({
  title: r,
  value: l,
  icon: n,
  color: a,
  subtitle: d
}) {
  return /* @__PURE__ */ s("div", { className: `card p-4 border ${{
    blue: "bg-blue-50 text-blue-600 border-blue-200 dark:bg-blue-900/20 dark:border-blue-800",
    green: "bg-green-50 text-green-600 border-green-200 dark:bg-green-900/20 dark:border-green-800",
    yellow: "bg-yellow-50 text-yellow-600 border-yellow-200 dark:bg-yellow-900/20 dark:border-yellow-800",
    red: "bg-red-50 text-red-600 border-red-200 dark:bg-red-900/20 dark:border-red-800"
  }[a]}`, children: [
    /* @__PURE__ */ s("div", { className: "flex items-center justify-between mb-2", children: [
      /* @__PURE__ */ e("span", { className: "text-sm font-medium opacity-80", children: r }),
      n
    ] }),
    /* @__PURE__ */ e("div", { className: "text-2xl font-bold", children: l }),
    d && /* @__PURE__ */ e("div", { className: "text-xs opacity-70 mt-1", children: d })
  ] });
}
function Ae({ data: r }) {
  if (r.length === 0)
    return /* @__PURE__ */ e("div", { className: "flex items-center justify-center h-full text-[var(--text-secondary)]", children: "Aucune donnée de tendance disponible" });
  const l = Math.max(...r.flatMap((n) => [n.newUsers, n.logins]), 1);
  return /* @__PURE__ */ s("div", { className: "flex flex-col h-full", children: [
    /* @__PURE__ */ s("div", { className: "flex items-center gap-4 mb-4", children: [
      /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ e("div", { className: "w-3 h-3 rounded bg-blue-500" }),
        /* @__PURE__ */ e("span", { className: "text-sm", children: "Nouveaux utilisateurs" })
      ] }),
      /* @__PURE__ */ s("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ e("div", { className: "w-3 h-3 rounded bg-green-500" }),
        /* @__PURE__ */ e("span", { className: "text-sm", children: "Connexions" })
      ] })
    ] }),
    /* @__PURE__ */ e("div", { className: "flex-1 flex items-end gap-1 overflow-x-auto pb-4", children: r.map((n) => /* @__PURE__ */ s("div", { className: "flex-1 min-w-[20px] flex gap-0.5", children: [
      /* @__PURE__ */ e(
        "div",
        {
          className: "flex-1 bg-blue-500 rounded-t transition-all duration-300 hover:opacity-80",
          style: {
            height: `${n.newUsers / l * 100}%`,
            minHeight: n.newUsers > 0 ? "4px" : "0"
          },
          title: `Nouveaux: ${n.newUsers}`
        }
      ),
      /* @__PURE__ */ e(
        "div",
        {
          className: "flex-1 bg-green-500 rounded-t transition-all duration-300 hover:opacity-80",
          style: {
            height: `${n.logins / l * 100}%`,
            minHeight: n.logins > 0 ? "4px" : "0"
          },
          title: `Connexions: ${n.logins}`
        }
      )
    ] }, `${n.date}`)) }),
    /* @__PURE__ */ s("div", { className: "flex justify-between text-xs text-[var(--text-secondary)] mt-2", children: [
      /* @__PURE__ */ e("span", { children: r[0] && new Date(r[0].date).toLocaleDateString("fr-FR") }),
      /* @__PURE__ */ e("span", { children: r.at(-1) && new Date(r.at(-1).date).toLocaleDateString("fr-FR") })
    ] })
  ] });
}
export {
  Be as AdminDashboardPage
};
//# sourceMappingURL=DashboardPage-C8QRNpkr.js.map
