@consilioweb/payload-support 0.6.1 → 0.6.3

package/dist/views/CrmView/client.cjs

@@ -0,0 +1,233 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('react');
+var useTranslation = require('../../components/TicketConversation/hooks/useTranslation');
+
+const statusLabelKeys = { open: "ticket.status.open", waiting_client: "ticket.status.waiting_client", resolved: "ticket.status.resolved" };
+const statusColors = { open: "#3b82f6", waiting_client: "#f59e0b", resolved: "#22c55e" };
+function formatDuration(minutes) {
+  const h = Math.floor(minutes / 60);
+  const m = minutes % 60;
+  if (h === 0) return `${m}min`;
+  if (m === 0) return `${h}h`;
+  return `${h}h${m}m`;
+}
+function timeAgo(dateStr) {
+  const diff = Date.now() - new Date(dateStr).getTime();
+  const days = Math.floor(diff / 864e5);
+  if (days === 0) return "Aujourd'hui";
+  if (days === 1) return "Hier";
+  if (days < 30) return `Il y a ${days}j`;
+  return `Il y a ${Math.floor(days / 30)} mois`;
+}
+const CrmClient = () => {
+  const { t } = useTranslation.useTranslation();
+  const [clients, setClients] = react.useState([]);
+  const [loading, setLoading] = react.useState(true);
+  const [search, setSearch] = react.useState("");
+  const [selectedId, setSelectedId] = react.useState(null);
+  const [detail, setDetail] = react.useState(null);
+  const [detailLoading, setDetailLoading] = react.useState(false);
+  const [showMerge, setShowMerge] = react.useState(false);
+  const [mergeSearch, setMergeSearch] = react.useState("");
+  const [mergeResults, setMergeResults] = react.useState([]);
+  const [merging, setMerging] = react.useState(false);
+  const [mergeSuccess, setMergeSuccess] = react.useState("");
+  const fetchClients = react.useCallback(async () => {
+    try {
+      const params = new URLSearchParams({ limit: "100", sort: "company", depth: "0" });
+      if (search) params.set("where[company][like]", search);
+      const res = await fetch(`/api/support-clients?${params}`);
+      if (res.ok) {
+        const json = await res.json();
+        setClients(json.docs || []);
+      }
+    } catch {
+    }
+    setLoading(false);
+  }, [search]);
+  react.useEffect(() => {
+    const timeout = setTimeout(fetchClients, 300);
+    return () => clearTimeout(timeout);
+  }, [fetchClients]);
+  const fetchDetail = react.useCallback(async (clientId) => {
+    setDetailLoading(true);
+    try {
+      const [clientRes, ticketsRes, projectsRes, timeRes] = await Promise.all([
+        fetch(`/api/support-clients/${clientId}?depth=0`),
+        fetch(`/api/tickets?where[client][equals]=${clientId}&sort=-createdAt&limit=20&depth=0`),
+        fetch(`/api/projects?where[client][equals]=${clientId}&depth=0`),
+        fetch(`/api/time-entries?limit=0&depth=0`)
+      ]);
+      const client = clientRes.ok ? await clientRes.json() : null;
+      const tickets = ticketsRes.ok ? (await ticketsRes.json()).docs || [] : [];
+      const projects = projectsRes.ok ? (await projectsRes.json()).docs || [] : [];
+      const ticketIds = tickets.map((t2) => t2.id);
+      let totalTimeMinutes = 0;
+      if (timeRes.ok) {
+        const timeData = await timeRes.json();
+        totalTimeMinutes = timeData.docs.filter((e) => ticketIds.includes(e.ticket)).reduce((sum, e) => sum + (e.duration || 0), 0);
+      }
+      const openTickets = tickets.filter((t2) => ["open", "waiting_client"].includes(t2.status)).length;
+      const resolvedTickets = tickets.filter((t2) => t2.status === "resolved").length;
+      setDetail({ client, tickets, projects, stats: { totalTickets: tickets.length, openTickets, resolvedTickets, totalTimeMinutes, lastActivity: tickets.length > 0 ? tickets[0].createdAt : null } });
+    } catch {
+      setDetail(null);
+    }
+    setDetailLoading(false);
+  }, []);
+  const selectClient = (id) => {
+    setSelectedId(id);
+    fetchDetail(id);
+    setShowMerge(false);
+    setMergeSuccess("");
+  };
+  react.useEffect(() => {
+    if (!mergeSearch || mergeSearch.length < 2) {
+      setMergeResults([]);
+      return;
+    }
+    const timer = setTimeout(async () => {
+      try {
+        const res = await fetch(`/api/support-clients?where[or][0][company][like]=${encodeURIComponent(mergeSearch)}&where[or][1][email][like]=${encodeURIComponent(mergeSearch)}&limit=10&depth=0`);
+        if (res.ok) {
+          const json = await res.json();
+          setMergeResults((json.docs || []).filter((c) => c.id !== selectedId));
+        }
+      } catch {
+      }
+    }, 300);
+    return () => clearTimeout(timer);
+  }, [mergeSearch, selectedId]);
+  const handleMerge = async (targetId) => {
+    if (!selectedId || !detail) return;
+    if (!confirm(`Fusionner ce client dans un autre ? Cette action est irreversible.`)) return;
+    setMerging(true);
+    try {
+      const res = await fetch("/api/support/merge-clients", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ sourceId: selectedId, targetId }) });
+      if (res.ok) {
+        const data = await res.json();
+        setMergeSuccess(data.message);
+        setShowMerge(false);
+        setSelectedId(targetId);
+        fetchDetail(targetId);
+        fetchClients();
+      } else {
+        const err = await res.json().catch(() => ({ error: "Erreur inconnue" }));
+        alert(`Erreur : ${err.error}`);
+      }
+    } catch {
+      alert("Erreur reseau");
+    }
+    setMerging(false);
+  };
+  const S = {
+    page: { padding: "20px 30px", maxWidth: 1200, margin: "0 auto" },
+    grid: { display: "grid", gridTemplateColumns: "300px 1fr", gap: 20 },
+    sidebar: { borderRight: "1px solid var(--theme-elevation-200)", paddingRight: 16 },
+    searchInput: { width: "100%", padding: "8px 12px", borderRadius: 8, border: "1px solid var(--theme-elevation-200)", fontSize: 13, marginBottom: 12, color: "var(--theme-text)", background: "var(--theme-elevation-0)" },
+    clientItem: { padding: "10px 12px", borderRadius: 8, cursor: "pointer", marginBottom: 4, border: "1px solid transparent" },
+    clientItemActive: { background: "var(--theme-elevation-50)", borderColor: "var(--theme-elevation-200)" },
+    statsGrid: { display: "grid", gridTemplateColumns: "repeat(5, 1fr)", gap: 8, marginBottom: 16 },
+    statCard: { padding: "10px 12px", borderRadius: 8, border: "1px solid var(--theme-elevation-150)", textAlign: "center" },
+    table: { width: "100%", borderCollapse: "collapse", fontSize: 13 },
+    th: { textAlign: "left", padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" },
+    td: { padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-100)" },
+    badge: { padding: "2px 6px", borderRadius: 4, fontSize: 10, fontWeight: 600 }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.page, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: 20 }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h1", { style: { fontSize: 22, fontWeight: 700, margin: 0, color: "var(--theme-text)" }, children: t("crm.title") }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 13, color: "var(--theme-elevation-500)", marginTop: 4 }, children: t("crm.subtitle") })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.grid, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.sidebar, children: [
+        /* @__PURE__ */ jsxRuntime.jsx("input", { type: "text", placeholder: t("crm.searchPlaceholder"), value: search, onChange: (e) => setSearch(e.target.value), style: S.searchInput }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { children: loading ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 20, textAlign: "center", color: "#94a3b8" }, children: t("common.loading") }) : clients.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 20, textAlign: "center", color: "#94a3b8" }, children: t("crm.noClientFound") }) : clients.map((c) => /* @__PURE__ */ jsxRuntime.jsxs("div", { onClick: () => selectClient(c.id), style: { ...S.clientItem, ...selectedId === c.id ? S.clientItemActive : {} }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontWeight: 600, fontSize: 13 }, children: c.company }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)" }, children: [
+            c.firstName,
+            " ",
+            c.lastName
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 11, color: "var(--theme-elevation-400)" }, children: c.email })
+        ] }, c.id)) })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { children: !selectedId ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 60, textAlign: "center", color: "#94a3b8" }, children: t("crm.selectClient") }) : detailLoading ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 60, textAlign: "center", color: "#94a3b8" }, children: t("common.loading") }) : detail ? /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 16 }, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx("h2", { style: { fontSize: 20, fontWeight: 700, margin: 0 }, children: detail.client.company }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { fontSize: 13, color: "var(--theme-elevation-500)" }, children: [
+              detail.client.firstName,
+              " ",
+              detail.client.lastName
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { fontSize: 12, color: "var(--theme-elevation-400)" }, children: [
+              detail.client.email,
+              " ",
+              detail.client.phone && `-- ${detail.client.phone}`
+            ] }),
+            detail.client.notes && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)", marginTop: 4, fontStyle: "italic" }, children: detail.client.notes })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", gap: 8 }, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("a", { href: `/admin/collections/support-clients/${detail.client.id}`, style: { padding: "6px 14px", borderRadius: 6, background: "#2563eb", color: "#fff", fontSize: 12, fontWeight: 600, textDecoration: "none" }, children: t("crm.editButton") }),
+            /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: () => {
+              setShowMerge(!showMerge);
+              setMergeSearch("");
+              setMergeResults([]);
+            }, style: { padding: "6px 14px", borderRadius: 6, border: "1px solid #d97706", background: "none", color: "#d97706", fontSize: 12, fontWeight: 600, cursor: "pointer" }, children: t("crm.mergeButton") })
+          ] })
+        ] }),
+        mergeSuccess && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: "8px 14px", borderRadius: 6, background: "#dcfce7", color: "#166534", fontSize: 13, marginBottom: 12 }, children: mergeSuccess }),
+        showMerge && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: 16, borderRadius: 8, border: "1px solid #fde68a", background: "#fefce8", marginBottom: 16 }, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("h4", { style: { margin: "0 0 8px", fontSize: 14 }, children: t("crm.mergeTitle") }),
+          /* @__PURE__ */ jsxRuntime.jsx("input", { type: "text", value: mergeSearch, onChange: (e) => setMergeSearch(e.target.value), placeholder: t("crm.mergeSearchPlaceholder"), style: S.searchInput }),
+          mergeResults.map((c) => /* @__PURE__ */ jsxRuntime.jsxs("button", { onClick: () => handleMerge(c.id), disabled: merging, 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__ */ jsxRuntime.jsx("strong", { children: c.company }),
+            " -- ",
+            c.firstName,
+            " ",
+            c.lastName,
+            " ",
+            /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "var(--theme-elevation-400)", fontSize: 11 }, children: c.email })
+          ] }, c.id))
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { style: S.statsGrid, children: [
+          { label: t("crm.stats.totalTickets"), value: String(detail.stats.totalTickets) },
+          { label: t("crm.stats.openTickets"), value: String(detail.stats.openTickets) },
+          { label: t("crm.stats.resolvedTickets"), value: String(detail.stats.resolvedTickets) },
+          { label: t("crm.stats.timeSpent"), value: formatDuration(detail.stats.totalTimeMinutes) },
+          { label: t("crm.stats.lastActivity"), value: detail.stats.lastActivity ? timeAgo(detail.stats.lastActivity) : "-" }
+        ].map((stat) => /* @__PURE__ */ jsxRuntime.jsxs("div", { style: S.statCard, children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 11, color: "var(--theme-elevation-500)", marginBottom: 2 }, children: stat.label }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 18, fontWeight: 700, color: "var(--theme-text)" }, children: stat.value })
+        ] }, stat.label)) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)", marginBottom: 16 }, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("h3", { style: { fontSize: 14, fontWeight: 700, margin: "0 0 8px" }, children: [
+            t("crm.sections.tickets"),
+            " (",
+            detail.tickets.length,
+            ")"
+          ] }),
+          detail.tickets.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "#94a3b8", fontSize: 13 }, children: t("crm.noTickets") }) : /* @__PURE__ */ jsxRuntime.jsxs("table", { style: S.table, children: [
+            /* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
+              /* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("crm.tableHeaders.number") }),
+              /* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("crm.tableHeaders.subject") }),
+              /* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("crm.tableHeaders.status") }),
+              /* @__PURE__ */ jsxRuntime.jsx("th", { style: S.th, children: t("crm.tableHeaders.date") })
+            ] }) }),
+            /* @__PURE__ */ jsxRuntime.jsx("tbody", { children: detail.tickets.map((tk) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
+              /* @__PURE__ */ jsxRuntime.jsx("td", { style: S.td, children: /* @__PURE__ */ jsxRuntime.jsx("a", { href: `/admin/support/ticket?id=${tk.id}`, style: { color: "#2563eb", fontWeight: 600, textDecoration: "none" }, children: tk.ticketNumber }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("td", { style: S.td, children: tk.subject }),
+              /* @__PURE__ */ jsxRuntime.jsx("td", { style: S.td, children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { ...S.badge, background: `${statusColors[tk.status] || "#94a3b8"}20`, color: statusColors[tk.status] || "#94a3b8" }, children: statusLabelKeys[tk.status] ? t(statusLabelKeys[tk.status]) : tk.status }) }),
+              /* @__PURE__ */ jsxRuntime.jsx("td", { style: { ...S.td, fontSize: 12, color: "var(--theme-elevation-400)" }, children: timeAgo(tk.createdAt) })
+            ] }, tk.id)) })
+          ] })
+        ] })
+      ] }) : null })
+    ] })
+  ] });
+};
+
+exports.CrmClient = CrmClient;

