import { jsx as e, jsxs as r, Fragment as z } from "react/jsx-runtime";
import { useState as h, useCallback as ne, useEffect as ie } from "react";
import { useNavigate as ce } from "react-router-dom";
import { useTranslation as u } from "react-i18next";
import * as de from "lucide-react";
import { AlertTriangle as g, MapPin as H, Globe as D, Monitor as f, Clock as O, Loader2 as I, Star as C, Building2 as le, Settings as me, Activity as he, TrendingUp as ue, Calendar as ve, AppWindow as be, BarChart3 as K } from "lucide-react";
import { o as xe, a as ge, u as fe, a9 as ye, f as pe } from "./index-CwSaRXXg.js";
import { ResponsiveContainer as p, LineChart as Ne, CartesianGrid as R, XAxis as $, YAxis as y, Tooltip as N, Legend as we, Line as W, BarChart as G, ReferenceLine as Se, Bar as q, Cell as X, PieChart as ke, Pie as Ce } from "recharts";
function De({ data: t }) {
  const { t: o } = u("navigation");
  if (!t || t.length === 0)
    return /* @__PURE__ */ e("div", { className: "flex items-center justify-center h-64 text-[var(--text-secondary)]", children: o("dashboard.sessionAnalytics.noData") });
  const i = t.map((n) => ({
    date: new Date(n.date).toLocaleDateString("fr-FR", { day: "2-digit", month: "2-digit" }),
    loginCount: n.loginCount,
    avgDuration: Math.round(n.avgDuration)
  }));
  return /* @__PURE__ */ e(p, { width: "100%", height: 300, children: /* @__PURE__ */ r(Ne, { data: i, margin: { top: 5, right: 30, left: 20, bottom: 5 }, children: [
    /* @__PURE__ */ e(R, { strokeDasharray: "3 3", stroke: "var(--border-color)" }),
    /* @__PURE__ */ e(
      $,
      {
        dataKey: "date",
        stroke: "var(--text-secondary)",
        tick: { fill: "var(--text-secondary)", fontSize: 12 }
      }
    ),
    /* @__PURE__ */ e(
      y,
      {
        yAxisId: "left",
        stroke: "var(--color-accent-500)",
        tick: { fill: "var(--text-secondary)", fontSize: 12 },
        label: { value: o("dashboard.sessionAnalytics.connections"), angle: -90, position: "insideLeft", fill: "var(--text-secondary)" }
      }
    ),
    /* @__PURE__ */ e(
      y,
      {
        yAxisId: "right",
        orientation: "right",
        stroke: "#22c55e",
        tick: { fill: "var(--text-secondary)", fontSize: 12 },
        label: { value: o("dashboard.sessionAnalytics.avgDuration"), angle: 90, position: "insideRight", fill: "var(--text-secondary)" }
      }
    ),
    /* @__PURE__ */ e(
      N,
      {
        contentStyle: {
          backgroundColor: "var(--bg-card)",
          border: "1px solid var(--border-color)",
          borderRadius: "var(--radius-card)",
          color: "var(--text-primary)"
        },
        formatter: (n, a) => a === "loginCount" ? [n, o("dashboard.sessionAnalytics.connections")] : a === "avgDuration" ? [`${n} min`, o("dashboard.sessionAnalytics.avgDuration")] : [n, a || ""]
      }
    ),
    /* @__PURE__ */ e(
      we,
      {
        wrapperStyle: { color: "var(--text-secondary)" },
        formatter: (n) => n === "loginCount" ? o("dashboard.sessionAnalytics.connections") : n === "avgDuration" ? o("dashboard.sessionAnalytics.avgDurationMin") : n
      }
    ),
    /* @__PURE__ */ e(
      W,
      {
        yAxisId: "left",
        type: "monotone",
        dataKey: "loginCount",
        stroke: "var(--color-accent-500)",
        strokeWidth: 2,
        dot: { fill: "var(--color-accent-500)", r: 4 },
        activeDot: { r: 6 }
      }
    ),
    /* @__PURE__ */ e(
      W,
      {
        yAxisId: "right",
        type: "monotone",
        dataKey: "avgDuration",
        stroke: "#22c55e",
        strokeWidth: 2,
        dot: { fill: "#22c55e", r: 4 },
        activeDot: { r: 6 }
      }
    )
  ] }) });
}
function Re({ errors: t }) {
  const { t: o } = u("navigation");
  if (!Array.isArray(t) || t.length === 0)
    return /* @__PURE__ */ r("div", { className: "flex flex-col items-center justify-center py-8 text-[var(--text-secondary)]", children: [
      /* @__PURE__ */ e(g, { className: "w-12 h-12 mb-3 text-green-500" }),
      /* @__PURE__ */ e("p", { className: "font-medium", children: o("dashboard.loginErrors.noErrors") }),
      /* @__PURE__ */ e("p", { className: "text-sm mt-1", children: o("dashboard.loginErrors.accountSecure") })
    ] });
  const i = (n) => {
    const a = new Date(n);
    return ((/* @__PURE__ */ new Date()).getTime() - a.getTime()) / (1e3 * 60 * 60) < 24;
  };
  return /* @__PURE__ */ e("div", { className: "overflow-x-auto", children: /* @__PURE__ */ r("table", { className: "w-full", children: [
    /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ r("tr", { className: "border-b border-[var(--border-color)]", children: [
      /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium text-[var(--text-secondary)] text-sm", children: o("dashboard.loginErrors.columns.datetime") }),
      /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium text-[var(--text-secondary)] text-sm", children: o("dashboard.loginErrors.columns.reason") }),
      /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium text-[var(--text-secondary)] text-sm", children: o("dashboard.loginErrors.columns.ipAddress") }),
      /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium text-[var(--text-secondary)] text-sm", children: o("dashboard.loginErrors.columns.location") })
    ] }) }),
    /* @__PURE__ */ e("tbody", { children: t.map((n) => {
      const a = i(n.loginAt);
      return /* @__PURE__ */ r(
        "tr",
        {
          className: `border-b border-[var(--border-color)] hover:bg-[var(--bg-secondary)] ${a ? "bg-red-50/50 dark:bg-red-900/10" : ""}`,
          children: [
            /* @__PURE__ */ e("td", { className: "p-3", children: /* @__PURE__ */ r("div", { className: "flex items-center gap-2", children: [
              a && /* @__PURE__ */ e("span", { className: "w-2 h-2 rounded-full bg-red-500 animate-pulse", title: o("dashboard.loginErrors.recentLabel") }),
              /* @__PURE__ */ e("span", { className: "text-sm", children: new Date(n.loginAt).toLocaleDateString("fr-FR", {
                day: "2-digit",
                month: "2-digit",
                year: "numeric",
                hour: "2-digit",
                minute: "2-digit"
              }) })
            ] }) }),
            /* @__PURE__ */ e("td", { className: "p-3", children: /* @__PURE__ */ r(
              "span",
              {
                className: "inline-flex items-center gap-1 px-2 py-1 text-xs font-medium bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-400",
                style: { borderRadius: "var(--radius-badge)" },
                children: [
                  /* @__PURE__ */ e(g, { className: "w-3 h-3" }),
                  n.failureReason
                ]
              }
            ) }),
            /* @__PURE__ */ e("td", { className: "p-3", children: /* @__PURE__ */ e("span", { className: "text-sm font-mono text-[var(--text-secondary)]", children: n.ipAddress || "N/A" }) }),
            /* @__PURE__ */ e("td", { className: "p-3", children: n.city || n.country ? /* @__PURE__ */ r("div", { className: "flex items-center gap-1 text-sm text-[var(--text-secondary)]", children: [
              n.city && /* @__PURE__ */ r(z, { children: [
                /* @__PURE__ */ e(H, { className: "w-3 h-3" }),
                /* @__PURE__ */ e("span", { children: n.city })
              ] }),
              n.country && /* @__PURE__ */ r(z, { children: [
                /* @__PURE__ */ e(D, { className: "w-3 h-3" }),
                /* @__PURE__ */ e("span", { children: n.country })
              ] })
            ] }) : /* @__PURE__ */ e("span", { className: "text-sm text-[var(--text-tertiary)]", children: o("dashboard.loginErrors.notAvailable") }) })
          ]
        },
        n.loginAt
      );
    }) })
  ] }) });
}
function $e({ session: t }) {
  const { t: o } = u("navigation");
  if (!t)
    return /* @__PURE__ */ r("div", { className: "flex flex-col items-center justify-center py-8 text-[var(--text-secondary)]", children: [
      /* @__PURE__ */ e(f, { className: "w-12 h-12 mb-3 opacity-50" }),
      /* @__PURE__ */ e("p", { className: "font-medium", children: o("dashboard.currentSession.noActiveSession") }),
      /* @__PURE__ */ e("p", { className: "text-sm mt-1", children: o("dashboard.currentSession.pleaseReconnect") })
    ] });
  const i = (a) => {
    if (a < 1) return "< 1 minute";
    if (a < 60) return `${Math.round(a)} minutes`;
    const s = Math.floor(a / 60), c = Math.round(a % 60);
    return c === 0 ? `${s}h` : `${s}h ${c}min`;
  }, n = (a) => a ? a.includes("Edg/") ? o("dashboard.browsers.edge") : a.includes("Chrome/") ? o("dashboard.browsers.chrome") : a.includes("Firefox/") ? o("dashboard.browsers.firefox") : a.includes("Safari/") && !a.includes("Chrome") ? o("dashboard.browsers.safari") : a.includes("OPR/") || a.includes("Opera/") ? o("dashboard.browsers.opera") : o("dashboard.browsers.other") : o("dashboard.browsers.unknown");
  return /* @__PURE__ */ r("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
    /* @__PURE__ */ r("div", { className: "flex items-start gap-3 p-4 bg-[var(--bg-secondary)]", style: { borderRadius: "var(--radius-card)" }, children: [
      /* @__PURE__ */ e(
        "div",
        {
          className: "p-2 bg-[var(--accent-bg)] text-[var(--color-accent-500)]",
          style: { borderRadius: "var(--radius-button)" },
          children: /* @__PURE__ */ e(O, { className: "w-5 h-5" })
        }
      ),
      /* @__PURE__ */ r("div", { className: "flex-1", children: [
        /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-tertiary)] uppercase tracking-wide", children: o("dashboard.currentSession.duration") }),
        /* @__PURE__ */ e("p", { className: "text-lg font-bold text-[var(--text-primary)] mt-1", children: i(t.durationMinutes) }),
        /* @__PURE__ */ r("p", { className: "text-xs text-[var(--text-secondary)] mt-1", children: [
          o("dashboard.currentSession.since"),
          " ",
          new Date(t.loginAt).toLocaleTimeString("fr-FR", { hour: "2-digit", minute: "2-digit" })
        ] })
      ] })
    ] }),
    /* @__PURE__ */ r("div", { className: "flex items-start gap-3 p-4 bg-[var(--bg-secondary)]", style: { borderRadius: "var(--radius-card)" }, children: [
      /* @__PURE__ */ e(
        "div",
        {
          className: "p-2 bg-blue-500/10 text-blue-500",
          style: { borderRadius: "var(--radius-button)" },
          children: /* @__PURE__ */ e(f, { className: "w-5 h-5" })
        }
      ),
      /* @__PURE__ */ r("div", { className: "flex-1", children: [
        /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-tertiary)] uppercase tracking-wide", children: o("dashboard.currentSession.device") }),
        /* @__PURE__ */ e("p", { className: "text-lg font-bold text-[var(--text-primary)] mt-1", children: n(t.userAgent) }),
        /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-secondary)] mt-1 font-mono", children: t.ipAddress || o("dashboard.currentSession.ipNotAvailable") })
      ] })
    ] }),
    (t.city || t.country) && /* @__PURE__ */ r("div", { className: "md:col-span-2 flex items-start gap-3 p-4 bg-[var(--bg-secondary)]", style: { borderRadius: "var(--radius-card)" }, children: [
      /* @__PURE__ */ e(
        "div",
        {
          className: "p-2 bg-green-500/10 text-green-500",
          style: { borderRadius: "var(--radius-button)" },
          children: /* @__PURE__ */ e(D, { className: "w-5 h-5" })
        }
      ),
      /* @__PURE__ */ r("div", { className: "flex-1", children: [
        /* @__PURE__ */ e("p", { className: "text-xs text-[var(--text-tertiary)] uppercase tracking-wide", children: o("dashboard.currentSession.location") }),
        /* @__PURE__ */ r("div", { className: "flex items-center gap-3 mt-1", children: [
          t.city && /* @__PURE__ */ r("div", { className: "flex items-center gap-1", children: [
            /* @__PURE__ */ e(H, { className: "w-4 h-4 text-[var(--text-secondary)]" }),
            /* @__PURE__ */ e("span", { className: "text-sm font-medium text-[var(--text-primary)]", children: t.city })
          ] }),
          t.country && /* @__PURE__ */ e("span", { className: "text-sm text-[var(--text-secondary)]", children: t.country })
        ] })
      ] })
    ] })
  ] });
}
function Ae({ stats: t }) {
  const { t: o } = u("navigation");
  if (!t)
    return /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-8 text-[var(--text-secondary)]", children: /* @__PURE__ */ e("p", { children: o("dashboard.deviceStats.noData") }) });
  const i = ["#3b82f6", "#8b5cf6", "#22c55e", "#f59e0b", "#ef4444"], n = ["#06b6d4", "#ec4899", "#10b981", "#f97316", "#6366f1"];
  return /* @__PURE__ */ r("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [
    /* @__PURE__ */ r("div", { children: [
      /* @__PURE__ */ r("h4", { className: "text-sm font-medium text-[var(--text-secondary)] mb-3 flex items-center gap-2", children: [
        /* @__PURE__ */ e(f, { className: "w-4 h-4" }),
        o("dashboard.deviceStats.browsersUsed")
      ] }),
      t.byBrowser?.length ? /* @__PURE__ */ e("div", { className: "space-y-3", children: t.byBrowser.map((a, s) => {
        const c = Math.max(...t.byBrowser.map((m) => m.count), 1), l = a.count / c * 100;
        return /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
          /* @__PURE__ */ e("div", { className: "w-24 text-sm text-[var(--text-primary)] truncate", title: a.browser, children: a.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: `${l}%`,
                backgroundColor: i[s % i.length]
              }
            }
          ) }),
          /* @__PURE__ */ e("div", { className: "w-12 text-right font-medium text-[var(--text-primary)]", children: a.count })
        ] }, a.browser);
      }) }) : /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)]", children: o("dashboard.deviceStats.noData") })
    ] }),
    /* @__PURE__ */ r("div", { children: [
      /* @__PURE__ */ r("h4", { className: "text-sm font-medium text-[var(--text-secondary)] mb-3 flex items-center gap-2", children: [
        /* @__PURE__ */ e(D, { className: "w-4 h-4" }),
        o("dashboard.deviceStats.connectionCountries")
      ] }),
      t.byCountry?.length ? /* @__PURE__ */ e("div", { className: "space-y-3", children: t.byCountry.map((a, s) => {
        const c = Math.max(...t.byCountry.map((m) => m.count), 1), l = a.count / c * 100;
        return /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
          /* @__PURE__ */ e("div", { className: "w-24 text-sm text-[var(--text-primary)] truncate", title: a.country, children: a.country }),
          /* @__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}%`,
                backgroundColor: n[s % n.length]
              }
            }
          ) }),
          /* @__PURE__ */ e("div", { className: "w-12 text-right font-medium text-[var(--text-primary)]", children: a.count })
        ] }, a.country);
      }) }) : /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)]", children: o("dashboard.deviceStats.locationNotAvailable") })
    ] })
  ] });
}
function Ue({ data: t }) {
  const { t: o } = u("navigation");
  if (!t?.dayStats?.length)
    return /* @__PURE__ */ e("div", { className: "flex items-center justify-center h-64 text-[var(--text-secondary)]", children: o("dashboard.weeklyUsage.noData") });
  const i = t.dayStats.map((s) => ({
    day: o(`dashboard.days.${s.dayName.toLowerCase()}`),
    duration: s.sessionCount > 0 ? Math.round(s.totalDuration / s.sessionCount) : 0,
    sessionCount: s.sessionCount
  })), n = i.filter((s) => s.sessionCount > 0).length > 0 ? i.filter((s) => s.sessionCount > 0).reduce((s, c) => s + c.duration, 0) / i.filter((s) => s.sessionCount > 0).length : 0, a = (s) => {
    if (s < 60) return `${s} min`;
    const c = Math.floor(s / 60), l = s % 60;
    return l > 0 ? `${c}h ${l}m` : `${c}h`;
  };
  return /* @__PURE__ */ e(p, { width: "100%", height: 300, children: /* @__PURE__ */ r(G, { data: i, margin: { top: 20, right: 30, left: 20, bottom: 5 }, children: [
    /* @__PURE__ */ e(R, { strokeDasharray: "3 3", stroke: "var(--border-color)" }),
    /* @__PURE__ */ e(
      $,
      {
        dataKey: "day",
        stroke: "var(--text-secondary)",
        tick: { fill: "var(--text-secondary)", fontSize: 12 }
      }
    ),
    /* @__PURE__ */ e(
      y,
      {
        stroke: "var(--text-secondary)",
        tick: { fill: "var(--text-secondary)", fontSize: 12 },
        label: {
          value: o("dashboard.weeklyUsage.duration"),
          angle: -90,
          position: "insideLeft",
          fill: "var(--text-secondary)"
        }
      }
    ),
    /* @__PURE__ */ e(
      N,
      {
        cursor: { fill: "transparent" },
        contentStyle: {
          backgroundColor: "var(--bg-tertiary)",
          border: "none",
          borderRadius: "var(--radius-card)",
          boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
          padding: "8px 12px"
        },
        formatter: (s) => [a(s), null],
        labelStyle: { color: "var(--text-primary)", fontWeight: 600, marginBottom: 4 },
        itemStyle: { color: "var(--text-secondary)", padding: 0 },
        separator: ""
      }
    ),
    /* @__PURE__ */ e(
      Se,
      {
        y: n,
        stroke: "#f59e0b",
        strokeDasharray: "5 5",
        label: {
          value: `${o("dashboard.weeklyUsage.average")}: ${a(Math.round(n))}`,
          position: "right",
          fill: "#f59e0b",
          fontSize: 11
        }
      }
    ),
    /* @__PURE__ */ e(
      q,
      {
        dataKey: "duration",
        fill: "var(--color-accent-500)",
        radius: [4, 4, 0, 0]
      }
    )
  ] }) });
}
function Le({ data: t }) {
  const { t: o } = u("navigation");
  if (!t?.hourStats?.length)
    return /* @__PURE__ */ e("div", { className: "flex items-center justify-center h-64 text-[var(--text-secondary)]", children: o("dashboard.hourlyUsage.noData") });
  const i = (s) => `${s.toString().padStart(2, "0")}:00`, n = (s) => {
    if (s < 60) return `${s} min`;
    const c = Math.floor(s / 60), l = s % 60;
    return l > 0 ? `${c}h ${l}m` : `${c}h`;
  }, a = t.hourStats.map((s) => ({
    hour: i(s.hour),
    hourNum: s.hour,
    duration: s.sessionCount > 0 ? Math.round(s.totalDuration / s.sessionCount) : 0,
    sessionCount: s.sessionCount,
    isPeak: s.hour === t.peakHour
  }));
  return /* @__PURE__ */ r("div", { children: [
    /* @__PURE__ */ r("div", { className: "flex items-center justify-end mb-2 text-xs text-[var(--text-secondary)]", children: [
      /* @__PURE__ */ e("span", { className: "inline-block w-3 h-3 rounded-sm bg-[var(--color-accent-600)] mr-1" }),
      o("dashboard.hourlyUsage.peakHour"),
      ": ",
      i(t.peakHour)
    ] }),
    /* @__PURE__ */ e(p, { width: "100%", height: 300, children: /* @__PURE__ */ r(G, { data: a, margin: { top: 10, right: 30, left: 20, bottom: 5 }, children: [
      /* @__PURE__ */ e(R, { strokeDasharray: "3 3", stroke: "var(--border-color)" }),
      /* @__PURE__ */ e(
        $,
        {
          dataKey: "hour",
          stroke: "var(--text-secondary)",
          tick: { fill: "var(--text-secondary)", fontSize: 11 },
          interval: 0,
          angle: -45,
          textAnchor: "end",
          height: 60
        }
      ),
      /* @__PURE__ */ e(
        y,
        {
          stroke: "var(--text-secondary)",
          tick: { fill: "var(--text-secondary)", fontSize: 12 },
          label: {
            value: o("dashboard.hourlyUsage.duration"),
            angle: -90,
            position: "insideLeft",
            fill: "var(--text-secondary)"
          }
        }
      ),
      /* @__PURE__ */ e(
        N,
        {
          cursor: { fill: "transparent" },
          contentStyle: {
            backgroundColor: "var(--bg-tertiary)",
            border: "none",
            borderRadius: "var(--radius-card)",
            boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
            padding: "8px 12px"
          },
          formatter: (s) => [n(s), null],
          labelStyle: { color: "var(--text-primary)", fontWeight: 600, marginBottom: 4 },
          itemStyle: { color: "var(--text-secondary)", padding: 0 },
          separator: ""
        }
      ),
      /* @__PURE__ */ e(q, { dataKey: "duration", radius: [4, 4, 0, 0], children: a.map((s, c) => /* @__PURE__ */ e(
        X,
        {
          fill: s.isPeak ? "var(--color-accent-600)" : "var(--color-accent-400)"
        },
        `${s.hour}-${c}`
      )) })
    ] }) })
  ] });
}
const x = ["#3b82f6", "#22c55e", "#f59e0b", "#ef4444", "#8b5cf6", "#06b6d4", "#ec4899", "#84cc16", "#f97316", "#6366f1"];
function Me({ data: t }) {
  const { t: o } = u("navigation");
  if (!t?.applications?.length)
    return /* @__PURE__ */ e("div", { className: "flex items-center justify-center h-64 text-[var(--text-secondary)]", children: o("dashboard.applicationUsage.noData") });
  const i = t.applications.map((a) => ({
    name: a.applicationName,
    value: a.accessCount,
    duration: a.totalDurationSeconds,
    percentage: a.percentage
  })), n = (a) => a < 60 ? `${a}s` : a < 3600 ? `${Math.round(a / 60)}m` : `${Math.round(a / 3600)}h`;
  return /* @__PURE__ */ r("div", { className: "flex flex-col md:flex-row items-center gap-6", children: [
    /* @__PURE__ */ e("div", { className: "w-full md:w-1/2", children: /* @__PURE__ */ e(p, { width: "100%", height: 280, children: /* @__PURE__ */ r(ke, { children: [
      /* @__PURE__ */ e(
        Ce,
        {
          data: i,
          cx: "50%",
          cy: "50%",
          innerRadius: 60,
          outerRadius: 90,
          dataKey: "value",
          label: ({ name: a, percent: s }) => `${a} (${((s ?? 0) * 100).toFixed(0)}%)`,
          labelLine: !1,
          children: i.map((a, s) => /* @__PURE__ */ e(X, { fill: x[s % x.length] }, `${a.name}-${s}`))
        }
      ),
      /* @__PURE__ */ e(
        N,
        {
          contentStyle: {
            backgroundColor: "var(--bg-tertiary)",
            border: "none",
            borderRadius: "var(--radius-card)",
            boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
            padding: "8px 12px"
          },
          formatter: (a, s, c) => [
            `${a} ${o("dashboard.applicationUsage.accesses")} (${n(c.payload.duration)})`,
            null
          ],
          labelStyle: { color: "var(--text-primary)", fontWeight: 600, marginBottom: 4 },
          itemStyle: { color: "var(--text-secondary)", padding: 0 },
          separator: ""
        }
      )
    ] }) }) }),
    /* @__PURE__ */ r("div", { className: "w-full md:w-1/2", children: [
      /* @__PURE__ */ r("div", { className: "text-sm text-[var(--text-secondary)] mb-3", children: [
        o("dashboard.applicationUsage.totalAccess"),
        ": ",
        /* @__PURE__ */ e("span", { className: "font-semibold text-[var(--text-primary)]", children: t.totalAccess })
      ] }),
      /* @__PURE__ */ e("div", { className: "space-y-2 max-h-[240px] overflow-y-auto", children: t.applications.map((a, s) => /* @__PURE__ */ r(
        "div",
        {
          className: "flex items-center gap-3 p-2 rounded-[var(--radius-card)] hover:bg-[var(--bg-hover)] transition-colors",
          children: [
            /* @__PURE__ */ e(
              "div",
              {
                className: "w-3 h-3 rounded-sm flex-shrink-0",
                style: { backgroundColor: x[s % x.length] }
              }
            ),
            /* @__PURE__ */ r("div", { className: "flex-1 min-w-0", children: [
              /* @__PURE__ */ e("div", { className: "text-sm font-medium text-[var(--text-primary)] truncate", children: a.applicationName }),
              /* @__PURE__ */ r("div", { className: "text-xs text-[var(--text-secondary)]", children: [
                a.accessCount,
                " ",
                o("dashboard.applicationUsage.accesses"),
                " - ",
                n(a.totalDurationSeconds)
              ] })
            ] }),
            /* @__PURE__ */ r("div", { className: "text-sm font-semibold text-[var(--text-primary)]", children: [
              a.percentage,
              "%"
            ] })
          ]
        },
        a.applicationId
      )) })
    ] })
  ] });
}
function Ee({ name: t, className: o }) {
  const n = de[t];
  return n ? /* @__PURE__ */ e(n, { className: o }) : /* @__PURE__ */ e(C, { className: o });
}
function Ke() {
  const { t } = u(["navigation", "common"]), o = ce(), { user: i } = xe(), { currentTenant: n } = ge(), { menu: a } = fe(), { favorites: s, loading: c, triggerExpand: l } = ye(), [m, Y] = h(30), [_, A] = h(!0), [w, U] = h(null), [S, L] = h([]), [J, M] = h(null), [Q, E] = h(null), [V, j] = h(null), [Z, B] = h(null), [ee, T] = h(null), ae = (d) => {
    if (a)
      for (const v of a.applications) {
        const P = v.modules.find((b) => b.id === d.id);
        if (P?.sections?.length) {
          const b = [...P.sections].sort((se, oe) => se.displayOrder - oe.displayOrder)[0];
          if (b.route) return b.route;
        }
      }
    return d.route;
  }, re = (d) => {
    const v = ae(d);
    v && (l(), o(v));
  }, te = i?.firstName && i?.lastName ? `${i.firstName} ${i.lastName}` : i?.email || "Utilisateur", F = ne(async () => {
    try {
      A(!0);
      const d = await pe.dashboard.getAll(m, 10);
      U(d.sessionAnalytics), L(d.loginErrors ?? []), M(d.currentSession), E(d.deviceStats), j(d.weeklyStats), B(d.hourlyStats), T(d.applicationUsage);
    } catch {
      U(null), L([]), M(null), E(null), j(null), B(null), T(null);
    } finally {
      A(!1);
    }
  }, [m]);
  return ie(() => {
    F();
  }, [m, F]), _ ? /* @__PURE__ */ e("div", { className: "flex items-center justify-center min-h-[400px]", children: /* @__PURE__ */ e(I, { className: "w-8 h-8 animate-spin text-[var(--color-accent-500)]" }) }) : /* @__PURE__ */ r("div", { className: "space-y-6", children: [
    /* @__PURE__ */ r("div", { children: [
      /* @__PURE__ */ r("h1", { className: "text-2xl font-bold text-[var(--text-primary)]", children: [
        t("navigation:dashboard.welcome"),
        ", ",
        te
      ] }),
      /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)] mt-1", children: t("navigation:breadcrumb.myspace") })
    ] }),
    /* @__PURE__ */ r(
      "div",
      {
        className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)]",
        style: { borderRadius: "var(--radius-card)" },
        children: [
          /* @__PURE__ */ r("div", { className: "flex items-center justify-between mb-4", children: [
            /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
              /* @__PURE__ */ e(C, { className: "w-5 h-5 text-[var(--color-accent-500)]" }),
              /* @__PURE__ */ e("h2", { className: "font-semibold text-[var(--text-primary)]", children: t("common:favorites.quickAccess") }),
              n && /* @__PURE__ */ r("span", { className: "flex items-center gap-1.5 text-xs text-[var(--text-tertiary)] px-2 py-1 bg-[var(--bg-secondary)] border border-[var(--border-color)]", style: { borderRadius: "var(--radius-button)" }, children: [
                /* @__PURE__ */ e(le, { className: "w-3.5 h-3.5" }),
                n.name
              ] })
            ] }),
            /* @__PURE__ */ r(
              "button",
              {
                onClick: () => o("/myspace/preferences?tab=favorites"),
                className: "flex items-center gap-1.5 px-3 py-1.5 text-sm text-[var(--text-secondary)] hover:text-[var(--text-primary)] hover:bg-[var(--bg-hover)] transition-colors",
                style: { borderRadius: "var(--radius-button)" },
                children: [
                  /* @__PURE__ */ e(me, { className: "w-4 h-4" }),
                  t("common:favorites.manage")
                ]
              }
            )
          ] }),
          c && /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-8", children: /* @__PURE__ */ e(I, { className: "w-6 h-6 animate-spin text-[var(--color-accent-500)]" }) }),
          !c && s.length === 0 && /* @__PURE__ */ r("div", { className: "text-center py-8", children: [
            /* @__PURE__ */ e(C, { className: "w-12 h-12 mx-auto text-[var(--text-muted)] mb-3" }),
            /* @__PURE__ */ e("p", { className: "text-[var(--text-secondary)] mb-4", children: t("common:favorites.noFavorites") }),
            /* @__PURE__ */ e(
              "button",
              {
                onClick: () => o("/myspace/preferences?tab=favorites"),
                className: "px-4 py-2 bg-[var(--color-accent-600)] text-white font-medium hover:bg-[var(--color-accent-700)] transition-colors",
                style: { borderRadius: "var(--radius-button)" },
                children: t("common:favorites.configureFavorites")
              }
            )
          ] }),
          !c && s.length > 0 && /* @__PURE__ */ e("div", { className: "grid grid-cols-2 sm:grid-cols-3 md:grid-cols-5 gap-3", children: s.map((d) => /* @__PURE__ */ r(
            "button",
            {
              onClick: () => re(d),
              className: "flex flex-col items-center gap-2 p-4 bg-[var(--bg-secondary)] hover:bg-[var(--bg-hover)] border border-[var(--border-color)] hover:border-[var(--color-accent-500)] transition-all group",
              style: { borderRadius: "var(--radius-card)" },
              children: [
                /* @__PURE__ */ e(
                  "div",
                  {
                    className: "w-12 h-12 flex items-center justify-center bg-[var(--color-accent-100)] text-[var(--color-accent-600)] group-hover:bg-[var(--color-accent-600)] group-hover:text-white transition-colors",
                    style: { borderRadius: "var(--radius-button)" },
                    children: /* @__PURE__ */ e(Ee, { name: d.icon, className: "w-6 h-6" })
                  }
                ),
                /* @__PURE__ */ e("span", { className: "text-sm font-medium text-[var(--text-primary)] text-center", children: d.label }),
                /* @__PURE__ */ e("span", { className: "text-xs text-[var(--text-muted)]", children: d.applicationLabel })
              ]
            },
            d.id
          )) })
        ]
      }
    ),
    /* @__PURE__ */ r("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
      /* @__PURE__ */ e(
        k,
        {
          title: t("navigation:dashboard.stats.totalSessions"),
          value: w?.totalSessions ?? 0,
          icon: /* @__PURE__ */ e(he, { className: "w-5 h-5" }),
          subtitle: `${m} ${t("navigation:dashboard.stats.lastDays")}`
        }
      ),
      /* @__PURE__ */ e(
        k,
        {
          title: t("navigation:dashboard.stats.avgDuration"),
          value: `${Math.round(w?.avgSessionDuration ?? 0)} min`,
          icon: /* @__PURE__ */ e(ue, { className: "w-5 h-5" }),
          subtitle: t("navigation:dashboard.stats.perSession")
        }
      ),
      /* @__PURE__ */ e(
        k,
        {
          title: t("navigation:dashboard.stats.connectionErrors"),
          value: (S ?? []).length,
          icon: /* @__PURE__ */ e(g, { className: "w-5 h-5" }),
          subtitle: t("navigation:dashboard.stats.recent"),
          color: (S ?? []).length > 0 ? "red" : "green"
        }
      )
    ] }),
    /* @__PURE__ */ r("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6", children: [
      /* @__PURE__ */ r(
        "div",
        {
          className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)]",
          style: { borderRadius: "var(--radius-card)" },
          children: [
            /* @__PURE__ */ r("div", { className: "flex items-center gap-3 mb-4", children: [
              /* @__PURE__ */ e(ve, { className: "w-5 h-5 text-[var(--text-secondary)]" }),
              /* @__PURE__ */ e("h2", { className: "font-semibold text-[var(--text-primary)]", children: t("navigation:dashboard.weeklyUsage.title") })
            ] }),
            /* @__PURE__ */ e(Ue, { data: V })
          ]
        }
      ),
      /* @__PURE__ */ r(
        "div",
        {
          className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)]",
          style: { borderRadius: "var(--radius-card)" },
          children: [
            /* @__PURE__ */ r("div", { className: "flex items-center gap-3 mb-4", children: [
              /* @__PURE__ */ e(O, { className: "w-5 h-5 text-[var(--text-secondary)]" }),
              /* @__PURE__ */ e("h2", { className: "font-semibold text-[var(--text-primary)]", children: t("navigation:dashboard.hourlyUsage.title") })
            ] }),
            /* @__PURE__ */ e(Le, { data: Z })
          ]
        }
      )
    ] }),
    /* @__PURE__ */ r(
      "div",
      {
        className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)]",
        style: { borderRadius: "var(--radius-card)" },
        children: [
          /* @__PURE__ */ r("div", { className: "flex items-center gap-3 mb-4", children: [
            /* @__PURE__ */ e(be, { className: "w-5 h-5 text-[var(--text-secondary)]" }),
            /* @__PURE__ */ e("h2", { className: "font-semibold text-[var(--text-primary)]", children: t("navigation:dashboard.applicationUsage.title") })
          ] }),
          /* @__PURE__ */ e(Me, { data: ee })
        ]
      }
    ),
    /* @__PURE__ */ r(
      "div",
      {
        className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)]",
        style: { borderRadius: "var(--radius-card)" },
        children: [
          /* @__PURE__ */ r("div", { className: "flex items-center justify-between mb-6", children: [
            /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
              /* @__PURE__ */ e(K, { className: "w-5 h-5 text-[var(--text-secondary)]" }),
              /* @__PURE__ */ e("h2", { className: "font-semibold text-[var(--text-primary)]", children: t("navigation:dashboard.sessionAnalytics.title") })
            ] }),
            /* @__PURE__ */ e("div", { className: "flex gap-2", children: [7, 30, 90].map((d) => /* @__PURE__ */ e(
              "button",
              {
                onClick: () => Y(d),
                className: `px-3 py-1 text-sm font-medium transition-colors ${m === d ? "bg-[var(--color-accent-500)] text-white" : "bg-[var(--bg-secondary)] text-[var(--text-secondary)] hover:bg-[var(--bg-tertiary)]"}`,
                style: { borderRadius: "var(--radius-button)" },
                children: t(`navigation:dashboard.sessionAnalytics.period.${d}days`)
              },
              d
            )) })
          ] }),
          /* @__PURE__ */ e(De, { data: w?.dailyStats ?? [] })
        ]
      }
    ),
    /* @__PURE__ */ r(
      "div",
      {
        className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)]",
        style: { borderRadius: "var(--radius-card)" },
        children: [
          /* @__PURE__ */ r("div", { className: "flex items-center gap-3 mb-4", children: [
            /* @__PURE__ */ e(f, { className: "w-5 h-5 text-[var(--text-secondary)]" }),
            /* @__PURE__ */ e("h2", { className: "font-semibold text-[var(--text-primary)]", children: t("navigation:dashboard.currentSession.title") })
          ] }),
          /* @__PURE__ */ e($e, { session: J })
        ]
      }
    ),
    /* @__PURE__ */ r(
      "div",
      {
        className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)]",
        style: { borderRadius: "var(--radius-card)" },
        children: [
          /* @__PURE__ */ r("div", { className: "flex items-center gap-3 mb-4", children: [
            /* @__PURE__ */ e(g, { className: "w-5 h-5 text-[var(--text-secondary)]" }),
            /* @__PURE__ */ e("h2", { className: "font-semibold text-[var(--text-primary)]", children: t("navigation:dashboard.loginErrors.title") })
          ] }),
          /* @__PURE__ */ e(Re, { errors: S ?? [] })
        ]
      }
    ),
    /* @__PURE__ */ r(
      "div",
      {
        className: "p-6 bg-[var(--bg-card)] border border-[var(--border-color)]",
        style: { borderRadius: "var(--radius-card)" },
        children: [
          /* @__PURE__ */ r("div", { className: "flex items-center gap-3 mb-4", children: [
            /* @__PURE__ */ e(K, { className: "w-5 h-5 text-[var(--text-secondary)]" }),
            /* @__PURE__ */ e("h2", { className: "font-semibold text-[var(--text-primary)]", children: t("navigation:dashboard.deviceStats.title") })
          ] }),
          /* @__PURE__ */ e(Ae, { stats: Q })
        ]
      }
    )
  ] });
}
function k({
  title: t,
  value: o,
  icon: i,
  subtitle: n,
  color: a = "blue"
}) {
  return /* @__PURE__ */ r(
    "div",
    {
      className: `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",
        red: "bg-red-50 text-red-600 border-red-200 dark:bg-red-900/20 dark:border-red-800"
      }[a]}`,
      style: { borderRadius: "var(--radius-card)" },
      children: [
        /* @__PURE__ */ r("div", { className: "flex items-center justify-between mb-2", children: [
          /* @__PURE__ */ e("span", { className: "text-sm font-medium opacity-80", children: t }),
          i
        ] }),
        /* @__PURE__ */ e("div", { className: "text-2xl font-bold", children: o }),
        n && /* @__PURE__ */ e("div", { className: "text-xs opacity-70 mt-1", children: n })
      ]
    }
  );
}
export {
  Ke as UserDashboardPage
};
//# sourceMappingURL=UserDashboardPage-BP5WeXPS.js.map
