import { jsx as e, jsxs as a, Fragment as E } from "react/jsx-runtime";
import { useState as n, useCallback as ce, useEffect as le } from "react";
import { useNavigate as ie } from "react-router-dom";
import { useTranslation as de } from "react-i18next";
import { x as oe, aw as me, a as he, ax as x, ay as ve, az as L, P as ge, K as u } from "./index-CeEMms9z.js";
import { Loader2 as pe, Info as xe, ExternalLink as ue, RefreshCw as T, Headphones as be, TrendingUp as fe, Clock as Ne, CheckCircle as ye, AlertTriangle as I, Star as $, XCircle as we, Users as Se, LayoutDashboard as ke } from "lucide-react";
import { t as Ce } from "./ticketingApi-DzUOPQNd.js";
const Re = {
  Low: "var(--info-text)",
  Medium: "var(--warning-text)",
  High: "var(--warning-text)",
  Critical: "var(--error-text)"
}, Te = {
  Open: "var(--warning-text)",
  InProgress: "var(--info-text)",
  OnHold: "var(--warning-text)",
  Resolved: "var(--success-text)",
  Closed: "var(--text-secondary)",
  Rejected: "var(--error-text)"
};
function Le() {
  const { t } = de("support"), i = ie(), { hasPermission: g } = oe(), { isGlpi: r, glpiBaseUrl: b } = me(), { currentTenant: P } = he(), [F, H] = n(!0), [D, A] = n(!1), [m, G] = n(30), k = g("support.sla.read"), [d, O] = n(null), [B, U] = n([]), [M, z] = n([]), [C, K] = n([]), [V, X] = n([]), [v, _] = n(null), [o, q] = n(null), [N, J] = n([]), [y, Q] = n([]), [c, Y] = n(null), [w, j] = n(!1), S = ce(async () => {
    try {
      const [
        s,
        l,
        h,
        p,
        f,
        se,
        re
      ] = await Promise.all([
        x.getOverview(m),
        x.getByStatus(),
        x.getByPriority(),
        x.getAgentWorkload(),
        x.getTrends(m),
        x.getSatisfactionStats(m),
        x.getSlaCompliance(m)
      ]);
      if (O(s), U(l), z(h), K(p), X(f), _(se), q(re), r)
        try {
          const R = await ve.tickets.getGlpiSyncStats();
          Y(R);
        } catch {
        }
      if (k) {
        const [R, ne] = await Promise.all([
          L.getBreachedTickets(),
          L.getTicketsApproachingBreach(60)
        ]);
        J(R), Q(ne);
      }
    } catch (s) {
      console.error("Failed to load dashboard data:", s);
    } finally {
      H(!1), A(!1);
    }
  }, [m, k, r]);
  le(() => {
    S();
  }, [S]);
  const Z = () => {
    A(!0), S();
  }, ee = async () => {
    if (!(!P?.id || w)) {
      j(!0);
      try {
        await Ce.triggerSync(P.id), await S();
      } catch {
      } finally {
        j(!1);
      }
    }
  };
  if (F)
    return /* @__PURE__ */ e("div", { className: "flex items-center justify-center min-h-[400px]", children: /* @__PURE__ */ e(pe, { className: "w-8 h-8 animate-spin text-[var(--info-dot)]" }) });
  const ae = (s) => s >= 95 ? "text-[var(--success-text)]" : s >= 80 ? "text-[var(--warning-text)]" : "text-[var(--error-text)]", te = (s) => s >= 4 ? "text-[var(--success-text)]" : s >= 3 ? "text-[var(--warning-text)]" : "text-[var(--error-text)]";
  return /* @__PURE__ */ a(
    ge,
    {
      title: t("dashboard.title"),
      subtitle: t("dashboard.subtitle"),
      icon: /* @__PURE__ */ e(ke, { className: "w-6 h-6" }),
      breadcrumbs: [
        { label: t("title", "Support"), href: "/support" },
        { label: t("dashboard.title", "Dashboard") }
      ],
      actions: /* @__PURE__ */ a(E, { children: [
        /* @__PURE__ */ a(
          "select",
          {
            value: m,
            onChange: (s) => G(Number(s.target.value)),
            className: "input",
            children: [
              /* @__PURE__ */ e("option", { value: 7, children: t("dashboard.period7") }),
              /* @__PURE__ */ e("option", { value: 30, children: t("dashboard.period30") }),
              /* @__PURE__ */ e("option", { value: 90, children: t("dashboard.period90") })
            ]
          }
        ),
        /* @__PURE__ */ a(
          "button",
          {
            onClick: Z,
            disabled: D,
            className: "btn btn-secondary flex items-center gap-2",
            children: [
              /* @__PURE__ */ e(T, { className: `w-4 h-4 ${D ? "animate-spin" : ""}` }),
              t("dashboard.refresh")
            ]
          }
        )
      ] }),
      children: [
        r && /* @__PURE__ */ a("div", { className: "flex items-center gap-3 p-4 rounded-lg bg-[var(--info-bg)] border border-[var(--info-border)] text-[var(--info-text)]", children: [
          /* @__PURE__ */ e(xe, { className: "w-5 h-5 flex-shrink-0" }),
          /* @__PURE__ */ a("div", { className: "flex-1", children: [
            /* @__PURE__ */ e("p", { className: "font-medium", children: t("glpi.managedByGlpi") }),
            /* @__PURE__ */ e("p", { className: "text-sm opacity-80", children: t("glpi.dashboardSyncInfo") })
          ] }),
          b && /* @__PURE__ */ a(
            "a",
            {
              href: b,
              target: "_blank",
              rel: "noopener noreferrer",
              className: "btn btn-secondary flex items-center gap-2 text-sm",
              children: [
                /* @__PURE__ */ e(ue, { className: "w-4 h-4" }),
                t("glpi.openGlpi")
              ]
            }
          )
        ] }),
        r && c && /* @__PURE__ */ a("div", { className: "card p-4 space-y-4", children: [
          /* @__PURE__ */ a("div", { className: "flex items-center justify-between", children: [
            /* @__PURE__ */ a("div", { children: [
              /* @__PURE__ */ a("h3", { className: "font-semibold flex items-center gap-2", children: [
                /* @__PURE__ */ e(T, { className: "w-5 h-5" }),
                t("glpi.sync.title", "GLPI Sync Status")
              ] }),
              /* @__PURE__ */ e("p", { className: "text-sm text-[var(--text-secondary)]", children: t("glpi.sync.subtitle", "Synchronization overview with GLPI") })
            ] }),
            /* @__PURE__ */ a(
              "button",
              {
                onClick: ee,
                disabled: w,
                className: "btn btn-secondary flex items-center gap-2",
                children: [
                  /* @__PURE__ */ e(T, { className: `w-4 h-4 ${w ? "animate-spin" : ""}` }),
                  w ? t("glpi.sync.syncing", "Syncing...") : t("glpi.sync.triggerSync", "Sync Now")
                ]
              }
            )
          ] }),
          /* @__PURE__ */ a("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4", children: [
            /* @__PURE__ */ a("div", { className: "card p-4 text-center border bg-[var(--success-bg)] text-[var(--success-text)] border-[var(--success-border)]", children: [
              /* @__PURE__ */ e("div", { className: "text-2xl font-bold", children: c.totalMappedTickets }),
              /* @__PURE__ */ e("div", { className: "text-sm opacity-80", children: t("glpi.sync.totalSynced", "Total Synced") })
            ] }),
            /* @__PURE__ */ a("div", { className: "card p-4 text-center border bg-[var(--success-bg)] text-[var(--success-text)] border-[var(--success-border)]", children: [
              /* @__PURE__ */ e("div", { className: "text-2xl font-bold", children: c.ticketsSyncedOk }),
              /* @__PURE__ */ e("div", { className: "text-sm opacity-80", children: t("glpi.sync.syncSuccess", "Successful") })
            ] }),
            /* @__PURE__ */ a("div", { className: "card p-4 text-center border bg-[var(--error-bg)] text-[var(--error-text)] border-[var(--error-border)]", children: [
              /* @__PURE__ */ e("div", { className: "text-2xl font-bold", children: c.ticketsWithSyncErrors }),
              /* @__PURE__ */ e("div", { className: "text-sm opacity-80", children: t("glpi.sync.syncErrors", "Errors") })
            ] }),
            /* @__PURE__ */ a("div", { className: `card p-4 text-center border ${c.successRate >= 90 ? "bg-[var(--success-bg)] text-[var(--success-text)] border-[var(--success-border)]" : "bg-[var(--error-bg)] text-[var(--error-text)] border-[var(--error-border)]"}`, children: [
              /* @__PURE__ */ a("div", { className: "text-2xl font-bold", children: [
                c.successRate,
                "%"
              ] }),
              /* @__PURE__ */ e("div", { className: "text-sm opacity-80", children: t("glpi.sync.successRate", "Success Rate") })
            ] })
          ] }),
          /* @__PURE__ */ a("div", { className: "flex items-center gap-6 text-sm text-[var(--text-secondary)]", children: [
            /* @__PURE__ */ a("div", { children: [
              /* @__PURE__ */ a("span", { className: "font-medium", children: [
                t("glpi.sync.lastSync", "Last Sync"),
                ":"
              ] }),
              " ",
              c.lastSyncAt ? new Date(c.lastSyncAt).toLocaleString() : t("glpi.sync.never", "Never")
            ] }),
            /* @__PURE__ */ a("div", { children: [
              /* @__PURE__ */ a("span", { className: "font-medium", children: [
                t("glpi.sync.syncInterval", "Interval"),
                ":"
              ] }),
              " ",
              t("glpi.sync.everyNMinutes", "Every {{n}} min", { n: c.syncIntervalMinutes })
            ] }),
            /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e("span", { className: `px-2 py-0.5 rounded text-xs font-medium ${c.syncEnabled ? "bg-[var(--success-bg)] text-[var(--success-text)]" : "bg-[var(--bg-secondary)] text-[var(--text-secondary)]"}`, children: c.syncEnabled ? t("glpi.sync.enabled", "Enabled") : t("glpi.sync.disabled", "Disabled") }) })
          ] }),
          c.lastSyncError && /* @__PURE__ */ a("div", { className: "p-3 rounded-lg bg-[var(--error-bg)] border border-[var(--error-border)]", children: [
            /* @__PURE__ */ e("p", { className: "text-sm font-medium text-[var(--error-text)]", children: t("glpi.sync.lastError", "Last Sync Error") }),
            /* @__PURE__ */ e("p", { className: "text-sm text-[var(--error-text)] opacity-80 mt-1", children: c.lastSyncError })
          ] })
        ] }),
        /* @__PURE__ */ a("div", { className: "grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4", children: [
          /* @__PURE__ */ e(
            u,
            {
              title: t("dashboard.totalTickets"),
              value: d?.totalTickets ?? 0,
              icon: /* @__PURE__ */ e(be, { className: "w-5 h-5" }),
              accent: "primary"
            }
          ),
          /* @__PURE__ */ e(
            u,
            {
              title: t("dashboard.newTickets"),
              value: d?.newTickets ?? 0,
              icon: /* @__PURE__ */ e(fe, { className: "w-5 h-5" }),
              accent: 5,
              subtitle: t("dashboard.lastNDays", { period: m })
            }
          ),
          /* @__PURE__ */ e(
            u,
            {
              title: t("dashboard.openTickets"),
              value: d?.openTickets ?? 0,
              icon: /* @__PURE__ */ e(Ne, { className: "w-5 h-5" }),
              accent: 3
            }
          ),
          /* @__PURE__ */ e(
            u,
            {
              title: t("dashboard.resolvedTickets"),
              value: d?.resolvedTickets ?? 0,
              icon: /* @__PURE__ */ e(ye, { className: "w-5 h-5" }),
              accent: 5,
              subtitle: t("dashboard.lastNDays", { period: m })
            }
          ),
          /* @__PURE__ */ e(
            u,
            {
              title: t("dashboard.slaCompliance"),
              value: `${d?.slaCompliancePercentage?.toFixed(1) ?? 0}%`,
              icon: /* @__PURE__ */ e(I, { className: "w-5 h-5" }),
              accent: (d?.slaCompliancePercentage ?? 0) >= 90 ? 5 : void 0,
              trend: (d?.slaCompliancePercentage ?? 0) < 90 ? { value: `${d?.slaCompliancePercentage?.toFixed(1)}%`, direction: "down" } : void 0
            }
          ),
          /* @__PURE__ */ e(
            u,
            {
              title: t("dashboard.avgSatisfaction"),
              value: `${d?.averageSatisfaction?.toFixed(1) ?? 0}/5`,
              icon: /* @__PURE__ */ e($, { className: "w-5 h-5" }),
              accent: (d?.averageSatisfaction ?? 0) >= 4 ? 5 : 3
            }
          )
        ] }),
        k && (N.length > 0 || y.length > 0) && /* @__PURE__ */ a("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-4", children: [
          N.length > 0 && /* @__PURE__ */ a("div", { className: "card p-4 border-l-4 border-[var(--error-border)]", children: [
            /* @__PURE__ */ a("h3", { className: "font-semibold text-[var(--error-text)] flex items-center gap-2 mb-3", children: [
              /* @__PURE__ */ e(we, { className: "w-5 h-5" }),
              t("dashboard.slaBreached"),
              " (",
              N.length,
              ")"
            ] }),
            /* @__PURE__ */ e("div", { className: "space-y-2 max-h-40 overflow-y-auto", children: N.slice(0, 5).map((s) => /* @__PURE__ */ a(
              "button",
              {
                type: "button",
                className: "w-full flex items-center justify-between p-2 bg-[var(--error-bg)]/20 rounded cursor-pointer hover:opacity-80 text-left",
                onClick: () => i(`/support/tickets/${s.ticketId}`),
                children: [
                  /* @__PURE__ */ a("div", { children: [
                    /* @__PURE__ */ e("span", { className: "font-mono text-sm", children: s.ticketNumber }),
                    /* @__PURE__ */ e("span", { className: "ml-2 text-sm", children: s.ticketTitle })
                  ] }),
                  /* @__PURE__ */ a("span", { className: "text-xs text-[var(--error-text)] font-medium", children: [
                    s.responseBreached && "Response",
                    " ",
                    s.resolutionBreached && "Resolution"
                  ] })
                ]
              },
              s.id
            )) })
          ] }),
          y.length > 0 && /* @__PURE__ */ a("div", { className: "card p-4 border-l-4 border-[var(--warning-border)]", children: [
            /* @__PURE__ */ a("h3", { className: "font-semibold text-[var(--warning-text)] flex items-center gap-2 mb-3", children: [
              /* @__PURE__ */ e(I, { className: "w-5 h-5" }),
              t("dashboard.approachingBreach"),
              " (",
              y.length,
              ")"
            ] }),
            /* @__PURE__ */ e("div", { className: "space-y-2 max-h-40 overflow-y-auto", children: y.slice(0, 5).map((s) => /* @__PURE__ */ a(
              "button",
              {
                type: "button",
                className: "w-full flex items-center justify-between p-2 bg-[var(--warning-bg)]/20 rounded cursor-pointer hover:opacity-80 text-left",
                onClick: () => i(`/support/tickets/${s.ticketId}`),
                children: [
                  /* @__PURE__ */ a("div", { children: [
                    /* @__PURE__ */ e("span", { className: "font-mono text-sm", children: s.ticketNumber }),
                    /* @__PURE__ */ e("span", { className: "ml-2 text-sm", children: s.ticketTitle })
                  ] }),
                  /* @__PURE__ */ a("span", { className: "text-xs text-[var(--warning-text)] font-medium", children: [
                    Math.round(s.responseSlaPercentage),
                    "% Response"
                  ] })
                ]
              },
              s.id
            )) })
          ] })
        ] }),
        /* @__PURE__ */ a("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6", children: [
          /* @__PURE__ */ a("div", { className: "card p-4", children: [
            /* @__PURE__ */ e("h3", { className: "font-semibold mb-4", children: t("dashboard.ticketsByStatus") }),
            /* @__PURE__ */ e("div", { className: "space-y-3", children: B.map((s) => {
              const l = B.reduce((p, f) => p + f.count, 0), h = l > 0 ? s.count / l * 100 : 0;
              return /* @__PURE__ */ a("div", { className: "flex items-center gap-3", children: [
                /* @__PURE__ */ e("div", { className: "w-24 text-sm", children: s.status }),
                /* @__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: Te[s.status] || "#6b7280"
                    }
                  }
                ) }),
                /* @__PURE__ */ e("div", { className: "w-16 text-right text-sm font-medium", children: s.count })
              ] }, s.status);
            }) })
          ] }),
          /* @__PURE__ */ a("div", { className: "card p-4", children: [
            /* @__PURE__ */ e("h3", { className: "font-semibold mb-4", children: t("dashboard.activeTicketsByPriority") }),
            /* @__PURE__ */ e("div", { className: "space-y-3", children: M.map((s) => {
              const l = M.reduce((p, f) => p + f.count, 0), h = l > 0 ? s.count / l * 100 : 0;
              return /* @__PURE__ */ a("div", { className: "flex items-center gap-3", children: [
                /* @__PURE__ */ e("div", { className: "w-24 text-sm", children: s.priority }),
                /* @__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: Re[s.priority] || "#6b7280"
                    }
                  }
                ) }),
                /* @__PURE__ */ e("div", { className: "w-16 text-right text-sm font-medium", children: s.count })
              ] }, s.priority);
            }) })
          ] })
        ] }),
        /* @__PURE__ */ a("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-6", children: [
          /* @__PURE__ */ a("div", { className: "card p-4", children: [
            /* @__PURE__ */ e("h3", { className: "font-semibold mb-4", children: t("dashboard.slaPerformance") }),
            o && /* @__PURE__ */ a(E, { children: [
              /* @__PURE__ */ a("div", { className: "grid grid-cols-2 gap-4", children: [
                /* @__PURE__ */ a("div", { className: "text-center p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
                  /* @__PURE__ */ a("div", { className: `text-3xl font-bold ${ae(o.compliancePercentage)}`, children: [
                    o.compliancePercentage.toFixed(1),
                    "%"
                  ] }),
                  /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-secondary)]", children: t("dashboard.complianceRate") })
                ] }),
                /* @__PURE__ */ a("div", { className: "text-center p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
                  /* @__PURE__ */ e("div", { className: "text-3xl font-bold", children: o.ticketsWithinSla }),
                  /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-secondary)]", children: t("dashboard.withinSla") })
                ] }),
                /* @__PURE__ */ a("div", { className: "text-center p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
                  /* @__PURE__ */ e("div", { className: "text-3xl font-bold text-[var(--error-text)]", children: o.ticketsBreached }),
                  /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-secondary)]", children: t("dashboard.breached") })
                ] }),
                /* @__PURE__ */ a("div", { className: "space-y-2 p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
                  /* @__PURE__ */ a("div", { className: "flex justify-between text-sm", children: [
                    /* @__PURE__ */ a("span", { children: [
                      t("dashboard.avgResponse"),
                      ":"
                    ] }),
                    /* @__PURE__ */ e("span", { className: "font-medium", children: W(o.averageResponseMinutes) })
                  ] }),
                  /* @__PURE__ */ a("div", { className: "flex justify-between text-sm", children: [
                    /* @__PURE__ */ a("span", { children: [
                      t("dashboard.avgResolution"),
                      ":"
                    ] }),
                    /* @__PURE__ */ e("span", { className: "font-medium", children: W(o.averageResolutionMinutes) })
                  ] })
                ] })
              ] }),
              /* @__PURE__ */ a("div", { className: "mt-4 pt-3 border-t border-[var(--border-color)] flex items-center justify-between text-sm", children: [
                /* @__PURE__ */ e("span", { className: "text-[var(--text-secondary)]", children: t("dashboard.slaCoverage") }),
                /* @__PURE__ */ a("span", { className: "font-medium", children: [
                  o.slaCoveragePercentage.toFixed(1),
                  "%",
                  o.ticketsWithoutSla > 0 && /* @__PURE__ */ a("span", { className: "ml-2 text-[var(--warning-text)]", children: [
                    "· ",
                    t("dashboard.ticketsWithoutSla", { count: o.ticketsWithoutSla })
                  ] })
                ] })
              ] })
            ] })
          ] }),
          /* @__PURE__ */ a("div", { className: "card p-4", children: [
            /* @__PURE__ */ e("h3", { className: "font-semibold mb-4", children: t("dashboard.customerSatisfaction") }),
            v && /* @__PURE__ */ a("div", { className: "grid grid-cols-2 gap-4", children: [
              /* @__PURE__ */ a("div", { className: "text-center p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
                /* @__PURE__ */ e("div", { className: `text-3xl font-bold ${te(v.averageRating)}`, children: v.averageRating.toFixed(1) }),
                /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-secondary)]", children: t("dashboard.averageRating") }),
                /* @__PURE__ */ e("div", { className: "flex justify-center mt-1", children: [1, 2, 3, 4, 5].map((s) => /* @__PURE__ */ e(
                  $,
                  {
                    className: `w-4 h-4 ${s <= Math.round(v.averageRating) ? "text-[var(--warning-text)] fill-[var(--warning-text)]" : "text-[var(--text-muted)]"}`
                  },
                  s
                )) })
              ] }),
              /* @__PURE__ */ a("div", { className: "text-center p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
                /* @__PURE__ */ e("div", { className: "text-3xl font-bold", children: v.totalResponses }),
                /* @__PURE__ */ e("div", { className: "text-sm text-[var(--text-secondary)]", children: t("dashboard.totalResponses") })
              ] }),
              /* @__PURE__ */ a("div", { className: "col-span-2 p-4 bg-[var(--bg-secondary)] rounded-lg", children: [
                /* @__PURE__ */ e("div", { className: "text-sm font-medium mb-2", children: t("dashboard.ratingDistribution") }),
                /* @__PURE__ */ e("div", { className: "space-y-1", children: [5, 4, 3, 2, 1].map((s) => {
                  const l = v.ratingDistribution[s] || 0, h = v.totalResponses > 0 ? l / v.totalResponses * 100 : 0;
                  return /* @__PURE__ */ a("div", { className: "flex items-center gap-2 text-sm", children: [
                    /* @__PURE__ */ e("span", { className: "w-4", children: s }),
                    /* @__PURE__ */ e($, { className: "w-3 h-3 text-[var(--warning-text)] fill-[var(--warning-text)]" }),
                    /* @__PURE__ */ e("div", { className: "flex-1 h-3 bg-[var(--bg-primary)] rounded-full overflow-hidden", children: /* @__PURE__ */ e(
                      "div",
                      {
                        className: "h-full bg-[var(--warning-text)] rounded-full",
                        style: { width: `${h}%` }
                      }
                    ) }),
                    /* @__PURE__ */ e("span", { className: "w-8 text-right text-xs", children: l })
                  ] }, s);
                }) })
              ] })
            ] })
          ] })
        ] }),
        /* @__PURE__ */ a("div", { className: "card p-4", children: [
          /* @__PURE__ */ e("h3", { className: "font-semibold mb-4", children: t("dashboard.ticketTrends", { period: m }) }),
          /* @__PURE__ */ e("div", { className: "h-64", children: /* @__PURE__ */ e($e, { data: V, t }) })
        ] }),
        /* @__PURE__ */ a("div", { className: "card p-4", children: [
          /* @__PURE__ */ a("h3", { className: "font-semibold mb-4 flex items-center gap-2", children: [
            /* @__PURE__ */ e(Se, { className: "w-5 h-5" }),
            t("dashboard.agentWorkload")
          ] }),
          C.length > 0 ? /* @__PURE__ */ e("div", { className: "overflow-x-auto", children: /* @__PURE__ */ a("table", { className: "w-full", children: [
            /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ a("tr", { className: "border-b border-[var(--border-color)]", children: [
              /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium", children: t("dashboard.agent") }),
              /* @__PURE__ */ e("th", { className: "text-center p-3 font-medium", children: t("dashboard.total") }),
              /* @__PURE__ */ e("th", { className: "text-center p-3 font-medium", children: t("dashboard.open") }),
              /* @__PURE__ */ e("th", { className: "text-center p-3 font-medium", children: t("dashboard.inProgress") }),
              /* @__PURE__ */ e("th", { className: "text-center p-3 font-medium", children: t("dashboard.onHold") }),
              /* @__PURE__ */ e("th", { className: "text-left p-3 font-medium", children: t("dashboard.load") })
            ] }) }),
            /* @__PURE__ */ e("tbody", { children: C.map((s) => {
              const l = Math.max(...C.map((p) => p.totalAssigned)), h = l > 0 ? s.totalAssigned / l * 100 : 0;
              return /* @__PURE__ */ a("tr", { className: "border-b border-[var(--border-color)]", children: [
                /* @__PURE__ */ a("td", { className: "p-3", children: [
                  /* @__PURE__ */ e("div", { className: "font-medium", children: s.name }),
                  /* @__PURE__ */ e("div", { className: "text-xs text-[var(--text-secondary)]", children: s.email })
                ] }),
                /* @__PURE__ */ e("td", { className: "text-center p-3 font-semibold", children: s.totalAssigned }),
                /* @__PURE__ */ e("td", { className: "text-center p-3", children: /* @__PURE__ */ e("span", { className: "px-2 py-1 bg-[var(--warning-bg)] text-[var(--warning-text)] rounded-[var(--radius-badge)] text-sm", children: s.openCount }) }),
                /* @__PURE__ */ e("td", { className: "text-center p-3", children: /* @__PURE__ */ e("span", { className: "px-2 py-1 bg-[var(--info-bg)] text-[var(--info-text)] rounded-[var(--radius-badge)] text-sm", children: s.inProgressCount }) }),
                /* @__PURE__ */ e("td", { className: "text-center p-3", children: /* @__PURE__ */ e("span", { className: "px-2 py-1 bg-[var(--warning-bg)] text-[var(--warning-text)] rounded-[var(--radius-badge)] text-sm", children: s.onHoldCount }) }),
                /* @__PURE__ */ e("td", { className: "p-3 w-32", children: /* @__PURE__ */ e("div", { className: "h-2 bg-[var(--bg-secondary)] rounded-full overflow-hidden", children: /* @__PURE__ */ e(
                  "div",
                  {
                    className: "h-full bg-[var(--info-text)] rounded-full",
                    style: { width: `${h}%` }
                  }
                ) }) })
              ] }, s.userId);
            }) })
          ] }) }) : /* @__PURE__ */ e("div", { className: "text-center py-8 text-[var(--text-secondary)]", children: t("dashboard.noAgentsAssigned") })
        ] })
      ]
    }
  );
}
function $e({ data: t, t: i }) {
  if (t.length === 0)
    return /* @__PURE__ */ e("div", { className: "flex items-center justify-center h-full text-[var(--text-secondary)]", children: i("dashboard.noTrendData") });
  const g = Math.max(...t.flatMap((r) => [r.created, r.resolved]), 1);
  return /* @__PURE__ */ a("div", { className: "flex flex-col h-full", children: [
    /* @__PURE__ */ a("div", { className: "flex items-center gap-4 mb-4", children: [
      /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ e("div", { className: "w-3 h-3 rounded bg-[var(--info-text)]" }),
        /* @__PURE__ */ e("span", { className: "text-sm", children: i("dashboard.created") })
      ] }),
      /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ e("div", { className: "w-3 h-3 rounded bg-[var(--success-text)]" }),
        /* @__PURE__ */ e("span", { className: "text-sm", children: i("dashboard.resolved") })
      ] })
    ] }),
    /* @__PURE__ */ e("div", { className: "flex-1 flex items-end gap-1 overflow-x-auto pb-4", children: t.map((r) => /* @__PURE__ */ a("div", { className: "flex-1 min-w-[20px] flex gap-0.5", children: [
      /* @__PURE__ */ e(
        "div",
        {
          className: "flex-1 bg-[var(--info-text)] rounded-t transition-all duration-300 hover:opacity-80",
          style: { height: `${r.created / g * 100}%`, minHeight: r.created > 0 ? "4px" : "0" },
          title: `Created: ${r.created}`
        }
      ),
      /* @__PURE__ */ e(
        "div",
        {
          className: "flex-1 bg-[var(--success-text)] rounded-t transition-all duration-300 hover:opacity-80",
          style: { height: `${r.resolved / g * 100}%`, minHeight: r.resolved > 0 ? "4px" : "0" },
          title: `Resolved: ${r.resolved}`
        }
      )
    ] }, `${r.date}`)) }),
    /* @__PURE__ */ a("div", { className: "flex justify-between text-xs text-[var(--text-secondary)] mt-2", children: [
      /* @__PURE__ */ e("span", { children: t[0] && new Date(t[0].date).toLocaleDateString() }),
      /* @__PURE__ */ e("span", { children: t.at(-1) && new Date(t.at(-1).date).toLocaleDateString() })
    ] })
  ] });
}
function W(t) {
  if (t < 60) return `${Math.round(t)}m`;
  const i = Math.floor(t / 60), g = Math.round(t % 60);
  if (i < 24) return g > 0 ? `${i}h ${g}m` : `${i}h`;
  const r = Math.floor(i / 24), b = i % 24;
  return b > 0 ? `${r}d ${b}h` : `${r}d`;
}
export {
  Le as DashboardPage
};
//# sourceMappingURL=DashboardPage-Cd6wtlNM.js.map
