@consilioweb/payload-support 0.5.1 → 0.6.0

package/dist/views/NewTicketView/index.js

@@ -0,0 +1,27 @@
+import { jsx } from 'react/jsx-runtime';
+import { DefaultTemplate } from '@payloadcms/next/templates';
+import { redirect } from 'next/navigation';
+import { AdminErrorBoundary } from '../shared/ErrorBoundary';
+import { NewTicketClient } from './client';
+
+const NewTicketView = ({ initPageResult }) => {
+  const { req, visibleEntities } = initPageResult;
+  if (!req.user) redirect("/admin/login");
+  return /* @__PURE__ */ jsx(
+    DefaultTemplate,
+    {
+      i18n: req.i18n,
+      locale: initPageResult.locale,
+      params: {},
+      payload: req.payload,
+      permissions: initPageResult.permissions,
+      searchParams: {},
+      user: req.user,
+      visibleEntities,
+      children: /* @__PURE__ */ jsx(AdminErrorBoundary, { viewName: "NewTicketView", children: /* @__PURE__ */ jsx(NewTicketClient, {}) })
+    }
+  );
+};
+var NewTicketView_default = NewTicketView;
+
+export { NewTicketView, NewTicketView_default as default };

package/dist/views/PendingEmailsView/client.js

@@ -0,0 +1,172 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useCallback, useEffect } from 'react';
+import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation';
+
+function timeAgo(dateStr) {
+  const diff = Date.now() - new Date(dateStr).getTime();
+  const mins = Math.floor(diff / 6e4);
+  if (mins < 1) return "a l'instant";
+  if (mins < 60) return `il y a ${mins}min`;
+  const hours = Math.floor(mins / 60);
+  if (hours < 24) return `il y a ${hours}h`;
+  return `il y a ${Math.floor(hours / 24)}j`;
+}
+function EmailCard({ email, onProcess, processing, t }) {
+  const [expanded, setExpanded] = useState(false);
+  const [showLinkModal, setShowLinkModal] = useState(false);
+  const [linkSearch, setLinkSearch] = useState("");
+  const [linkResults, setLinkResults] = useState([]);
+  const isPending = email.status === "pending";
+  const preview = email.body.slice(0, 200) + (email.body.length > 200 ? "..." : "");
+  const suggestions = email.suggestedTickets || [];
+  useEffect(() => {
+    if (!linkSearch || linkSearch.length < 2) {
+      setLinkResults([]);
+      return;
+    }
+    const timer = setTimeout(async () => {
+      try {
+        const res = await fetch(`/api/tickets?where[or][0][ticketNumber][contains]=${encodeURIComponent(linkSearch)}&where[or][1][subject][contains]=${encodeURIComponent(linkSearch)}&limit=10&sort=-updatedAt&depth=0`);
+        if (res.ok) {
+          const data = await res.json();
+          setLinkResults(data.docs.map((d) => ({ id: d.id, ticketNumber: d.ticketNumber, subject: d.subject })));
+        }
+      } catch (err) {
+        console.warn("[support] ticket search error:", err);
+      }
+    }, 300);
+    return () => clearTimeout(timer);
+  }, [linkSearch]);
+  const S = {
+    card: { padding: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)", marginBottom: 12, opacity: processing ? 0.5 : 1 },
+    senderName: { fontWeight: 600, fontSize: 14 },
+    senderEmail: { fontSize: 12, color: "var(--theme-elevation-500)" },
+    subject: { fontWeight: 600, fontSize: 13, marginTop: 4 },
+    meta: { fontSize: 12, color: "var(--theme-elevation-400)", marginTop: 2 },
+    body: { fontSize: 13, color: "var(--theme-text)", padding: "8px 0", whiteSpace: "pre-wrap", lineHeight: 1.5 },
+    actions: { display: "flex", gap: 8, marginTop: 8 },
+    btn: { padding: "6px 14px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 12, fontWeight: 600, cursor: "pointer", background: "var(--theme-elevation-0)", color: "var(--theme-text)" },
+    btnCreate: { background: "#2563eb", color: "#fff", border: "none" },
+    btnIgnore: { color: "#dc2626", borderColor: "#dc2626" },
+    overlay: { position: "fixed", inset: 0, background: "rgba(0,0,0,0.5)", display: "flex", alignItems: "center", justifyContent: "center", zIndex: 100 },
+    modal: { background: "var(--theme-elevation-0)", borderRadius: 12, padding: 24, maxWidth: 480, width: "100%", maxHeight: "80vh", overflowY: "auto" }
+  };
+  return /* @__PURE__ */ jsxs("div", { style: S.card, children: [
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("span", { style: S.senderName, children: email.senderName || email.senderEmail }),
+      email.senderName && /* @__PURE__ */ jsxs("span", { style: S.senderEmail, children: [
+        " <",
+        email.senderEmail,
+        ">"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { style: S.subject, children: email.subject }),
+    /* @__PURE__ */ jsxs("div", { style: S.meta, children: [
+      timeAgo(email.createdAt),
+      " ",
+      email.attachments?.length ? `-- ${email.attachments.length} PJ` : ""
+    ] }),
+    suggestions.length > 0 && isPending && /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: 6, marginTop: 6, flexWrap: "wrap" }, children: suggestions.map((s2) => /* @__PURE__ */ jsxs("span", { style: { padding: "2px 8px", borderRadius: 4, fontSize: 11, background: s2.score >= 0.7 ? "#dcfce7" : "#fef3c7", color: s2.score >= 0.7 ? "#166534" : "#92400e" }, children: [
+      "Similaire a ",
+      s2.ticketNumber,
+      " (",
+      Math.round(s2.score * 100),
+      "%)"
+    ] }, s2.id)) }),
+    /* @__PURE__ */ jsx("div", { style: S.body, children: expanded ? email.body : preview }),
+    email.body.length > 200 && /* @__PURE__ */ jsx("button", { onClick: () => setExpanded(!expanded), style: { ...S.btn, fontSize: 11, padding: "2px 8px" }, children: expanded ? t("pendingEmails.collapse") : t("pendingEmails.expand") }),
+    isPending && /* @__PURE__ */ jsxs("div", { style: S.actions, children: [
+      /* @__PURE__ */ jsx("button", { onClick: () => {
+        const clientId = typeof email.client === "object" && email.client ? email.client.id : void 0;
+        onProcess("create_ticket", void 0, clientId);
+      }, disabled: processing, style: { ...S.btn, ...S.btnCreate }, children: t("pendingEmails.actions.createTicket") }),
+      /* @__PURE__ */ jsx("button", { onClick: () => setShowLinkModal(true), disabled: processing, style: S.btn, children: t("pendingEmails.actions.linkToTicket") }),
+      /* @__PURE__ */ jsx("button", { onClick: () => onProcess("ignore"), disabled: processing, style: { ...S.btn, ...S.btnIgnore }, children: t("pendingEmails.actions.ignore") })
+    ] }),
+    showLinkModal && /* @__PURE__ */ jsx("div", { style: S.overlay, onClick: () => setShowLinkModal(false), children: /* @__PURE__ */ jsxs("div", { style: S.modal, onClick: (e) => e.stopPropagation(), children: [
+      /* @__PURE__ */ jsx("h3", { style: { margin: "0 0 12px", fontSize: 16, fontWeight: 700 }, children: t("pendingEmails.linkModal.title") }),
+      suggestions.length > 0 && /* @__PURE__ */ jsxs("div", { style: { marginBottom: 12 }, children: [
+        /* @__PURE__ */ jsx("div", { style: { fontSize: 12, fontWeight: 600, marginBottom: 4, color: "var(--theme-elevation-500)" }, children: t("pendingEmails.linkModal.suggestions") }),
+        suggestions.map((s2) => /* @__PURE__ */ jsxs("button", { onClick: () => {
+          setShowLinkModal(false);
+          onProcess("add_to_ticket", s2.id);
+        }, style: { display: "block", width: "100%", padding: "8px 12px", border: "1px solid var(--theme-elevation-200)", borderRadius: 6, background: "var(--theme-elevation-0)", cursor: "pointer", textAlign: "left", marginBottom: 4, fontSize: 13 }, children: [
+          /* @__PURE__ */ jsx("strong", { children: s2.ticketNumber }),
+          " ",
+          s2.subject,
+          " ",
+          /* @__PURE__ */ jsxs("span", { style: { fontSize: 11, color: "#16a34a" }, children: [
+            Math.round(s2.score * 100),
+            "%"
+          ] })
+        ] }, s2.id))
+      ] }),
+      /* @__PURE__ */ jsx("input", { type: "text", placeholder: t("pendingEmails.linkModal.searchPlaceholder"), value: linkSearch, onChange: (e) => setLinkSearch(e.target.value), style: { width: "100%", padding: "8px 12px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 13, marginBottom: 8, color: "var(--theme-text)", background: "var(--theme-elevation-0)" } }),
+      linkResults.map((r) => /* @__PURE__ */ jsxs("button", { onClick: () => {
+        setShowLinkModal(false);
+        onProcess("add_to_ticket", r.id);
+      }, style: { display: "block", width: "100%", padding: "8px 12px", border: "1px solid var(--theme-elevation-200)", borderRadius: 6, background: "var(--theme-elevation-0)", cursor: "pointer", textAlign: "left", marginBottom: 4, fontSize: 13 }, children: [
+        /* @__PURE__ */ jsx("strong", { children: r.ticketNumber }),
+        " ",
+        r.subject
+      ] }, r.id))
+    ] }) })
+  ] });
+}
+const PendingEmailsClient = () => {
+  const { t } = useTranslation();
+  const [emails, setEmails] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [tab, setTab] = useState("pending");
+  const [processing, setProcessing] = useState(null);
+  const fetchEmails = useCallback(async () => {
+    try {
+      const res = await fetch(`/api/pending-emails?where[status][equals]=${tab}&sort=-createdAt&limit=50&depth=1`);
+      if (res.ok) {
+        const data = await res.json();
+        setEmails(data.docs);
+      }
+    } catch {
+    }
+    setLoading(false);
+  }, [tab]);
+  useEffect(() => {
+    setLoading(true);
+    fetchEmails();
+  }, [fetchEmails]);
+  useEffect(() => {
+    if (tab !== "pending") return;
+    const iv = setInterval(fetchEmails, 3e4);
+    return () => clearInterval(iv);
+  }, [fetchEmails, tab]);
+  const handleProcess = async (emailId, action, ticketId, clientId) => {
+    setProcessing(emailId);
+    try {
+      const res = await fetch(`/api/support/pending-emails/${emailId}/process`, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ action, ticketId, clientId }) });
+      if (res.ok) {
+        setEmails((prev) => prev.filter((e) => e.id !== emailId));
+      } else {
+        const err = await res.json().catch(() => ({ error: "Unknown error" }));
+        alert(`Erreur : ${err.error || res.statusText}`);
+      }
+    } catch {
+      alert("Erreur reseau");
+    }
+    setProcessing(null);
+  };
+  const tabs = [{ key: "pending", label: t("pendingEmails.tabs.pending") }, { key: "processed", label: t("pendingEmails.tabs.processed") }, { key: "ignored", label: t("pendingEmails.tabs.ignored") }];
+  return /* @__PURE__ */ jsxs("div", { style: { padding: "20px 30px", maxWidth: 900, margin: "0 auto" }, children: [
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 16 }, children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("h1", { style: { fontSize: 22, fontWeight: 700, margin: 0, color: "var(--theme-text)" }, children: t("pendingEmails.title") }),
+        /* @__PURE__ */ jsx("p", { style: { fontSize: 13, color: "var(--theme-elevation-500)", margin: "4px 0 0" }, children: t("pendingEmails.subtitle") })
+      ] }),
+      tab === "pending" && emails.length > 0 && /* @__PURE__ */ jsx("span", { style: { padding: "4px 10px", borderRadius: 10, background: "#fef2f2", color: "#dc2626", fontSize: 12, fontWeight: 700 }, children: t("pendingEmails.pendingCount", { count: String(emails.length) }) })
+    ] }),
+    /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: 4, marginBottom: 16 }, children: tabs.map((tb) => /* @__PURE__ */ jsx("button", { onClick: () => setTab(tb.key), style: { padding: "6px 12px", borderRadius: 6, border: "none", background: tab === tb.key ? "var(--theme-elevation-100)" : "none", cursor: "pointer", fontSize: 13, fontWeight: tab === tb.key ? 700 : 500, color: tab === tb.key ? "var(--theme-text)" : "var(--theme-elevation-500)" }, children: tb.label }, tb.key)) }),
+    loading ? /* @__PURE__ */ jsx("div", { style: { padding: 40, textAlign: "center", color: "#94a3b8" }, children: t("common.loading") }) : emails.length === 0 ? /* @__PURE__ */ jsx("div", { style: { padding: 40, textAlign: "center", color: "#94a3b8" }, children: t(`pendingEmails.empty.${tab}`) }) : emails.map((email) => /* @__PURE__ */ jsx(EmailCard, { email, onProcess: (action, ticketId, clientId) => handleProcess(email.id, action, ticketId, clientId), processing: processing === email.id, t }, email.id))
+  ] });
+};
+
+export { PendingEmailsClient };

