@consilioweb/payload-support 0.6.0 → 0.6.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{styles/theme.css → components/TicketConversation.css} +13 -326
- package/dist/components/TicketConversation.js +3004 -0
- package/dist/index.cjs +11 -11
- package/dist/index.js +11 -11
- package/dist/views/BillingView/client.cjs +209 -0
- package/dist/views/BillingView/index.cjs +34 -0
- package/dist/views/ChatView/client.cjs +253 -0
- package/dist/views/ChatView/index.cjs +34 -0
- package/dist/views/CrmView/client.cjs +233 -0
- package/dist/views/CrmView/index.cjs +34 -0
- package/dist/views/EmailTrackingView/client.cjs +159 -0
- package/dist/views/EmailTrackingView/index.cjs +34 -0
- package/dist/views/ImportConversationView/client.cjs +205 -0
- package/dist/views/ImportConversationView/index.cjs +34 -0
- package/dist/views/LogsView/client.cjs +149 -0
- package/dist/views/LogsView/index.cjs +32 -0
- package/dist/views/NewTicketView/client.cjs +229 -0
- package/dist/views/NewTicketView/index.cjs +32 -0
- package/dist/views/PendingEmailsView/client.cjs +173 -0
- package/dist/views/PendingEmailsView/index.cjs +34 -0
- package/dist/views/SupportDashboardView/client.cjs +301 -0
- package/dist/views/SupportDashboardView/index.cjs +34 -0
- package/dist/views/TicketDetailView/client.cjs +850 -0
- package/dist/views/TicketDetailView/index.cjs +34 -0
- package/dist/views/TicketInboxView/client.cjs +299 -0
- package/dist/views/TicketInboxView/index.cjs +32 -0
- package/dist/views/TicketingSettingsView/client.cjs +733 -0
- package/dist/views/TicketingSettingsView/index.cjs +34 -0
- package/dist/views/TimeDashboardView/client.cjs +169 -0
- package/dist/views/TimeDashboardView/index.cjs +34 -0
- package/dist/views/shared/AdminViewHeader.cjs +68 -0
- package/dist/views/shared/ErrorBoundary.cjs +55 -0
- package/dist/views/shared/Skeleton.cjs +77 -0
- package/dist/views/shared/adminTokens.cjs +34 -0
- package/dist/views/shared/adminTokens.js +0 -1
- package/dist/{components/TicketConversation/config.js → views/shared/config.cjs} +5 -2
- package/dist/views/shared/config.js +0 -1
- package/dist/views/shared/index.cjs +58 -0
- package/dist/views/shared/index.js +0 -1
- package/dist/views.cjs +86 -0
- package/dist/views.d.cts +13 -0
- package/dist/views.d.ts +13 -0
- package/dist/views.js +13 -0
- package/package.json +14 -7
- package/src/plugin.ts +11 -11
- package/src/views.ts +17 -0
- package/dist/components/TicketConversation/components/AISummaryPanel.js +0 -76
- package/dist/components/TicketConversation/components/ActionPanels.js +0 -118
- package/dist/components/TicketConversation/components/ActivityLog.js +0 -23
- package/dist/components/TicketConversation/components/ClientBar.js +0 -42
- package/dist/components/TicketConversation/components/ClientHistory.js +0 -137
- package/dist/components/TicketConversation/components/CodeBlock.js +0 -152
- package/dist/components/TicketConversation/components/CodeBlockInserter.js +0 -155
- package/dist/components/TicketConversation/components/QuickActions.js +0 -65
- package/dist/components/TicketConversation/components/TicketHeader.js +0 -92
- package/dist/components/TicketConversation/components/TimeTrackingPanel.js +0 -133
- package/dist/components/TicketConversation/constants.js +0 -96
- package/dist/components/TicketConversation/context.js +0 -11
- package/dist/components/TicketConversation/hooks/useAI.js +0 -176
- package/dist/components/TicketConversation/hooks/useMessageActions.js +0 -135
- package/dist/components/TicketConversation/hooks/useReply.js +0 -187
- package/dist/components/TicketConversation/hooks/useTicketActions.js +0 -230
- package/dist/components/TicketConversation/hooks/useTimeTracking.js +0 -122
- package/dist/components/TicketConversation/hooks/useTranslation.js +0 -70
- package/dist/components/TicketConversation/index.js +0 -1123
- package/dist/components/TicketConversation/locales/en.json +0 -878
- package/dist/components/TicketConversation/locales/fr.json +0 -878
- package/dist/components/TicketConversation/types.js +0 -2
- package/dist/components/TicketConversation/utils.js +0 -25
- package/dist/styles/BillingView.module.scss +0 -311
- package/dist/styles/ChatView.module.scss +0 -438
- package/dist/styles/CommandPalette.module.scss +0 -160
- package/dist/styles/CrmView.module.scss +0 -554
- package/dist/styles/EmailTracking.module.scss +0 -238
- package/dist/styles/ImportConversation.module.scss +0 -267
- package/dist/styles/Layout.module.scss +0 -55
- package/dist/styles/Logs.module.scss +0 -164
- package/dist/styles/NewTicket.module.scss +0 -143
- package/dist/styles/PendingEmails.module.scss +0 -629
- package/dist/styles/SupportDashboard.module.scss +0 -649
- package/dist/styles/TicketDetail.module.scss +0 -1050
- package/dist/styles/TicketInbox.module.scss +0 -296
- package/dist/styles/TicketingSettings.module.scss +0 -358
- package/dist/styles/TimeDashboard.module.scss +0 -287
- package/dist/styles/_tokens.scss +0 -78
|
@@ -0,0 +1,301 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var react = require('react');
|
|
5
|
+
var Link = require('next/link');
|
|
6
|
+
var useTranslation = require('../../components/TicketConversation/hooks/useTranslation');
|
|
7
|
+
|
|
8
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
|
+
|
|
10
|
+
var Link__default = /*#__PURE__*/_interopDefault(Link);
|
|
11
|
+
|
|
12
|
+
function formatResponseTime(hours) {
|
|
13
|
+
if (hours == null) return "--";
|
|
14
|
+
const h = Math.floor(hours);
|
|
15
|
+
const m = Math.round((hours - h) * 60);
|
|
16
|
+
if (h === 0) return `${m}m`;
|
|
17
|
+
if (m === 0) return `${h}h`;
|
|
18
|
+
return `${h}h${m.toString().padStart(2, "0")}m`;
|
|
19
|
+
}
|
|
20
|
+
function timeAgo(dateStr) {
|
|
21
|
+
const diff = Date.now() - new Date(dateStr).getTime();
|
|
22
|
+
const mins = Math.floor(diff / 6e4);
|
|
23
|
+
if (mins < 1) return "a l'instant";
|
|
24
|
+
if (mins < 60) return `${mins}min`;
|
|
25
|
+
const hours = Math.floor(mins / 60);
|
|
26
|
+
if (hours < 24) return `${hours}h`;
|
|
27
|
+
const days = Math.floor(hours / 24);
|
|
28
|
+
if (days < 7) return `${days}j`;
|
|
29
|
+
return `${Math.floor(days / 7)}sem`;
|
|
30
|
+
}
|
|
31
|
+
function computeTrend(current, previous) {
|
|
32
|
+
if (previous === 0 && current === 0) return { pct: 0, dir: "neutral" };
|
|
33
|
+
if (previous === 0) return { pct: 100, dir: "up" };
|
|
34
|
+
const pct = Math.round((current - previous) / previous * 100);
|
|
35
|
+
if (pct === 0) return { pct: 0, dir: "neutral" };
|
|
36
|
+
return { pct: Math.abs(pct), dir: pct > 0 ? "up" : "down" };
|
|
37
|
+
}
|
|
38
|
+
function StatCard({ label, value, trend, accentColor }) {
|
|
39
|
+
return /* @__PURE__ */ jsxRuntime.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: [
|
|
40
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)", marginBottom: 4 }, children: label }),
|
|
41
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 24, fontWeight: 700, color: "var(--theme-text)" }, children: value }),
|
|
42
|
+
trend && trend.dir !== "neutral" && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { fontSize: 11, color: trend.dir === "up" ? "#dc2626" : "#16a34a", marginTop: 4 }, children: [
|
|
43
|
+
trend.dir === "up" ? "\u2191" : "\u2193",
|
|
44
|
+
" ",
|
|
45
|
+
trend.pct,
|
|
46
|
+
"%"
|
|
47
|
+
] }),
|
|
48
|
+
trend && trend.dir === "neutral" && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 11, color: "#6b7280", marginTop: 4 }, children: "-- stable" })
|
|
49
|
+
] });
|
|
50
|
+
}
|
|
51
|
+
function formatSlaTime(minutes) {
|
|
52
|
+
const absMin = Math.abs(minutes);
|
|
53
|
+
if (absMin < 60) return `${Math.round(absMin)}min`;
|
|
54
|
+
const h = Math.floor(absMin / 60);
|
|
55
|
+
const m = Math.round(absMin % 60);
|
|
56
|
+
if (h < 24) return m > 0 ? `${h}h${m.toString().padStart(2, "0")}` : `${h}h`;
|
|
57
|
+
const d = Math.floor(h / 24);
|
|
58
|
+
const remainH = h % 24;
|
|
59
|
+
return remainH > 0 ? `${d}j ${remainH}h` : `${d}j`;
|
|
60
|
+
}
|
|
61
|
+
function SlaSection() {
|
|
62
|
+
const { t } = useTranslation.useTranslation();
|
|
63
|
+
const [sla, setSla] = react.useState(null);
|
|
64
|
+
const [slaLoading, setSlaLoading] = react.useState(true);
|
|
65
|
+
react.useEffect(() => {
|
|
66
|
+
const fetchSla = async () => {
|
|
67
|
+
try {
|
|
68
|
+
const res = await fetch("/api/support/sla-check");
|
|
69
|
+
if (res.ok) setSla(await res.json());
|
|
70
|
+
} catch {
|
|
71
|
+
}
|
|
72
|
+
setSlaLoading(false);
|
|
73
|
+
};
|
|
74
|
+
fetchSla();
|
|
75
|
+
const interval = setInterval(fetchSla, 6e4);
|
|
76
|
+
return () => clearInterval(interval);
|
|
77
|
+
}, []);
|
|
78
|
+
if (slaLoading) return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 16, color: "#94a3b8", fontSize: 13 }, children: t("sla.loading") });
|
|
79
|
+
if (!sla) return null;
|
|
80
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginTop: 24 }, children: [
|
|
81
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: { fontSize: 16, fontWeight: 700, marginBottom: 12, color: "var(--theme-text)" }, children: t("sla.title") }),
|
|
82
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 16 }, children: [
|
|
83
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid #fecaca", background: "#fef2f2" }, children: [
|
|
84
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 8 }, children: [
|
|
85
|
+
/* @__PURE__ */ jsxRuntime.jsx("h3", { style: { fontSize: 14, fontWeight: 700, color: "#dc2626", margin: 0 }, children: t("sla.breached") }),
|
|
86
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { padding: "2px 8px", borderRadius: 10, background: "#fecaca", color: "#dc2626", fontSize: 12, fontWeight: 700 }, children: sla.breached.length })
|
|
87
|
+
] }),
|
|
88
|
+
sla.breached.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 13, color: "#6b7280" }, children: t("sla.noBreached") }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { style: { listStyle: "none", margin: 0, padding: 0 }, children: sla.breached.map((ticket) => {
|
|
89
|
+
const overdueMin = Math.round((Date.now() - new Date(ticket.createdAt).getTime()) / 6e4);
|
|
90
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("li", { style: { padding: "6px 0", borderBottom: "1px solid #fecaca", cursor: "pointer", display: "flex", justifyContent: "space-between", alignItems: "center", fontSize: 13 }, onClick: () => {
|
|
91
|
+
window.location.href = `/admin/support/ticket?id=${ticket.id}`;
|
|
92
|
+
}, children: [
|
|
93
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
94
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontWeight: 600 }, children: [
|
|
95
|
+
"#",
|
|
96
|
+
ticket.ticketNumber
|
|
97
|
+
] }),
|
|
98
|
+
" ",
|
|
99
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#6b7280" }, children: ticket.subject })
|
|
100
|
+
] }),
|
|
101
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { style: { color: "#dc2626", fontWeight: 600, fontSize: 12 }, children: [
|
|
102
|
+
"+",
|
|
103
|
+
formatSlaTime(overdueMin)
|
|
104
|
+
] })
|
|
105
|
+
] }, ticket.id);
|
|
106
|
+
}) })
|
|
107
|
+
] }),
|
|
108
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid #fde68a", background: "#fefce8" }, children: [
|
|
109
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 8 }, children: [
|
|
110
|
+
/* @__PURE__ */ jsxRuntime.jsx("h3", { style: { fontSize: 14, fontWeight: 700, color: "#d97706", margin: 0 }, children: t("sla.atRisk") }),
|
|
111
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { padding: "2px 8px", borderRadius: 10, background: "#fde68a", color: "#d97706", fontSize: 12, fontWeight: 700 }, children: sla.atRisk.length })
|
|
112
|
+
] }),
|
|
113
|
+
sla.atRisk.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 13, color: "#6b7280" }, children: t("sla.noAtRisk") }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { style: { listStyle: "none", margin: 0, padding: 0 }, children: sla.atRisk.map((ticket) => {
|
|
114
|
+
const elapsedMin = Math.round((Date.now() - new Date(ticket.createdAt).getTime()) / 6e4);
|
|
115
|
+
const estimatedTotalMin = Math.round(elapsedMin / 0.8);
|
|
116
|
+
const remainingMin = Math.max(estimatedTotalMin - elapsedMin, 0);
|
|
117
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("li", { style: { padding: "6px 0", borderBottom: "1px solid #fde68a", cursor: "pointer", display: "flex", justifyContent: "space-between", alignItems: "center", fontSize: 13 }, onClick: () => {
|
|
118
|
+
window.location.href = `/admin/support/ticket?id=${ticket.id}`;
|
|
119
|
+
}, children: [
|
|
120
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
121
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { style: { fontWeight: 600 }, children: [
|
|
122
|
+
"#",
|
|
123
|
+
ticket.ticketNumber
|
|
124
|
+
] }),
|
|
125
|
+
" ",
|
|
126
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#6b7280" }, children: ticket.subject })
|
|
127
|
+
] }),
|
|
128
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "#d97706", fontWeight: 600, fontSize: 12 }, children: t("sla.remaining", { time: formatSlaTime(remainingMin) }) })
|
|
129
|
+
] }, ticket.id);
|
|
130
|
+
}) })
|
|
131
|
+
] })
|
|
132
|
+
] })
|
|
133
|
+
] });
|
|
134
|
+
}
|
|
135
|
+
const SupportDashboardClient = () => {
|
|
136
|
+
const { t } = useTranslation.useTranslation();
|
|
137
|
+
const [stats, setStats] = react.useState(null);
|
|
138
|
+
const [tickets, setTickets] = react.useState([]);
|
|
139
|
+
const [loading, setLoading] = react.useState(true);
|
|
140
|
+
const [sessionExpired, setSessionExpired] = react.useState(false);
|
|
141
|
+
const fetchData = react.useCallback(async () => {
|
|
142
|
+
try {
|
|
143
|
+
const [statsRes, ticketsRes] = await Promise.all([
|
|
144
|
+
fetch("/api/support/admin-stats"),
|
|
145
|
+
fetch("/api/tickets?where[status][not_equals]=resolved&sort=-updatedAt&limit=8&depth=1")
|
|
146
|
+
]);
|
|
147
|
+
if (statsRes.ok) {
|
|
148
|
+
setStats(await statsRes.json());
|
|
149
|
+
} else if (statsRes.status === 401 || statsRes.status === 403) {
|
|
150
|
+
setSessionExpired(true);
|
|
151
|
+
return;
|
|
152
|
+
}
|
|
153
|
+
if (ticketsRes.ok) {
|
|
154
|
+
const data = await ticketsRes.json();
|
|
155
|
+
setTickets(data.docs || []);
|
|
156
|
+
}
|
|
157
|
+
} catch {
|
|
158
|
+
}
|
|
159
|
+
setLoading(false);
|
|
160
|
+
}, []);
|
|
161
|
+
react.useEffect(() => {
|
|
162
|
+
fetchData();
|
|
163
|
+
if (sessionExpired) return;
|
|
164
|
+
const interval = setInterval(fetchData, 3e4);
|
|
165
|
+
return () => clearInterval(interval);
|
|
166
|
+
}, [fetchData, sessionExpired]);
|
|
167
|
+
react.useEffect(() => {
|
|
168
|
+
if (sessionExpired) return;
|
|
169
|
+
const onFocus = () => fetchData();
|
|
170
|
+
window.addEventListener("focus", onFocus);
|
|
171
|
+
return () => window.removeEventListener("focus", onFocus);
|
|
172
|
+
}, [fetchData, sessionExpired]);
|
|
173
|
+
const volumeData = react.useMemo(() => {
|
|
174
|
+
if (!stats) return [];
|
|
175
|
+
const avg = stats.createdLast7Days;
|
|
176
|
+
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")];
|
|
177
|
+
const base = Math.max(Math.floor(avg / 7), 0);
|
|
178
|
+
return days.map((label, i) => ({
|
|
179
|
+
label,
|
|
180
|
+
value: Math.max(base + (i * 3 + 1) % 5 - 2, 0)
|
|
181
|
+
}));
|
|
182
|
+
}, [stats, t]);
|
|
183
|
+
if (loading) {
|
|
184
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: "20px 30px", maxWidth: 1100, margin: "0 auto" }, children: [
|
|
185
|
+
/* @__PURE__ */ jsxRuntime.jsx("h1", { style: { fontSize: 24, fontWeight: 700 }, children: t("dashboard.title") }),
|
|
186
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { style: { color: "#94a3b8" }, children: t("dashboard.loadingMetrics") }),
|
|
187
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gap: 16, marginTop: 20 }, children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsxRuntime.jsx("div", { style: { height: 80, borderRadius: 10, background: "#f1f5f9" } }, i)) })
|
|
188
|
+
] });
|
|
189
|
+
}
|
|
190
|
+
if (!stats) {
|
|
191
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: "20px 30px", maxWidth: 1100, margin: "0 auto" }, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: 40, textAlign: "center", color: "#dc2626" }, children: [
|
|
192
|
+
/* @__PURE__ */ jsxRuntime.jsx("strong", { children: t("dashboard.loadError") }),
|
|
193
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { children: sessionExpired ? t("common.sessionExpired") : t("dashboard.cannotLoadStats") })
|
|
194
|
+
] }) });
|
|
195
|
+
}
|
|
196
|
+
const openCount = stats.byStatus.open || 0;
|
|
197
|
+
const waitingCount = stats.byStatus.waiting_client || 0;
|
|
198
|
+
const trendOpen = computeTrend(stats.createdLast7Days, Math.round(stats.createdLast30Days / 4));
|
|
199
|
+
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" };
|
|
200
|
+
const getClientName = (ticket) => {
|
|
201
|
+
if (!ticket.client) return "--";
|
|
202
|
+
if (typeof ticket.client === "string") return ticket.client;
|
|
203
|
+
return ticket.client.company || ticket.client.firstName || "--";
|
|
204
|
+
};
|
|
205
|
+
const statusDotColor = (status) => {
|
|
206
|
+
switch (status) {
|
|
207
|
+
case "open":
|
|
208
|
+
return "#22c55e";
|
|
209
|
+
case "waiting_client":
|
|
210
|
+
return "#eab308";
|
|
211
|
+
case "resolved":
|
|
212
|
+
return "#94a3b8";
|
|
213
|
+
default:
|
|
214
|
+
return "#94a3b8";
|
|
215
|
+
}
|
|
216
|
+
};
|
|
217
|
+
const maxVolume = Math.max(...volumeData.map((d) => d.value), 1);
|
|
218
|
+
const csatScore = stats.satisfactionAvg;
|
|
219
|
+
const csatPct = csatScore > 0 ? csatScore / 5 * 100 : 0;
|
|
220
|
+
const csatRadius = 42;
|
|
221
|
+
const csatCircumference = 2 * Math.PI * csatRadius;
|
|
222
|
+
const csatStrokeDashoffset = csatCircumference - csatPct / 100 * csatCircumference;
|
|
223
|
+
const csatColor = csatScore >= 4 ? "#22c55e" : csatScore >= 3 ? "#f59e0b" : csatScore > 0 ? "#ef4444" : "#94a3b8";
|
|
224
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: "20px 30px", maxWidth: 1100, margin: "0 auto" }, children: [
|
|
225
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: 20 }, children: [
|
|
226
|
+
/* @__PURE__ */ jsxRuntime.jsx("h1", { style: { fontSize: 24, fontWeight: 700, margin: 0, color: "var(--theme-text)" }, children: t("dashboard.title") }),
|
|
227
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { style: { color: "var(--theme-elevation-500)", margin: "4px 0 0", fontSize: 14 }, children: t("dashboard.subtitle") })
|
|
228
|
+
] }),
|
|
229
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gap: 16, marginBottom: 24 }, children: [
|
|
230
|
+
/* @__PURE__ */ jsxRuntime.jsx(StatCard, { label: t("dashboard.openTickets"), value: String(openCount), trend: trendOpen, accentColor: "#3b82f6" }),
|
|
231
|
+
/* @__PURE__ */ jsxRuntime.jsx(StatCard, { label: t("dashboard.waitingClient"), value: String(waitingCount), trend: waitingTrend, accentColor: "#f59e0b" }),
|
|
232
|
+
/* @__PURE__ */ jsxRuntime.jsx(StatCard, { label: t("dashboard.responseTime"), value: formatResponseTime(stats.avgResponseTimeHours), accentColor: stats.avgResponseTimeHours != null && stats.avgResponseTimeHours > 24 ? "#ef4444" : "#22c55e" }),
|
|
233
|
+
/* @__PURE__ */ jsxRuntime.jsx(StatCard, { label: t("dashboard.satisfaction"), value: stats.satisfactionAvg > 0 ? `${stats.satisfactionAvg}/5` : "--", accentColor: stats.satisfactionAvg >= 4 ? "#22c55e" : stats.satisfactionAvg >= 3 ? "#f59e0b" : "#94a3b8" })
|
|
234
|
+
] }),
|
|
235
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "grid", gridTemplateColumns: "1fr 320px", gap: 20, marginBottom: 24 }, children: [
|
|
236
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)" }, children: [
|
|
237
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: { fontSize: 15, fontWeight: 700, margin: "0 0 12px", color: "var(--theme-text)" }, children: t("dashboard.activeTickets") }),
|
|
238
|
+
tickets.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: 20, textAlign: "center", color: "#94a3b8" }, children: t("dashboard.noActiveTickets") }) : /* @__PURE__ */ jsxRuntime.jsxs("table", { style: { width: "100%", borderCollapse: "collapse", fontSize: 13 }, children: [
|
|
239
|
+
/* @__PURE__ */ jsxRuntime.jsx("thead", { children: /* @__PURE__ */ jsxRuntime.jsxs("tr", { children: [
|
|
240
|
+
/* @__PURE__ */ jsxRuntime.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") }),
|
|
241
|
+
/* @__PURE__ */ jsxRuntime.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") }),
|
|
242
|
+
/* @__PURE__ */ jsxRuntime.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") }),
|
|
243
|
+
/* @__PURE__ */ jsxRuntime.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") }),
|
|
244
|
+
/* @__PURE__ */ jsxRuntime.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") })
|
|
245
|
+
] }) }),
|
|
246
|
+
/* @__PURE__ */ jsxRuntime.jsx("tbody", { children: tickets.map((tk) => /* @__PURE__ */ jsxRuntime.jsxs("tr", { style: { cursor: "pointer" }, onClick: () => {
|
|
247
|
+
window.location.href = `/admin/support/ticket?id=${tk.id}`;
|
|
248
|
+
}, children: [
|
|
249
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "8px" }, children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { width: 8, height: 8, borderRadius: "50%", display: "inline-block", backgroundColor: statusDotColor(tk.status) } }) }),
|
|
250
|
+
/* @__PURE__ */ jsxRuntime.jsxs("td", { style: { padding: "8px", fontWeight: 600, fontSize: 12 }, children: [
|
|
251
|
+
"#",
|
|
252
|
+
tk.ticketNumber
|
|
253
|
+
] }),
|
|
254
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "8px", maxWidth: 250, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: tk.subject }),
|
|
255
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "8px", color: "var(--theme-elevation-500)", fontSize: 12 }, children: getClientName(tk) }),
|
|
256
|
+
/* @__PURE__ */ jsxRuntime.jsx("td", { style: { padding: "8px", color: "var(--theme-elevation-400)", fontSize: 12 }, children: timeAgo(tk.updatedAt) })
|
|
257
|
+
] }, tk.id)) })
|
|
258
|
+
] })
|
|
259
|
+
] }),
|
|
260
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 16 }, children: [
|
|
261
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)" }, children: [
|
|
262
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: { fontSize: 15, fontWeight: 700, margin: "0 0 12px", color: "var(--theme-text)" }, children: t("dashboard.volume7days") }),
|
|
263
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", alignItems: "flex-end", gap: 4, height: 80 }, children: volumeData.map((d, i) => /* @__PURE__ */ jsxRuntime.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)) }),
|
|
264
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", justifyContent: "space-between", fontSize: 10, color: "var(--theme-elevation-400)", marginTop: 4 }, children: [
|
|
265
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: volumeData[0]?.label }),
|
|
266
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: volumeData[volumeData.length - 1]?.label })
|
|
267
|
+
] })
|
|
268
|
+
] }),
|
|
269
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)" }, children: [
|
|
270
|
+
/* @__PURE__ */ jsxRuntime.jsx("h2", { style: { fontSize: 15, fontWeight: 700, margin: "0 0 12px", color: "var(--theme-text)" }, children: t("dashboard.csat") }),
|
|
271
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: 16 }, children: [
|
|
272
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { position: "relative", width: 80, height: 80 }, children: [
|
|
273
|
+
/* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "80", height: "80", viewBox: "0 0 100 100", children: [
|
|
274
|
+
/* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "50", cy: "50", r: csatRadius, fill: "none", stroke: "var(--theme-elevation-150, #e2e8f0)", strokeWidth: "6" }),
|
|
275
|
+
/* @__PURE__ */ jsxRuntime.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" } })
|
|
276
|
+
] }),
|
|
277
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { position: "absolute", inset: 0, display: "flex", alignItems: "center", justifyContent: "center", fontWeight: 700, fontSize: 16 }, children: csatScore > 0 ? csatScore.toFixed(1) : "--" })
|
|
278
|
+
] }),
|
|
279
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
280
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 13, fontWeight: 600 }, children: csatScore > 0 ? `${csatScore.toFixed(1)} / 5` : t("dashboard.csatNoData") }),
|
|
281
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: 12, color: "var(--theme-elevation-500)" }, children: stats.satisfactionCount > 0 ? t("dashboard.csatReviews", { count: String(stats.satisfactionCount) }) : t("dashboard.csatNoReviews") })
|
|
282
|
+
] })
|
|
283
|
+
] })
|
|
284
|
+
] })
|
|
285
|
+
] })
|
|
286
|
+
] }),
|
|
287
|
+
/* @__PURE__ */ jsxRuntime.jsx(SlaSection, {}),
|
|
288
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", gap: 10, marginTop: 24, flexWrap: "wrap" }, children: [
|
|
289
|
+
/* @__PURE__ */ jsxRuntime.jsx(Link__default.default, { 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") }),
|
|
290
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Link__default.default, { 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: [
|
|
291
|
+
t("dashboard.pendingEmails"),
|
|
292
|
+
stats.pendingEmailsCount > 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { style: { padding: "1px 6px", borderRadius: 10, background: "#fef2f2", color: "#dc2626", fontSize: 11, fontWeight: 700 }, children: stats.pendingEmailsCount }) : /* @__PURE__ */ jsxRuntime.jsx("span", { style: { padding: "1px 6px", borderRadius: 10, background: "#dcfce7", color: "#16a34a", fontSize: 11, fontWeight: 700 }, children: "0" })
|
|
293
|
+
] }),
|
|
294
|
+
/* @__PURE__ */ jsxRuntime.jsx(Link__default.default, { 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") }),
|
|
295
|
+
/* @__PURE__ */ jsxRuntime.jsx(Link__default.default, { 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") }),
|
|
296
|
+
/* @__PURE__ */ jsxRuntime.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") })
|
|
297
|
+
] })
|
|
298
|
+
] });
|
|
299
|
+
};
|
|
300
|
+
|
|
301
|
+
exports.SupportDashboardClient = SupportDashboardClient;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
var templates = require('@payloadcms/next/templates');
|
|
7
|
+
var navigation = require('next/navigation');
|
|
8
|
+
var ErrorBoundary = require('../shared/ErrorBoundary');
|
|
9
|
+
var client = require('./client');
|
|
10
|
+
|
|
11
|
+
const SupportDashboardView = ({ initPageResult }) => {
|
|
12
|
+
const { req, visibleEntities } = initPageResult;
|
|
13
|
+
if (!req.user) {
|
|
14
|
+
navigation.redirect("/admin/login");
|
|
15
|
+
}
|
|
16
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
17
|
+
templates.DefaultTemplate,
|
|
18
|
+
{
|
|
19
|
+
i18n: req.i18n,
|
|
20
|
+
locale: initPageResult.locale,
|
|
21
|
+
params: {},
|
|
22
|
+
payload: req.payload,
|
|
23
|
+
permissions: initPageResult.permissions,
|
|
24
|
+
searchParams: {},
|
|
25
|
+
user: req.user,
|
|
26
|
+
visibleEntities,
|
|
27
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(ErrorBoundary.AdminErrorBoundary, { viewName: "SupportDashboardView", children: /* @__PURE__ */ jsxRuntime.jsx(client.SupportDashboardClient, {}) })
|
|
28
|
+
}
|
|
29
|
+
);
|
|
30
|
+
};
|
|
31
|
+
var SupportDashboardView_default = SupportDashboardView;
|
|
32
|
+
|
|
33
|
+
exports.SupportDashboardView = SupportDashboardView;
|
|
34
|
+
exports.default = SupportDashboardView_default;
|