package/dist/views/CrmView/client.js

@@ -0,0 +1,232 @@
+"use client";
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useCallback, useEffect } from 'react';
+import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation';
+
+const statusLabelKeys = { open: "ticket.status.open", waiting_client: "ticket.status.waiting_client", resolved: "ticket.status.resolved" };
+const statusColors = { open: "#3b82f6", waiting_client: "#f59e0b", resolved: "#22c55e" };
+function formatDuration(minutes) {
+  const h = Math.floor(minutes / 60);
+  const m = minutes % 60;
+  if (h === 0) return `${m}min`;
+  if (m === 0) return `${h}h`;
+  return `${h}h${m}m`;
+}
+function timeAgo(dateStr) {
+  const diff = Date.now() - new Date(dateStr).getTime();
+  const days = Math.floor(diff / 864e5);
+  if (days === 0) return "Aujourd'hui";
+  if (days === 1) return "Hier";
+  if (days < 30) return `Il y a ${days}j`;
+  return `Il y a ${Math.floor(days / 30)} mois`;
+}
+const CrmClient = () => {
+  const { t } = useTranslation();
+  const [clients, setClients] = useState([]);
+  const [loading, setLoading] = useState(true);
+  const [search, setSearch] = useState("");
+  const [selectedId, setSelectedId] = useState(null);
+  const [detail, setDetail] = useState(null);
+  const [detailLoading, setDetailLoading] = useState(false);
+  const [showMerge, setShowMerge] = useState(false);
+  const [mergeSearch, setMergeSearch] = useState("");
+  const [mergeResults, setMergeResults] = useState([]);
+  const [merging, setMerging] = useState(false);
+  const [mergeSuccess, setMergeSuccess] = useState("");
+  const fetchClients = useCallback(async () => {
+    try {
+      const params = new URLSearchParams({ limit: "100", sort: "company", depth: "0" });
+      if (search) params.set("where[company][like]", search);
+      const res = await fetch(`/api/support-clients?${params}`);
+      if (res.ok) {
+        const json = await res.json();
+        setClients(json.docs || []);
+      }
+    } catch {
+    }
+    setLoading(false);
+  }, [search]);
+  useEffect(() => {
+    const timeout = setTimeout(fetchClients, 300);
+    return () => clearTimeout(timeout);
+  }, [fetchClients]);
+  const fetchDetail = useCallback(async (clientId) => {
+    setDetailLoading(true);
+    try {
+      const [clientRes, ticketsRes, projectsRes, timeRes] = await Promise.all([
+        fetch(`/api/support-clients/${clientId}?depth=0`),
+        fetch(`/api/tickets?where[client][equals]=${clientId}&sort=-createdAt&limit=20&depth=0`),
+        fetch(`/api/projects?where[client][equals]=${clientId}&depth=0`),
+        fetch(`/api/time-entries?limit=0&depth=0`)
+      ]);
+      const client = clientRes.ok ? await clientRes.json() : null;
+      const tickets = ticketsRes.ok ? (await ticketsRes.json()).docs || [] : [];
+      const projects = projectsRes.ok ? (await projectsRes.json()).docs || [] : [];
+      const ticketIds = tickets.map((t2) => t2.id);
+      let totalTimeMinutes = 0;
+      if (timeRes.ok) {
+        const timeData = await timeRes.json();
+        totalTimeMinutes = timeData.docs.filter((e) => ticketIds.includes(e.ticket)).reduce((sum, e) => sum + (e.duration || 0), 0);
+      }
+      const openTickets = tickets.filter((t2) => ["open", "waiting_client"].includes(t2.status)).length;
+      const resolvedTickets = tickets.filter((t2) => t2.status === "resolved").length;
+      setDetail({ client, tickets, projects, stats: { totalTickets: tickets.length, openTickets, resolvedTickets, totalTimeMinutes, lastActivity: tickets.length > 0 ? tickets[0].createdAt : null } });
+    } catch {
+      setDetail(null);
+    }
+    setDetailLoading(false);
+  }, []);
+  const selectClient = (id) => {
+    setSelectedId(id);
+    fetchDetail(id);
+    setShowMerge(false);
+    setMergeSuccess("");
+  };
+  useEffect(() => {
+    if (!mergeSearch || mergeSearch.length < 2) {
+      setMergeResults([]);
+      return;
+    }
+    const timer = setTimeout(async () => {
+      try {
+        const res = await fetch(`/api/support-clients?where[or][0][company][like]=${encodeURIComponent(mergeSearch)}&where[or][1][email][like]=${encodeURIComponent(mergeSearch)}&limit=10&depth=0`);
+        if (res.ok) {
+          const json = await res.json();
+          setMergeResults((json.docs || []).filter((c) => c.id !== selectedId));
+        }
+      } catch {
+      }
+    }, 300);
+    return () => clearTimeout(timer);
+  }, [mergeSearch, selectedId]);
+  const handleMerge = async (targetId) => {
+    if (!selectedId || !detail) return;
+    if (!confirm(`Fusionner ce client dans un autre ? Cette action est irreversible.`)) return;
+    setMerging(true);
+    try {
+      const res = await fetch("/api/support/merge-clients", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ sourceId: selectedId, targetId }) });
+      if (res.ok) {
+        const data = await res.json();
+        setMergeSuccess(data.message);
+        setShowMerge(false);
+        setSelectedId(targetId);
+        fetchDetail(targetId);
+        fetchClients();
+      } else {
+        const err = await res.json().catch(() => ({ error: "Erreur inconnue" }));
+        alert(`Erreur : ${err.error}`);
+      }
+    } catch {
+      alert("Erreur reseau");
+    }
+    setMerging(false);
+  };
+  const S = {
+    page: { padding: "20px 30px", maxWidth: 1200, margin: "0 auto" },
+    grid: { display: "grid", gridTemplateColumns: "300px 1fr", gap: 20 },
+    sidebar: { borderRight: "1px solid var(--theme-elevation-200)", paddingRight: 16 },
+    searchInput: { width: "100%", padding: "8px 12px", borderRadius: 8, border: "1px solid var(--theme-elevation-200)", fontSize: 13, marginBottom: 12, color: "var(--theme-text)", background: "var(--theme-elevation-0)" },
+    clientItem: { padding: "10px 12px", borderRadius: 8, cursor: "pointer", marginBottom: 4, border: "1px solid transparent" },
+    clientItemActive: { background: "var(--theme-elevation-50)", borderColor: "var(--theme-elevation-200)" },
+    statsGrid: { display: "grid", gridTemplateColumns: "repeat(5, 1fr)", gap: 8, marginBottom: 16 },
+    statCard: { padding: "10px 12px", borderRadius: 8, border: "1px solid var(--theme-elevation-150)", textAlign: "center" },
+    table: { width: "100%", borderCollapse: "collapse", fontSize: 13 },
+    th: { textAlign: "left", padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" },
+    td: { padding: "6px 8px", borderBottom: "1px solid var(--theme-elevation-100)" },
+    badge: { padding: "2px 6px", borderRadius: 4, fontSize: 10, fontWeight: 600 }
+  };
+  return /* @__PURE__ */ jsxs("div", { style: S.page, children: [
+    /* @__PURE__ */ jsxs("div", { style: { marginBottom: 20 }, children: [
+      /* @__PURE__ */ jsx("h1", { style: { fontSize: 22, fontWeight: 700, margin: 0, color: "var(--theme-text)" }, children: t("crm.title") }),
+      /* @__PURE__ */ jsx("div", { style: { fontSize: 13, color: "var(--theme-elevation-500)", marginTop: 4 }, children: t("crm.subtitle") })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: S.grid, children: [
+      /* @__PURE__ */ jsxs("div", { style: S.sidebar, children: [
+        /* @__PURE__ */ jsx("input", { type: "text", placeholder: t("crm.searchPlaceholder"), value: search, onChange: (e) => setSearch(e.target.value), style: S.searchInput }),
+        /* @__PURE__ */ jsx("div", { children: loading ? /* @__PURE__ */ jsx("div", { style: { padding: 20, textAlign: "center", color: "#94a3b8" }, children: t("common.loading") }) : clients.length === 0 ? /* @__PURE__ */ jsx("div", { style: { padding: 20, textAlign: "center", color: "#94a3b8" }, children: t("crm.noClientFound") }) : clients.map((c) => /* @__PURE__ */ jsxs("div", { onClick: () => selectClient(c.id), style: { ...S.clientItem, ...selectedId === c.id ? S.clientItemActive : {} }, children: [
+          /* @__PURE__ */ jsx("div", { style: { fontWeight: 600, fontSize: 13 }, children: c.company }),
+          /* @__PURE__ */ jsxs("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)" }, children: [
+            c.firstName,
+            " ",
+            c.lastName
+          ] }),
+          /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: "var(--theme-elevation-400)" }, children: c.email })
+        ] }, c.id)) })
+      ] }),
+      /* @__PURE__ */ jsx("div", { children: !selectedId ? /* @__PURE__ */ jsx("div", { style: { padding: 60, textAlign: "center", color: "#94a3b8" }, children: t("crm.selectClient") }) : detailLoading ? /* @__PURE__ */ jsx("div", { style: { padding: 60, textAlign: "center", color: "#94a3b8" }, children: t("common.loading") }) : detail ? /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 16 }, children: [
+          /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("h2", { style: { fontSize: 20, fontWeight: 700, margin: 0 }, children: detail.client.company }),
+            /* @__PURE__ */ jsxs("div", { style: { fontSize: 13, color: "var(--theme-elevation-500)" }, children: [
+              detail.client.firstName,
+              " ",
+              detail.client.lastName
+            ] }),
+            /* @__PURE__ */ jsxs("div", { style: { fontSize: 12, color: "var(--theme-elevation-400)" }, children: [
+              detail.client.email,
+              " ",
+              detail.client.phone && `-- ${detail.client.phone}`
+            ] }),
+            detail.client.notes && /* @__PURE__ */ jsx("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)", marginTop: 4, fontStyle: "italic" }, children: detail.client.notes })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 8 }, children: [
+            /* @__PURE__ */ jsx("a", { href: `/admin/collections/support-clients/${detail.client.id}`, style: { padding: "6px 14px", borderRadius: 6, background: "#2563eb", color: "#fff", fontSize: 12, fontWeight: 600, textDecoration: "none" }, children: t("crm.editButton") }),
+            /* @__PURE__ */ jsx("button", { onClick: () => {
+              setShowMerge(!showMerge);
+              setMergeSearch("");
+              setMergeResults([]);
+            }, style: { padding: "6px 14px", borderRadius: 6, border: "1px solid #d97706", background: "none", color: "#d97706", fontSize: 12, fontWeight: 600, cursor: "pointer" }, children: t("crm.mergeButton") })
+          ] })
+        ] }),
+        mergeSuccess && /* @__PURE__ */ jsx("div", { style: { padding: "8px 14px", borderRadius: 6, background: "#dcfce7", color: "#166534", fontSize: 13, marginBottom: 12 }, children: mergeSuccess }),
+        showMerge && /* @__PURE__ */ jsxs("div", { style: { padding: 16, borderRadius: 8, border: "1px solid #fde68a", background: "#fefce8", marginBottom: 16 }, children: [
+          /* @__PURE__ */ jsx("h4", { style: { margin: "0 0 8px", fontSize: 14 }, children: t("crm.mergeTitle") }),
+          /* @__PURE__ */ jsx("input", { type: "text", value: mergeSearch, onChange: (e) => setMergeSearch(e.target.value), placeholder: t("crm.mergeSearchPlaceholder"), style: S.searchInput }),
+          mergeResults.map((c) => /* @__PURE__ */ jsxs("button", { onClick: () => handleMerge(c.id), disabled: merging, 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: c.company }),
+            " -- ",
+            c.firstName,
+            " ",
+            c.lastName,
+            " ",
+            /* @__PURE__ */ jsx("span", { style: { color: "var(--theme-elevation-400)", fontSize: 11 }, children: c.email })
+          ] }, c.id))
+        ] }),
+        /* @__PURE__ */ jsx("div", { style: S.statsGrid, children: [
+          { label: t("crm.stats.totalTickets"), value: String(detail.stats.totalTickets) },
+          { label: t("crm.stats.openTickets"), value: String(detail.stats.openTickets) },
+          { label: t("crm.stats.resolvedTickets"), value: String(detail.stats.resolvedTickets) },
+          { label: t("crm.stats.timeSpent"), value: formatDuration(detail.stats.totalTimeMinutes) },
+          { label: t("crm.stats.lastActivity"), value: detail.stats.lastActivity ? timeAgo(detail.stats.lastActivity) : "-" }
+        ].map((stat) => /* @__PURE__ */ jsxs("div", { style: S.statCard, children: [
+          /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: "var(--theme-elevation-500)", marginBottom: 2 }, children: stat.label }),
+          /* @__PURE__ */ jsx("div", { style: { fontSize: 18, fontWeight: 700, color: "var(--theme-text)" }, children: stat.value })
+        ] }, stat.label)) }),
+        /* @__PURE__ */ jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)", marginBottom: 16 }, children: [
+          /* @__PURE__ */ jsxs("h3", { style: { fontSize: 14, fontWeight: 700, margin: "0 0 8px" }, children: [
+            t("crm.sections.tickets"),
+            " (",
+            detail.tickets.length,
+            ")"
+          ] }),
+          detail.tickets.length === 0 ? /* @__PURE__ */ jsx("div", { style: { color: "#94a3b8", fontSize: 13 }, children: t("crm.noTickets") }) : /* @__PURE__ */ jsxs("table", { style: S.table, children: [
+            /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
+              /* @__PURE__ */ jsx("th", { style: S.th, children: t("crm.tableHeaders.number") }),
+              /* @__PURE__ */ jsx("th", { style: S.th, children: t("crm.tableHeaders.subject") }),
+              /* @__PURE__ */ jsx("th", { style: S.th, children: t("crm.tableHeaders.status") }),
+              /* @__PURE__ */ jsx("th", { style: S.th, children: t("crm.tableHeaders.date") })
+            ] }) }),
+            /* @__PURE__ */ jsx("tbody", { children: detail.tickets.map((tk) => /* @__PURE__ */ jsxs("tr", { children: [
+              /* @__PURE__ */ jsx("td", { style: S.td, children: /* @__PURE__ */ jsx("a", { href: `/admin/support/ticket?id=${tk.id}`, style: { color: "#2563eb", fontWeight: 600, textDecoration: "none" }, children: tk.ticketNumber }) }),
+              /* @__PURE__ */ jsx("td", { style: S.td, children: tk.subject }),
+              /* @__PURE__ */ jsx("td", { style: S.td, children: /* @__PURE__ */ jsx("span", { style: { ...S.badge, background: `${statusColors[tk.status] || "#94a3b8"}20`, color: statusColors[tk.status] || "#94a3b8" }, children: statusLabelKeys[tk.status] ? t(statusLabelKeys[tk.status]) : tk.status }) }),
+              /* @__PURE__ */ jsx("td", { style: { ...S.td, fontSize: 12, color: "var(--theme-elevation-400)" }, children: timeAgo(tk.createdAt) })
+            ] }, tk.id)) })
+          ] })
+        ] })
+      ] }) : null })
+    ] })
+  ] });
+};
+
+export { CrmClient };