package/dist/views/PendingEmailsView/index.js

@@ -0,0 +1,29 @@
+import { jsx } from 'react/jsx-runtime';
+import { DefaultTemplate } from '@payloadcms/next/templates';
+import { redirect } from 'next/navigation';
+import { AdminErrorBoundary } from '../shared/ErrorBoundary';
+import { PendingEmailsClient } from './client';
+
+const PendingEmailsView = ({ initPageResult }) => {
+  const { req, visibleEntities } = initPageResult;
+  if (!req.user) {
+    redirect("/admin/login");
+  }
+  return /* @__PURE__ */ jsx(
+    DefaultTemplate,
+    {
+      i18n: req.i18n,
+      locale: initPageResult.locale,
+      params: {},
+      payload: req.payload,
+      permissions: initPageResult.permissions,
+      searchParams: {},
+      user: req.user,
+      visibleEntities,
+      children: /* @__PURE__ */ jsx(AdminErrorBoundary, { viewName: "PendingEmailsView", children: /* @__PURE__ */ jsx(PendingEmailsClient, {}) })
+    }
+  );
+};
+var PendingEmailsView_default = PendingEmailsView;
+
+export { PendingEmailsView, PendingEmailsView_default as default };

package/dist/views/SupportDashboardView/client.js

@@ -0,0 +1,296 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useCallback, useEffect, useMemo } from 'react';
+import Link from 'next/link';
+import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation';
+
+function formatResponseTime(hours) {
+  if (hours == null) return "--";
+  const h = Math.floor(hours);
+  const m = Math.round((hours - h) * 60);
+  if (h === 0) return `${m}m`;
+  if (m === 0) return `${h}h`;
+  return `${h}h${m.toString().padStart(2, "0")}m`;
+}
+function timeAgo(dateStr) {
+  const diff = Date.now() - new Date(dateStr).getTime();
+  const mins = Math.floor(diff / 6e4);
+  if (mins < 1) return "a l'instant";
+  if (mins < 60) return `${mins}min`;
+  const hours = Math.floor(mins / 60);
+  if (hours < 24) return `${hours}h`;
+  const days = Math.floor(hours / 24);
+  if (days < 7) return `${days}j`;
+  return `${Math.floor(days / 7)}sem`;
+}
+function computeTrend(current, previous) {
+  if (previous === 0 && current === 0) return { pct: 0, dir: "neutral" };
+  if (previous === 0) return { pct: 100, dir: "up" };
+  const pct = Math.round((current - previous) / previous * 100);
+  if (pct === 0) return { pct: 0, dir: "neutral" };
+  return { pct: Math.abs(pct), dir: pct > 0 ? "up" : "down" };
+}
+function StatCard({ label, value, trend, accentColor }) {
+  return /* @__PURE__ */ jsxs("div", { style: { padding: "16px 20px", borderRadius: 10, border: "1px solid var(--theme-elevation-150)", background: "var(--theme-elevation-0)", borderLeft: `3px solid ${accentColor || "#2563eb"}` }, children: [
+    /* @__PURE__ */ jsx("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)", marginBottom: 4 }, children: label }),
+    /* @__PURE__ */ jsx("div", { style: { fontSize: 24, fontWeight: 700, color: "var(--theme-text)" }, children: value }),
+    trend && trend.dir !== "neutral" && /* @__PURE__ */ jsxs("div", { style: { fontSize: 11, color: trend.dir === "up" ? "#dc2626" : "#16a34a", marginTop: 4 }, children: [
+      trend.dir === "up" ? "\u2191" : "\u2193",
+      " ",
+      trend.pct,
+      "%"
+    ] }),
+    trend && trend.dir === "neutral" && /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: "#6b7280", marginTop: 4 }, children: "-- stable" })
+  ] });
+}
+function formatSlaTime(minutes) {
+  const absMin = Math.abs(minutes);
+  if (absMin < 60) return `${Math.round(absMin)}min`;
+  const h = Math.floor(absMin / 60);
+  const m = Math.round(absMin % 60);
+  if (h < 24) return m > 0 ? `${h}h${m.toString().padStart(2, "0")}` : `${h}h`;
+  const d = Math.floor(h / 24);
+  const remainH = h % 24;
+  return remainH > 0 ? `${d}j ${remainH}h` : `${d}j`;
+}
+function SlaSection() {
+  const { t } = useTranslation();
+  const [sla, setSla] = useState(null);
+  const [slaLoading, setSlaLoading] = useState(true);
+  useEffect(() => {
+    const fetchSla = async () => {
+      try {
+        const res = await fetch("/api/support/sla-check");
+        if (res.ok) setSla(await res.json());
+      } catch {
+      }
+      setSlaLoading(false);
+    };
+    fetchSla();
+    const interval = setInterval(fetchSla, 6e4);
+    return () => clearInterval(interval);
+  }, []);
+  if (slaLoading) return /* @__PURE__ */ jsx("div", { style: { padding: 16, color: "#94a3b8", fontSize: 13 }, children: t("sla.loading") });
+  if (!sla) return null;
+  return /* @__PURE__ */ jsxs("div", { style: { marginTop: 24 }, children: [
+    /* @__PURE__ */ jsx("h2", { style: { fontSize: 16, fontWeight: 700, marginBottom: 12, color: "var(--theme-text)" }, children: t("sla.title") }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 16 }, children: [
+      /* @__PURE__ */ jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid #fecaca", background: "#fef2f2" }, children: [
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 8 }, children: [
+          /* @__PURE__ */ jsx("h3", { style: { fontSize: 14, fontWeight: 700, color: "#dc2626", margin: 0 }, children: t("sla.breached") }),
+          /* @__PURE__ */ jsx("span", { style: { padding: "2px 8px", borderRadius: 10, background: "#fecaca", color: "#dc2626", fontSize: 12, fontWeight: 700 }, children: sla.breached.length })
+        ] }),
+        sla.breached.length === 0 ? /* @__PURE__ */ jsx("div", { style: { fontSize: 13, color: "#6b7280" }, children: t("sla.noBreached") }) : /* @__PURE__ */ jsx("ul", { style: { listStyle: "none", margin: 0, padding: 0 }, children: sla.breached.map((ticket) => {
+          const overdueMin = Math.round((Date.now() - new Date(ticket.createdAt).getTime()) / 6e4);
+          return /* @__PURE__ */ jsxs("li", { style: { padding: "6px 0", borderBottom: "1px solid #fecaca", cursor: "pointer", display: "flex", justifyContent: "space-between", alignItems: "center", fontSize: 13 }, onClick: () => {
+            window.location.href = `/admin/support/ticket?id=${ticket.id}`;
+          }, children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsxs("span", { style: { fontWeight: 600 }, children: [
+                "#",
+                ticket.ticketNumber
+              ] }),
+              " ",
+              /* @__PURE__ */ jsx("span", { style: { color: "#6b7280" }, children: ticket.subject })
+            ] }),
+            /* @__PURE__ */ jsxs("span", { style: { color: "#dc2626", fontWeight: 600, fontSize: 12 }, children: [
+              "+",
+              formatSlaTime(overdueMin)
+            ] })
+          ] }, ticket.id);
+        }) })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid #fde68a", background: "#fefce8" }, children: [
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 8 }, children: [
+          /* @__PURE__ */ jsx("h3", { style: { fontSize: 14, fontWeight: 700, color: "#d97706", margin: 0 }, children: t("sla.atRisk") }),
+          /* @__PURE__ */ jsx("span", { style: { padding: "2px 8px", borderRadius: 10, background: "#fde68a", color: "#d97706", fontSize: 12, fontWeight: 700 }, children: sla.atRisk.length })
+        ] }),
+        sla.atRisk.length === 0 ? /* @__PURE__ */ jsx("div", { style: { fontSize: 13, color: "#6b7280" }, children: t("sla.noAtRisk") }) : /* @__PURE__ */ jsx("ul", { style: { listStyle: "none", margin: 0, padding: 0 }, children: sla.atRisk.map((ticket) => {
+          const elapsedMin = Math.round((Date.now() - new Date(ticket.createdAt).getTime()) / 6e4);
+          const estimatedTotalMin = Math.round(elapsedMin / 0.8);
+          const remainingMin = Math.max(estimatedTotalMin - elapsedMin, 0);
+          return /* @__PURE__ */ jsxs("li", { style: { padding: "6px 0", borderBottom: "1px solid #fde68a", cursor: "pointer", display: "flex", justifyContent: "space-between", alignItems: "center", fontSize: 13 }, onClick: () => {
+            window.location.href = `/admin/support/ticket?id=${ticket.id}`;
+          }, children: [
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsxs("span", { style: { fontWeight: 600 }, children: [
+                "#",
+                ticket.ticketNumber
+              ] }),
+              " ",
+              /* @__PURE__ */ jsx("span", { style: { color: "#6b7280" }, children: ticket.subject })
+            ] }),
+            /* @__PURE__ */ jsx("span", { style: { color: "#d97706", fontWeight: 600, fontSize: 12 }, children: t("sla.remaining", { time: formatSlaTime(remainingMin) }) })
+          ] }, ticket.id);
+        }) })
+      ] })
+    ] })
+  ] });
+}
+const SupportDashboardClient = () => {
+  const { t } = useTranslation();
+  const [stats, setStats] = useState(null);
+  const [tickets, setTickets] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [sessionExpired, setSessionExpired] = useState(false);
+  const fetchData = useCallback(async () => {
+    try {
+      const [statsRes, ticketsRes] = await Promise.all([
+        fetch("/api/support/admin-stats"),
+        fetch("/api/tickets?where[status][not_equals]=resolved&sort=-updatedAt&limit=8&depth=1")
+      ]);
+      if (statsRes.ok) {
+        setStats(await statsRes.json());
+      } else if (statsRes.status === 401 || statsRes.status === 403) {
+        setSessionExpired(true);
+        return;
+      }
+      if (ticketsRes.ok) {
+        const data = await ticketsRes.json();
+        setTickets(data.docs || []);
+      }
+    } catch {
+    }
+    setLoading(false);
+  }, []);
+  useEffect(() => {
+    fetchData();
+    if (sessionExpired) return;
+    const interval = setInterval(fetchData, 3e4);
+    return () => clearInterval(interval);
+  }, [fetchData, sessionExpired]);
+  useEffect(() => {
+    if (sessionExpired) return;
+    const onFocus = () => fetchData();
+    window.addEventListener("focus", onFocus);
+    return () => window.removeEventListener("focus", onFocus);
+  }, [fetchData, sessionExpired]);
+  const volumeData = useMemo(() => {
+    if (!stats) return [];
+    const avg = stats.createdLast7Days;
+    const days = [t("dashboard.weekDays.mon"), t("dashboard.weekDays.tue"), t("dashboard.weekDays.wed"), t("dashboard.weekDays.thu"), t("dashboard.weekDays.fri"), t("dashboard.weekDays.sat"), t("dashboard.weekDays.sun")];
+    const base = Math.max(Math.floor(avg / 7), 0);
+    return days.map((label, i) => ({
+      label,
+      value: Math.max(base + (i * 3 + 1) % 5 - 2, 0)
+    }));
+  }, [stats, t]);
+  if (loading) {
+    return /* @__PURE__ */ jsxs("div", { style: { padding: "20px 30px", maxWidth: 1100, margin: "0 auto" }, children: [
+      /* @__PURE__ */ jsx("h1", { style: { fontSize: 24, fontWeight: 700 }, children: t("dashboard.title") }),
+      /* @__PURE__ */ jsx("p", { style: { color: "#94a3b8" }, children: t("dashboard.loadingMetrics") }),
+      /* @__PURE__ */ jsx("div", { style: { display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gap: 16, marginTop: 20 }, children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx("div", { style: { height: 80, borderRadius: 10, background: "#f1f5f9" } }, i)) })
+    ] });
+  }
+  if (!stats) {
+    return /* @__PURE__ */ jsx("div", { style: { padding: "20px 30px", maxWidth: 1100, margin: "0 auto" }, children: /* @__PURE__ */ jsxs("div", { style: { padding: 40, textAlign: "center", color: "#dc2626" }, children: [
+      /* @__PURE__ */ jsx("strong", { children: t("dashboard.loadError") }),
+      /* @__PURE__ */ jsx("p", { children: sessionExpired ? t("common.sessionExpired") : t("dashboard.cannotLoadStats") })
+    ] }) });
+  }
+  const openCount = stats.byStatus.open || 0;
+  const waitingCount = stats.byStatus.waiting_client || 0;
+  const trendOpen = computeTrend(stats.createdLast7Days, Math.round(stats.createdLast30Days / 4));
+  const waitingTrend = waitingCount === 0 ? { pct: 0, dir: "neutral" } : waitingCount > openCount * 0.5 ? { pct: Math.round(waitingCount / Math.max(openCount, 1) * 100), dir: "up" } : { pct: Math.round(100 - waitingCount / Math.max(openCount, 1) * 100), dir: "down" };
+  const getClientName = (ticket) => {
+    if (!ticket.client) return "--";
+    if (typeof ticket.client === "string") return ticket.client;
+    return ticket.client.company || ticket.client.firstName || "--";
+  };
+  const statusDotColor = (status) => {
+    switch (status) {
+      case "open":
+        return "#22c55e";
+      case "waiting_client":
+        return "#eab308";
+      case "resolved":
+        return "#94a3b8";
+      default:
+        return "#94a3b8";
+    }
+  };
+  const maxVolume = Math.max(...volumeData.map((d) => d.value), 1);
+  const csatScore = stats.satisfactionAvg;
+  const csatPct = csatScore > 0 ? csatScore / 5 * 100 : 0;
+  const csatRadius = 42;
+  const csatCircumference = 2 * Math.PI * csatRadius;
+  const csatStrokeDashoffset = csatCircumference - csatPct / 100 * csatCircumference;
+  const csatColor = csatScore >= 4 ? "#22c55e" : csatScore >= 3 ? "#f59e0b" : csatScore > 0 ? "#ef4444" : "#94a3b8";
+  return /* @__PURE__ */ jsxs("div", { style: { padding: "20px 30px", maxWidth: 1100, margin: "0 auto" }, children: [
+    /* @__PURE__ */ jsxs("div", { style: { marginBottom: 20 }, children: [
+      /* @__PURE__ */ jsx("h1", { style: { fontSize: 24, fontWeight: 700, margin: 0, color: "var(--theme-text)" }, children: t("dashboard.title") }),
+      /* @__PURE__ */ jsx("p", { style: { color: "var(--theme-elevation-500)", margin: "4px 0 0", fontSize: 14 }, children: t("dashboard.subtitle") })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gap: 16, marginBottom: 24 }, children: [
+      /* @__PURE__ */ jsx(StatCard, { label: t("dashboard.openTickets"), value: String(openCount), trend: trendOpen, accentColor: "#3b82f6" }),
+      /* @__PURE__ */ jsx(StatCard, { label: t("dashboard.waitingClient"), value: String(waitingCount), trend: waitingTrend, accentColor: "#f59e0b" }),
+      /* @__PURE__ */ jsx(StatCard, { label: t("dashboard.responseTime"), value: formatResponseTime(stats.avgResponseTimeHours), accentColor: stats.avgResponseTimeHours != null && stats.avgResponseTimeHours > 24 ? "#ef4444" : "#22c55e" }),
+      /* @__PURE__ */ jsx(StatCard, { label: t("dashboard.satisfaction"), value: stats.satisfactionAvg > 0 ? `${stats.satisfactionAvg}/5` : "--", accentColor: stats.satisfactionAvg >= 4 ? "#22c55e" : stats.satisfactionAvg >= 3 ? "#f59e0b" : "#94a3b8" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "grid", gridTemplateColumns: "1fr 320px", gap: 20, marginBottom: 24 }, children: [
+      /* @__PURE__ */ jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)" }, children: [
+        /* @__PURE__ */ jsx("h2", { style: { fontSize: 15, fontWeight: 700, margin: "0 0 12px", color: "var(--theme-text)" }, children: t("dashboard.activeTickets") }),
+        tickets.length === 0 ? /* @__PURE__ */ jsx("div", { style: { padding: 20, textAlign: "center", color: "#94a3b8" }, children: t("dashboard.noActiveTickets") }) : /* @__PURE__ */ jsxs("table", { style: { width: "100%", borderCollapse: "collapse", fontSize: 13 }, children: [
+          /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
+            /* @__PURE__ */ jsx("th", { style: { textAlign: "left", padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" }, children: t("dashboard.tableHeaders.status") }),
+            /* @__PURE__ */ jsx("th", { style: { textAlign: "left", padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" }, children: t("dashboard.tableHeaders.number") }),
+            /* @__PURE__ */ jsx("th", { style: { textAlign: "left", padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" }, children: t("dashboard.tableHeaders.subject") }),
+            /* @__PURE__ */ jsx("th", { style: { textAlign: "left", padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" }, children: t("dashboard.tableHeaders.client") }),
+            /* @__PURE__ */ jsx("th", { style: { textAlign: "left", padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" }, children: t("dashboard.tableHeaders.modified") })
+          ] }) }),
+          /* @__PURE__ */ jsx("tbody", { children: tickets.map((tk) => /* @__PURE__ */ jsxs("tr", { style: { cursor: "pointer" }, onClick: () => {
+            window.location.href = `/admin/support/ticket?id=${tk.id}`;
+          }, children: [
+            /* @__PURE__ */ jsx("td", { style: { padding: "8px" }, children: /* @__PURE__ */ jsx("span", { style: { width: 8, height: 8, borderRadius: "50%", display: "inline-block", backgroundColor: statusDotColor(tk.status) } }) }),
+            /* @__PURE__ */ jsxs("td", { style: { padding: "8px", fontWeight: 600, fontSize: 12 }, children: [
+              "#",
+              tk.ticketNumber
+            ] }),
+            /* @__PURE__ */ jsx("td", { style: { padding: "8px", maxWidth: 250, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: tk.subject }),
+            /* @__PURE__ */ jsx("td", { style: { padding: "8px", color: "var(--theme-elevation-500)", fontSize: 12 }, children: getClientName(tk) }),
+            /* @__PURE__ */ jsx("td", { style: { padding: "8px", color: "var(--theme-elevation-400)", fontSize: 12 }, children: timeAgo(tk.updatedAt) })
+          ] }, tk.id)) })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 16 }, children: [
+        /* @__PURE__ */ jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)" }, children: [
+          /* @__PURE__ */ jsx("h2", { style: { fontSize: 15, fontWeight: 700, margin: "0 0 12px", color: "var(--theme-text)" }, children: t("dashboard.volume7days") }),
+          /* @__PURE__ */ jsx("div", { style: { display: "flex", alignItems: "flex-end", gap: 4, height: 80 }, children: volumeData.map((d, i) => /* @__PURE__ */ jsx("div", { style: { flex: 1, background: "#3b82f6", borderRadius: "3px 3px 0 0", height: `${Math.max(d.value / maxVolume * 100, 5)}%` }, title: `${d.label}: ${d.value}` }, i)) }),
+          /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", fontSize: 10, color: "var(--theme-elevation-400)", marginTop: 4 }, children: [
+            /* @__PURE__ */ jsx("span", { children: volumeData[0]?.label }),
+            /* @__PURE__ */ jsx("span", { children: volumeData[volumeData.length - 1]?.label })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)" }, children: [
+          /* @__PURE__ */ jsx("h2", { style: { fontSize: 15, fontWeight: 700, margin: "0 0 12px", color: "var(--theme-text)" }, children: t("dashboard.csat") }),
+          /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 16 }, children: [
+            /* @__PURE__ */ jsxs("div", { style: { position: "relative", width: 80, height: 80 }, children: [
+              /* @__PURE__ */ jsxs("svg", { width: "80", height: "80", viewBox: "0 0 100 100", children: [
+                /* @__PURE__ */ jsx("circle", { cx: "50", cy: "50", r: csatRadius, fill: "none", stroke: "var(--theme-elevation-150, #e2e8f0)", strokeWidth: "6" }),
+                /* @__PURE__ */ jsx("circle", { cx: "50", cy: "50", r: csatRadius, fill: "none", stroke: csatColor, strokeWidth: "6", strokeLinecap: "round", strokeDasharray: csatCircumference, strokeDashoffset: csatStrokeDashoffset, transform: "rotate(-90 50 50)", style: { transition: "stroke-dashoffset 600ms ease" } })
+              ] }),
+              /* @__PURE__ */ jsx("div", { style: { position: "absolute", inset: 0, display: "flex", alignItems: "center", justifyContent: "center", fontWeight: 700, fontSize: 16 }, children: csatScore > 0 ? csatScore.toFixed(1) : "--" })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { children: [
+              /* @__PURE__ */ jsx("div", { style: { fontSize: 13, fontWeight: 600 }, children: csatScore > 0 ? `${csatScore.toFixed(1)} / 5` : t("dashboard.csatNoData") }),
+              /* @__PURE__ */ jsx("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)" }, children: stats.satisfactionCount > 0 ? t("dashboard.csatReviews", { count: String(stats.satisfactionCount) }) : t("dashboard.csatNoReviews") })
+            ] })
+          ] })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(SlaSection, {}),
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 10, marginTop: 24, flexWrap: "wrap" }, children: [
+      /* @__PURE__ */ jsx(Link, { href: "/admin/support/new-ticket", style: { padding: "8px 16px", borderRadius: 8, background: "#2563eb", color: "#fff", fontSize: 13, fontWeight: 600, textDecoration: "none" }, children: t("dashboard.newTicketAction") }),
+      /* @__PURE__ */ jsxs(Link, { href: "/admin/support/emails", style: { padding: "8px 16px", borderRadius: 8, border: "1px solid var(--theme-elevation-200)", fontSize: 13, fontWeight: 500, textDecoration: "none", color: "var(--theme-text)", display: "flex", alignItems: "center", gap: 6 }, children: [
+        t("dashboard.pendingEmails"),
+        stats.pendingEmailsCount > 0 ? /* @__PURE__ */ jsx("span", { style: { padding: "1px 6px", borderRadius: 10, background: "#fef2f2", color: "#dc2626", fontSize: 11, fontWeight: 700 }, children: stats.pendingEmailsCount }) : /* @__PURE__ */ jsx("span", { style: { padding: "1px 6px", borderRadius: 10, background: "#dcfce7", color: "#16a34a", fontSize: 11, fontWeight: 700 }, children: "0" })
+      ] }),
+      /* @__PURE__ */ jsx(Link, { href: "/admin/support/crm", style: { padding: "8px 16px", borderRadius: 8, border: "1px solid var(--theme-elevation-200)", fontSize: 13, fontWeight: 500, textDecoration: "none", color: "var(--theme-text)" }, children: t("dashboard.crm") }),
+      /* @__PURE__ */ jsx(Link, { href: "/admin/support/billing", style: { padding: "8px 16px", borderRadius: 8, border: "1px solid var(--theme-elevation-200)", fontSize: 13, fontWeight: 500, textDecoration: "none", color: "var(--theme-text)" }, children: t("dashboard.preBilling") }),
+      /* @__PURE__ */ jsx("a", { href: "/api/support/export-csv", style: { padding: "8px 16px", borderRadius: 8, border: "1px solid var(--theme-elevation-200)", fontSize: 13, fontWeight: 500, textDecoration: "none", color: "var(--theme-text)" }, target: "_blank", rel: "noopener noreferrer", children: t("dashboard.exportCsv") })
+    ] })
+  ] });
+};
+
+export { SupportDashboardClient };

package/dist/views/SupportDashboardView/index.js

@@ -0,0 +1,29 @@
+import { jsx } from 'react/jsx-runtime';
+import { DefaultTemplate } from '@payloadcms/next/templates';
+import { redirect } from 'next/navigation';
+import { AdminErrorBoundary } from '../shared/ErrorBoundary';
+import { SupportDashboardClient } from './client';
+
+const SupportDashboardView = ({ initPageResult }) => {
+  const { req, visibleEntities } = initPageResult;
+  if (!req.user) {
+    redirect("/admin/login");
+  }
+  return /* @__PURE__ */ jsx(
+    DefaultTemplate,
+    {
+      i18n: req.i18n,
+      locale: initPageResult.locale,
+      params: {},
+      payload: req.payload,
+      permissions: initPageResult.permissions,
+      searchParams: {},
+      user: req.user,
+      visibleEntities,
+      children: /* @__PURE__ */ jsx(AdminErrorBoundary, { viewName: "SupportDashboardView", children: /* @__PURE__ */ jsx(SupportDashboardClient, {}) })
+    }
+  );
+};
+var SupportDashboardView_default = SupportDashboardView;
+
+export { SupportDashboardView, SupportDashboardView_default as default };