package/dist/views/CrmView/index.cjs

@@ -0,0 +1,34 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var templates = require('@payloadcms/next/templates');
+var navigation = require('next/navigation');
+var ErrorBoundary = require('../shared/ErrorBoundary');
+var client = require('./client');
+
+const CrmView = ({ initPageResult }) => {
+  const { req, visibleEntities } = initPageResult;
+  if (!req.user) {
+    navigation.redirect("/admin/login");
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    templates.DefaultTemplate,
+    {
+      i18n: req.i18n,
+      locale: initPageResult.locale,
+      params: {},
+      payload: req.payload,
+      permissions: initPageResult.permissions,
+      searchParams: {},
+      user: req.user,
+      visibleEntities,
+      children: /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary.AdminErrorBoundary, { viewName: "CrmView", children: /* @__PURE__ */ jsxRuntime.jsx(client.CrmClient, {}) })
+    }
+  );
+};
+var CrmView_default = CrmView;
+
+exports.CrmView = CrmView;
+exports.default = CrmView_default;

package/dist/views/CrmView/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 { CrmClient } from './client';
+
+const CrmView = ({ 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: "CrmView", children: /* @__PURE__ */ jsx(CrmClient, {}) })
+    }
+  );
+};
+var CrmView_default = CrmView;
+
+export { CrmView, CrmView_default as default };