@consilioweb/payload-support 0.5.2 → 0.6.0
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/components/TicketConversation/components/AISummaryPanel.js +76 -0
- package/dist/components/TicketConversation/components/ActionPanels.js +118 -0
- package/dist/components/TicketConversation/components/ActivityLog.js +23 -0
- package/dist/components/TicketConversation/components/ClientBar.js +42 -0
- package/dist/components/TicketConversation/components/ClientHistory.js +137 -0
- package/dist/components/TicketConversation/components/CodeBlock.js +152 -0
- package/dist/components/TicketConversation/components/CodeBlockInserter.js +155 -0
- package/dist/components/TicketConversation/components/QuickActions.js +65 -0
- package/dist/components/TicketConversation/components/TicketHeader.js +92 -0
- package/dist/components/TicketConversation/components/TimeTrackingPanel.js +133 -0
- package/dist/components/TicketConversation/config.js +41 -0
- package/dist/components/TicketConversation/constants.js +96 -0
- package/dist/components/TicketConversation/context.js +11 -0
- package/dist/components/TicketConversation/hooks/useAI.js +176 -0
- package/dist/components/TicketConversation/hooks/useMessageActions.js +135 -0
- package/dist/components/TicketConversation/hooks/useReply.js +187 -0
- package/dist/components/TicketConversation/hooks/useTicketActions.js +230 -0
- package/dist/components/TicketConversation/hooks/useTimeTracking.js +122 -0
- package/dist/components/TicketConversation/hooks/useTranslation.js +70 -0
- package/dist/components/TicketConversation/index.js +1123 -0
- package/dist/components/TicketConversation/locales/en.json +878 -0
- package/dist/components/TicketConversation/locales/fr.json +878 -0
- package/dist/components/TicketConversation/types.js +2 -0
- package/dist/components/TicketConversation/utils.js +25 -0
- package/dist/index.cjs +2 -2
- package/dist/index.js +2 -2
- package/dist/styles/BillingView.module.scss +311 -0
- package/dist/styles/ChatView.module.scss +438 -0
- package/dist/styles/CommandPalette.module.scss +160 -0
- package/dist/styles/CrmView.module.scss +554 -0
- package/dist/styles/EmailTracking.module.scss +238 -0
- package/dist/styles/ImportConversation.module.scss +267 -0
- package/dist/styles/Layout.module.scss +55 -0
- package/dist/styles/Logs.module.scss +164 -0
- package/dist/styles/NewTicket.module.scss +143 -0
- package/dist/styles/PendingEmails.module.scss +629 -0
- package/dist/styles/SupportDashboard.module.scss +649 -0
- package/dist/styles/TicketDetail.module.scss +1050 -0
- package/dist/styles/TicketInbox.module.scss +296 -0
- package/dist/styles/TicketingSettings.module.scss +358 -0
- package/dist/styles/TimeDashboard.module.scss +287 -0
- package/dist/styles/_tokens.scss +78 -0
- package/dist/styles/theme.css +633 -0
- package/dist/views/BillingView/client.js +204 -0
- package/dist/views/BillingView/index.js +29 -0
- package/dist/views/ChatView/client.js +252 -0
- package/dist/views/ChatView/index.js +29 -0
- package/dist/views/CrmView/client.js +232 -0
- package/dist/views/CrmView/index.js +29 -0
- package/dist/views/EmailTrackingView/client.js +154 -0
- package/dist/views/EmailTrackingView/index.js +29 -0
- package/dist/views/ImportConversationView/client.js +204 -0
- package/dist/views/ImportConversationView/index.js +29 -0
- package/dist/views/LogsView/client.js +148 -0
- package/dist/views/LogsView/index.js +27 -0
- package/dist/views/NewTicketView/client.js +224 -0
- package/dist/views/NewTicketView/index.js +27 -0
- package/dist/views/PendingEmailsView/client.js +172 -0
- package/dist/views/PendingEmailsView/index.js +29 -0
- package/dist/views/SupportDashboardView/client.js +296 -0
- package/dist/views/SupportDashboardView/index.js +29 -0
- package/dist/views/TicketDetailView/client.js +844 -0
- package/dist/views/TicketDetailView/index.js +29 -0
- package/dist/views/TicketInboxView/client.js +294 -0
- package/dist/views/TicketInboxView/index.js +27 -0
- package/dist/{views.css → views/TicketingSettingsView/TicketingSettings.module.scss} +138 -66
- package/dist/views/TicketingSettingsView/client.js +728 -0
- package/dist/views/TicketingSettingsView/index.js +29 -0
- package/dist/views/TimeDashboardView/client.js +164 -0
- package/dist/views/TimeDashboardView/index.js +29 -0
- package/dist/views/shared/AdminViewHeader.js +67 -0
- package/dist/views/shared/ErrorBoundary.js +50 -0
- package/dist/views/shared/Skeleton.js +72 -0
- package/dist/views/shared/adminTokens.js +32 -0
- package/dist/views/shared/config.js +41 -0
- package/dist/views/shared/index.js +6 -0
- package/package.json +8 -12
- package/src/collections/Tickets.ts +1 -1
- package/src/components/TicketConversation/index.tsx +21 -2
- package/src/plugin.ts +3 -2
- package/dist/views.cjs +0 -6172
- package/dist/views.d.cts +0 -30
- package/dist/views.d.ts +0 -30
- package/dist/views.js +0 -6153
- package/src/views.ts +0 -16
|
@@ -0,0 +1,204 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
3
|
+
import { useState, useRef, useCallback } from 'react';
|
|
4
|
+
import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation';
|
|
5
|
+
|
|
6
|
+
function ImportConversationClient() {
|
|
7
|
+
const { t } = useTranslation();
|
|
8
|
+
const [markdown, setMarkdown] = useState("");
|
|
9
|
+
const [fileName, setFileName] = useState("");
|
|
10
|
+
const [isDragOver, setIsDragOver] = useState(false);
|
|
11
|
+
const [preview, setPreview] = useState(null);
|
|
12
|
+
const [result, setResult] = useState(null);
|
|
13
|
+
const [error, setError] = useState("");
|
|
14
|
+
const [loading, setLoading] = useState(false);
|
|
15
|
+
const fileRef = useRef(null);
|
|
16
|
+
const handleFile = useCallback((file) => {
|
|
17
|
+
if (!file.name.endsWith(".md") && !file.name.endsWith(".txt")) {
|
|
18
|
+
setError(t("import.formatError"));
|
|
19
|
+
return;
|
|
20
|
+
}
|
|
21
|
+
if (file.size > 512e3) {
|
|
22
|
+
setError(t("import.sizeError"));
|
|
23
|
+
return;
|
|
24
|
+
}
|
|
25
|
+
setError("");
|
|
26
|
+
setFileName(file.name);
|
|
27
|
+
setResult(null);
|
|
28
|
+
setPreview(null);
|
|
29
|
+
const reader = new FileReader();
|
|
30
|
+
reader.onload = (e) => {
|
|
31
|
+
setMarkdown(e.target?.result);
|
|
32
|
+
};
|
|
33
|
+
reader.readAsText(file);
|
|
34
|
+
}, []);
|
|
35
|
+
const onDrop = useCallback((e) => {
|
|
36
|
+
e.preventDefault();
|
|
37
|
+
setIsDragOver(false);
|
|
38
|
+
const file = e.dataTransfer.files[0];
|
|
39
|
+
if (file) handleFile(file);
|
|
40
|
+
}, [handleFile]);
|
|
41
|
+
const onFileChange = useCallback((e) => {
|
|
42
|
+
const file = e.target.files?.[0];
|
|
43
|
+
if (file) handleFile(file);
|
|
44
|
+
}, [handleFile]);
|
|
45
|
+
const doPreview = useCallback(async () => {
|
|
46
|
+
if (!markdown) return;
|
|
47
|
+
setLoading(true);
|
|
48
|
+
setError("");
|
|
49
|
+
setPreview(null);
|
|
50
|
+
try {
|
|
51
|
+
const res = await fetch("/api/support/import-conversation", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ markdown, previewOnly: true }) });
|
|
52
|
+
const data = await res.json();
|
|
53
|
+
if (!res.ok) {
|
|
54
|
+
setError(data.error || "Erreur");
|
|
55
|
+
return;
|
|
56
|
+
}
|
|
57
|
+
;
|
|
58
|
+
setPreview(data);
|
|
59
|
+
} catch {
|
|
60
|
+
setError("Erreur reseau");
|
|
61
|
+
} finally {
|
|
62
|
+
setLoading(false);
|
|
63
|
+
}
|
|
64
|
+
}, [markdown]);
|
|
65
|
+
const doImport = useCallback(async () => {
|
|
66
|
+
if (!markdown) return;
|
|
67
|
+
setLoading(true);
|
|
68
|
+
setError("");
|
|
69
|
+
try {
|
|
70
|
+
const res = await fetch("/api/support/import-conversation", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ markdown }) });
|
|
71
|
+
const data = await res.json();
|
|
72
|
+
if (!res.ok) {
|
|
73
|
+
setError(data.error || "Erreur");
|
|
74
|
+
return;
|
|
75
|
+
}
|
|
76
|
+
;
|
|
77
|
+
setResult(data);
|
|
78
|
+
setPreview(null);
|
|
79
|
+
} catch {
|
|
80
|
+
setError("Erreur reseau");
|
|
81
|
+
} finally {
|
|
82
|
+
setLoading(false);
|
|
83
|
+
}
|
|
84
|
+
}, [markdown]);
|
|
85
|
+
const reset = useCallback(() => {
|
|
86
|
+
setMarkdown("");
|
|
87
|
+
setFileName("");
|
|
88
|
+
setPreview(null);
|
|
89
|
+
setResult(null);
|
|
90
|
+
setError("");
|
|
91
|
+
if (fileRef.current) fileRef.current.value = "";
|
|
92
|
+
}, []);
|
|
93
|
+
const S = {
|
|
94
|
+
page: { padding: "20px 30px", maxWidth: 720, margin: "0 auto" },
|
|
95
|
+
dropzone: { border: "2px dashed var(--theme-elevation-300)", borderRadius: 12, padding: 40, textAlign: "center", cursor: "pointer", transition: "all 150ms" },
|
|
96
|
+
dropzoneDragOver: { border: "2px dashed #2563eb", borderRadius: 12, padding: 40, textAlign: "center", cursor: "pointer", background: "#eff6ff" },
|
|
97
|
+
dropzoneHasFile: { border: "2px solid #22c55e", borderRadius: 12, padding: 40, textAlign: "center", cursor: "pointer", background: "#f0fdf4" },
|
|
98
|
+
btn: { padding: "8px 16px", borderRadius: 8, border: "1px solid var(--theme-elevation-200)", fontSize: 13, cursor: "pointer", background: "var(--theme-elevation-0)", color: "var(--theme-text)", fontWeight: 600 },
|
|
99
|
+
btnPrimary: { padding: "8px 16px", borderRadius: 8, border: "none", fontSize: 13, cursor: "pointer", background: "#2563eb", color: "#fff", fontWeight: 600 },
|
|
100
|
+
btnGreen: { padding: "8px 16px", borderRadius: 8, border: "none", fontSize: 13, cursor: "pointer", background: "#16a34a", color: "#fff", fontWeight: 600 },
|
|
101
|
+
btnAmber: { padding: "8px 16px", borderRadius: 8, border: "none", fontSize: 13, cursor: "pointer", background: "#d97706", color: "#fff", fontWeight: 600 },
|
|
102
|
+
section: { padding: 16, borderRadius: 10, border: "1px solid var(--theme-elevation-150)", marginBottom: 12 },
|
|
103
|
+
infoRow: { display: "flex", justifyContent: "space-between", padding: "4px 0", fontSize: 13 },
|
|
104
|
+
infoLabel: { color: "var(--theme-elevation-500)" },
|
|
105
|
+
infoValue: { fontWeight: 600, color: "var(--theme-text)" },
|
|
106
|
+
msgAdmin: { padding: "8px 12px", borderRadius: 8, background: "#dbeafe", marginBottom: 6 },
|
|
107
|
+
msgClient: { padding: "8px 12px", borderRadius: 8, background: "var(--theme-elevation-50)", marginBottom: 6 },
|
|
108
|
+
resultSuccess: { padding: 20, borderRadius: 10, border: "2px solid #22c55e", background: "#f0fdf4" },
|
|
109
|
+
resultError: { padding: 16, borderRadius: 10, border: "1px solid #fecaca", background: "#fef2f2", color: "#dc2626", marginBottom: 12 }
|
|
110
|
+
};
|
|
111
|
+
return /* @__PURE__ */ jsxs("div", { style: S.page, children: [
|
|
112
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 20 }, children: [
|
|
113
|
+
/* @__PURE__ */ jsx("h1", { style: { fontSize: 22, fontWeight: 700, margin: 0 }, children: t("import.title") }),
|
|
114
|
+
result && /* @__PURE__ */ jsx("button", { onClick: reset, style: S.btnPrimary, children: t("import.newImport") })
|
|
115
|
+
] }),
|
|
116
|
+
!result && /* @__PURE__ */ jsxs("div", { style: isDragOver ? S.dropzoneDragOver : markdown ? S.dropzoneHasFile : S.dropzone, onDragOver: (e) => {
|
|
117
|
+
e.preventDefault();
|
|
118
|
+
setIsDragOver(true);
|
|
119
|
+
}, onDragLeave: () => setIsDragOver(false), onDrop, onClick: () => fileRef.current?.click(), children: [
|
|
120
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 24, marginBottom: 8 }, children: "\u2191" }),
|
|
121
|
+
/* @__PURE__ */ jsx("p", { style: { fontSize: 14, color: "var(--theme-text)" }, children: markdown ? t("import.dropzoneLoaded") : t("import.dropzoneText") }),
|
|
122
|
+
!markdown && /* @__PURE__ */ jsx("p", { style: { fontSize: 12, color: "var(--theme-elevation-400)", marginTop: 8 }, children: t("import.acceptedFormats") }),
|
|
123
|
+
fileName && /* @__PURE__ */ jsx("p", { style: { fontSize: 12, fontWeight: 600, marginTop: 8 }, children: fileName }),
|
|
124
|
+
/* @__PURE__ */ jsx("input", { ref: fileRef, type: "file", accept: ".md,.txt", onChange: onFileChange, style: { display: "none" } })
|
|
125
|
+
] }),
|
|
126
|
+
error && /* @__PURE__ */ jsxs("div", { style: S.resultError, children: [
|
|
127
|
+
/* @__PURE__ */ jsx("strong", { children: t("common.error") }),
|
|
128
|
+
/* @__PURE__ */ jsx("p", { style: { margin: "4px 0 0" }, children: error })
|
|
129
|
+
] }),
|
|
130
|
+
markdown && !preview && !result && /* @__PURE__ */ jsx("div", { style: { display: "flex", justifyContent: "center", marginTop: 16 }, children: /* @__PURE__ */ jsx("button", { onClick: doPreview, disabled: loading, style: S.btnAmber, children: loading ? t("import.analyzing") : t("import.preview") }) }),
|
|
131
|
+
preview && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
132
|
+
/* @__PURE__ */ jsxs("div", { style: S.section, children: [
|
|
133
|
+
/* @__PURE__ */ jsx("div", { style: { fontWeight: 700, marginBottom: 8 }, children: t("import.client") }),
|
|
134
|
+
/* @__PURE__ */ jsxs("div", { style: S.infoRow, children: [
|
|
135
|
+
/* @__PURE__ */ jsx("span", { style: S.infoLabel, children: t("import.name") }),
|
|
136
|
+
/* @__PURE__ */ jsx("span", { style: S.infoValue, children: preview.client.name })
|
|
137
|
+
] }),
|
|
138
|
+
/* @__PURE__ */ jsxs("div", { style: S.infoRow, children: [
|
|
139
|
+
/* @__PURE__ */ jsx("span", { style: S.infoLabel, children: t("import.email") }),
|
|
140
|
+
/* @__PURE__ */ jsx("span", { style: S.infoValue, children: preview.client.email })
|
|
141
|
+
] }),
|
|
142
|
+
/* @__PURE__ */ jsxs("div", { style: S.infoRow, children: [
|
|
143
|
+
/* @__PURE__ */ jsx("span", { style: S.infoLabel, children: t("import.company") }),
|
|
144
|
+
/* @__PURE__ */ jsx("span", { style: S.infoValue, children: preview.client.company })
|
|
145
|
+
] }),
|
|
146
|
+
/* @__PURE__ */ jsxs("div", { style: S.infoRow, children: [
|
|
147
|
+
/* @__PURE__ */ jsx("span", { style: S.infoLabel, children: t("import.parsing") }),
|
|
148
|
+
/* @__PURE__ */ jsx("span", { style: S.infoValue, children: preview.parseMethod === "structured" ? t("import.parsingRegex") : t("import.parsingAi") })
|
|
149
|
+
] })
|
|
150
|
+
] }),
|
|
151
|
+
/* @__PURE__ */ jsxs("div", { style: S.section, children: [
|
|
152
|
+
/* @__PURE__ */ jsxs("div", { style: { fontWeight: 700, marginBottom: 8, display: "flex", justifyContent: "space-between" }, children: [
|
|
153
|
+
/* @__PURE__ */ jsx("span", { children: preview.subject }),
|
|
154
|
+
/* @__PURE__ */ jsxs("span", { style: { color: "var(--theme-elevation-500)", fontSize: 12 }, children: [
|
|
155
|
+
preview.messageCount,
|
|
156
|
+
" ",
|
|
157
|
+
t("import.messages")
|
|
158
|
+
] })
|
|
159
|
+
] }),
|
|
160
|
+
preview.messages.map((msg, i) => /* @__PURE__ */ jsxs("div", { style: msg.from === "admin" ? S.msgAdmin : S.msgClient, children: [
|
|
161
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", fontSize: 12, marginBottom: 4 }, children: [
|
|
162
|
+
/* @__PURE__ */ jsxs("span", { style: { fontWeight: 600 }, children: [
|
|
163
|
+
msg.from === "admin" ? ">> " : "<< ",
|
|
164
|
+
msg.name
|
|
165
|
+
] }),
|
|
166
|
+
/* @__PURE__ */ jsx("span", { style: { color: "var(--theme-elevation-400)" }, children: msg.date })
|
|
167
|
+
] }),
|
|
168
|
+
/* @__PURE__ */ jsx("div", { style: { fontSize: 13 }, children: msg.preview })
|
|
169
|
+
] }, i))
|
|
170
|
+
] }),
|
|
171
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 8, justifyContent: "flex-end", marginTop: 12 }, children: [
|
|
172
|
+
/* @__PURE__ */ jsx("button", { onClick: () => setPreview(null), style: S.btn, children: t("common.cancel") }),
|
|
173
|
+
/* @__PURE__ */ jsx("button", { onClick: doImport, disabled: loading, style: S.btnGreen, children: loading ? t("import.importing") : t("import.importButton", { count: String(preview.messageCount) }) })
|
|
174
|
+
] })
|
|
175
|
+
] }),
|
|
176
|
+
result && /* @__PURE__ */ jsxs("div", { style: S.resultSuccess, children: [
|
|
177
|
+
/* @__PURE__ */ jsx("div", { style: { fontWeight: 700, fontSize: 16, marginBottom: 12, color: "#166534" }, children: t("import.resultTitle") }),
|
|
178
|
+
/* @__PURE__ */ jsxs("div", { style: S.infoRow, children: [
|
|
179
|
+
/* @__PURE__ */ jsx("span", { style: S.infoLabel, children: t("import.resultTicket") }),
|
|
180
|
+
/* @__PURE__ */ jsx("span", { style: S.infoValue, children: /* @__PURE__ */ jsx("a", { href: `/admin/support/ticket?id=${result.ticketId}`, style: { color: "#2563eb" }, children: result.ticketNumber }) })
|
|
181
|
+
] }),
|
|
182
|
+
/* @__PURE__ */ jsxs("div", { style: S.infoRow, children: [
|
|
183
|
+
/* @__PURE__ */ jsx("span", { style: S.infoLabel, children: t("import.resultClient") }),
|
|
184
|
+
/* @__PURE__ */ jsxs("span", { style: S.infoValue, children: [
|
|
185
|
+
result.clientName,
|
|
186
|
+
" (",
|
|
187
|
+
result.clientEmail,
|
|
188
|
+
")",
|
|
189
|
+
result.isNewClient && /* @__PURE__ */ jsx("span", { style: { marginLeft: 8, padding: "1px 6px", borderRadius: 4, background: "#dbeafe", color: "#1e40af", fontSize: 10 }, children: t("import.resultNew") })
|
|
190
|
+
] })
|
|
191
|
+
] }),
|
|
192
|
+
/* @__PURE__ */ jsxs("div", { style: S.infoRow, children: [
|
|
193
|
+
/* @__PURE__ */ jsx("span", { style: S.infoLabel, children: t("import.resultCompany") }),
|
|
194
|
+
/* @__PURE__ */ jsx("span", { style: S.infoValue, children: result.clientCompany })
|
|
195
|
+
] }),
|
|
196
|
+
/* @__PURE__ */ jsxs("div", { style: S.infoRow, children: [
|
|
197
|
+
/* @__PURE__ */ jsx("span", { style: S.infoLabel, children: t("import.resultMessages") }),
|
|
198
|
+
/* @__PURE__ */ jsx("span", { style: S.infoValue, children: t("import.resultImported", { count: String(result.messagesImported) }) })
|
|
199
|
+
] })
|
|
200
|
+
] })
|
|
201
|
+
] });
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
export { ImportConversationClient };
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { DefaultTemplate } from '@payloadcms/next/templates';
|
|
3
|
+
import { redirect } from 'next/navigation';
|
|
4
|
+
import { AdminErrorBoundary } from '../shared/ErrorBoundary';
|
|
5
|
+
import { ImportConversationClient } from './client';
|
|
6
|
+
|
|
7
|
+
const ImportConversationView = ({ initPageResult }) => {
|
|
8
|
+
const { req, visibleEntities } = initPageResult;
|
|
9
|
+
if (!req.user) {
|
|
10
|
+
redirect("/admin/login");
|
|
11
|
+
}
|
|
12
|
+
return /* @__PURE__ */ jsx(
|
|
13
|
+
DefaultTemplate,
|
|
14
|
+
{
|
|
15
|
+
i18n: req.i18n,
|
|
16
|
+
locale: initPageResult.locale,
|
|
17
|
+
params: {},
|
|
18
|
+
payload: req.payload,
|
|
19
|
+
permissions: initPageResult.permissions,
|
|
20
|
+
searchParams: {},
|
|
21
|
+
user: req.user,
|
|
22
|
+
visibleEntities,
|
|
23
|
+
children: /* @__PURE__ */ jsx(AdminErrorBoundary, { viewName: "ImportConversationView", children: /* @__PURE__ */ jsx(ImportConversationClient, {}) })
|
|
24
|
+
}
|
|
25
|
+
);
|
|
26
|
+
};
|
|
27
|
+
var ImportConversationView_default = ImportConversationView;
|
|
28
|
+
|
|
29
|
+
export { ImportConversationView, ImportConversationView_default as default };
|
|
@@ -0,0 +1,148 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { useState, useCallback, useEffect } from 'react';
|
|
4
|
+
import { useSearchParams } from 'next/navigation';
|
|
5
|
+
import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation';
|
|
6
|
+
|
|
7
|
+
function fmtDate(d) {
|
|
8
|
+
return new Date(d).toLocaleDateString("fr-FR", { day: "2-digit", month: "2-digit", year: "2-digit", hour: "2-digit", minute: "2-digit" });
|
|
9
|
+
}
|
|
10
|
+
const LogsClient = () => {
|
|
11
|
+
const { t } = useTranslation();
|
|
12
|
+
const searchParams = useSearchParams();
|
|
13
|
+
const [logType, setLogType] = useState(() => {
|
|
14
|
+
const t2 = searchParams.get("type");
|
|
15
|
+
return t2 === "auth" ? "auth" : "email";
|
|
16
|
+
});
|
|
17
|
+
const [logs, setLogs] = useState([]);
|
|
18
|
+
const [loading, setLoading] = useState(true);
|
|
19
|
+
const [page, setPage] = useState(1);
|
|
20
|
+
const [hasMore, setHasMore] = useState(false);
|
|
21
|
+
const [totalDocs, setTotalDocs] = useState(0);
|
|
22
|
+
const [purgeResult, setPurgeResult] = useState(null);
|
|
23
|
+
const collection = logType === "email" ? "email-logs" : "auth-logs";
|
|
24
|
+
const fetchLogs = useCallback(async () => {
|
|
25
|
+
try {
|
|
26
|
+
const res = await fetch(`/api/${collection}?sort=-createdAt&limit=30&page=${page}&depth=0`, { credentials: "include" });
|
|
27
|
+
if (res.ok) {
|
|
28
|
+
const d = await res.json();
|
|
29
|
+
setLogs(d.docs || []);
|
|
30
|
+
setHasMore(d.hasNextPage);
|
|
31
|
+
setTotalDocs(d.totalDocs);
|
|
32
|
+
}
|
|
33
|
+
} catch {
|
|
34
|
+
}
|
|
35
|
+
setLoading(false);
|
|
36
|
+
}, [collection, page]);
|
|
37
|
+
useEffect(() => {
|
|
38
|
+
setLoading(true);
|
|
39
|
+
setPage(1);
|
|
40
|
+
}, [logType]);
|
|
41
|
+
useEffect(() => {
|
|
42
|
+
fetchLogs();
|
|
43
|
+
}, [fetchLogs]);
|
|
44
|
+
const handlePurge = async (days) => {
|
|
45
|
+
const label = days === 0 ? "TOUS les logs" : `les logs de plus de ${days} jours`;
|
|
46
|
+
if (!window.confirm(`Supprimer ${label} (${collection}) ? Cette action est irreversible.`)) return;
|
|
47
|
+
try {
|
|
48
|
+
const res = await fetch(`/api/support/purge-logs?collection=${collection}&days=${days}`, { method: "DELETE", credentials: "include" });
|
|
49
|
+
if (res.ok) {
|
|
50
|
+
const d = await res.json();
|
|
51
|
+
setPurgeResult(`${d.purged} log(s) supprime(s)`);
|
|
52
|
+
setTimeout(() => setPurgeResult(null), 5e3);
|
|
53
|
+
fetchLogs();
|
|
54
|
+
}
|
|
55
|
+
} catch {
|
|
56
|
+
}
|
|
57
|
+
};
|
|
58
|
+
const S = {
|
|
59
|
+
page: { padding: "20px 30px", maxWidth: 1100, margin: "0 auto" },
|
|
60
|
+
header: { display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: 16 },
|
|
61
|
+
title: { fontSize: 22, fontWeight: 700, margin: 0, color: "var(--theme-text)" },
|
|
62
|
+
tabsRow: { display: "flex", gap: 4, marginBottom: 12 },
|
|
63
|
+
tab: { padding: "6px 12px", borderRadius: 6, border: "none", background: "none", cursor: "pointer", fontSize: 13, color: "var(--theme-elevation-500)", fontWeight: 500 },
|
|
64
|
+
tabActive: { background: "var(--theme-elevation-100)", color: "var(--theme-text)", fontWeight: 700 },
|
|
65
|
+
purgeBtn: { padding: "4px 10px", borderRadius: 6, border: "1px solid var(--theme-elevation-200)", fontSize: 11, background: "var(--theme-elevation-0)", cursor: "pointer", color: "var(--theme-text)" },
|
|
66
|
+
table: { width: "100%", borderCollapse: "collapse", fontSize: 13 },
|
|
67
|
+
th: { textAlign: "left", padding: "8px", borderBottom: "1px solid var(--theme-elevation-200)", fontSize: 11, color: "var(--theme-elevation-500)" },
|
|
68
|
+
td: { padding: "8px", borderBottom: "1px solid var(--theme-elevation-100)" },
|
|
69
|
+
badge: { padding: "2px 8px", borderRadius: 4, fontSize: 11, fontWeight: 600 },
|
|
70
|
+
mono: { fontFamily: "monospace", fontSize: 12 }
|
|
71
|
+
};
|
|
72
|
+
return /* @__PURE__ */ jsxs("div", { style: S.page, children: [
|
|
73
|
+
/* @__PURE__ */ jsxs("div", { style: S.header, children: [
|
|
74
|
+
/* @__PURE__ */ jsx("h1", { style: S.title, children: logType === "email" ? t("logs.title") : t("logs.titleAuth") }),
|
|
75
|
+
/* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 6 }, children: [
|
|
76
|
+
/* @__PURE__ */ jsx("button", { style: S.purgeBtn, onClick: () => handlePurge(7), children: t("logs.purge7") }),
|
|
77
|
+
/* @__PURE__ */ jsx("button", { style: S.purgeBtn, onClick: () => handlePurge(30), children: t("logs.purge30") }),
|
|
78
|
+
/* @__PURE__ */ jsx("button", { style: { ...S.purgeBtn, color: "#dc2626", borderColor: "#dc2626" }, onClick: () => handlePurge(0), children: t("logs.purgeAll") })
|
|
79
|
+
] })
|
|
80
|
+
] }),
|
|
81
|
+
/* @__PURE__ */ jsxs("div", { style: S.tabsRow, children: [
|
|
82
|
+
/* @__PURE__ */ jsxs("button", { style: { ...S.tab, ...logType === "email" ? S.tabActive : {} }, onClick: () => setLogType("email"), children: [
|
|
83
|
+
t("logs.tabs.email"),
|
|
84
|
+
" (",
|
|
85
|
+
logType === "email" ? totalDocs : "...",
|
|
86
|
+
")"
|
|
87
|
+
] }),
|
|
88
|
+
/* @__PURE__ */ jsxs("button", { style: { ...S.tab, ...logType === "auth" ? S.tabActive : {} }, onClick: () => setLogType("auth"), children: [
|
|
89
|
+
t("logs.tabs.auth"),
|
|
90
|
+
" (",
|
|
91
|
+
logType === "auth" ? totalDocs : "...",
|
|
92
|
+
")"
|
|
93
|
+
] })
|
|
94
|
+
] }),
|
|
95
|
+
purgeResult && /* @__PURE__ */ jsx("div", { style: { padding: "8px 14px", borderRadius: 6, background: "#dcfce7", color: "#166534", fontSize: 13, marginBottom: 12 }, children: purgeResult }),
|
|
96
|
+
loading ? /* @__PURE__ */ jsx("div", { style: { padding: 40, textAlign: "center", color: "#94a3b8" }, children: t("common.loading") }) : logs.length === 0 ? /* @__PURE__ */ jsx("div", { style: { padding: 40, textAlign: "center", color: "#94a3b8" }, children: t("logs.noLogs") }) : logType === "email" ? /* @__PURE__ */ jsxs("table", { style: S.table, children: [
|
|
97
|
+
/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
|
|
98
|
+
/* @__PURE__ */ jsx("th", { style: S.th, children: t("logs.tableHeaders.date") }),
|
|
99
|
+
/* @__PURE__ */ jsx("th", { style: S.th, children: t("logs.tableHeaders.status") }),
|
|
100
|
+
/* @__PURE__ */ jsx("th", { style: S.th, children: t("logs.tableHeaders.recipient") }),
|
|
101
|
+
/* @__PURE__ */ jsx("th", { style: S.th, children: t("logs.tableHeaders.subject") }),
|
|
102
|
+
/* @__PURE__ */ jsx("th", { style: S.th, children: t("logs.tableHeaders.action") }),
|
|
103
|
+
/* @__PURE__ */ jsx("th", { style: { ...S.th, textAlign: "right" }, children: t("logs.tableHeaders.time") })
|
|
104
|
+
] }) }),
|
|
105
|
+
/* @__PURE__ */ jsx("tbody", { children: logs.map((log) => /* @__PURE__ */ jsxs("tr", { children: [
|
|
106
|
+
/* @__PURE__ */ jsx("td", { style: { ...S.td, ...S.mono }, children: fmtDate(log.createdAt) }),
|
|
107
|
+
/* @__PURE__ */ jsx("td", { style: S.td, children: /* @__PURE__ */ jsx("span", { style: { ...S.badge, background: log.status === "success" ? "#dcfce7" : log.status === "error" ? "#fef2f2" : "#f3f4f6", color: log.status === "success" ? "#16a34a" : log.status === "error" ? "#dc2626" : "#6b7280" }, children: log.status === "success" ? t("logs.statusSuccess") : log.status === "error" ? t("logs.statusError") : t("logs.statusIgnored") }) }),
|
|
108
|
+
/* @__PURE__ */ jsx("td", { style: { ...S.td, maxWidth: 200, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, title: log.recipientEmail, children: log.recipientEmail || "--" }),
|
|
109
|
+
/* @__PURE__ */ jsx("td", { style: { ...S.td, maxWidth: 200, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, title: log.subject, children: log.subject || "--" }),
|
|
110
|
+
/* @__PURE__ */ jsx("td", { style: { ...S.td, fontSize: 12, color: "var(--theme-elevation-500)" }, children: log.action || "--" }),
|
|
111
|
+
/* @__PURE__ */ jsx("td", { style: { ...S.td, textAlign: "right" }, children: log.processingTimeMs != null ? /* @__PURE__ */ jsxs("span", { style: { ...S.mono, color: log.processingTimeMs > 2e3 ? "#dc2626" : "#16a34a" }, children: [
|
|
112
|
+
log.processingTimeMs,
|
|
113
|
+
"ms"
|
|
114
|
+
] }) : "--" })
|
|
115
|
+
] }, log.id)) })
|
|
116
|
+
] }) : /* @__PURE__ */ jsxs("table", { style: S.table, children: [
|
|
117
|
+
/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
|
|
118
|
+
/* @__PURE__ */ jsx("th", { style: S.th, children: t("logs.tableHeaders.date") }),
|
|
119
|
+
/* @__PURE__ */ jsx("th", { style: S.th, children: t("logs.tableHeaders.status") }),
|
|
120
|
+
/* @__PURE__ */ jsx("th", { style: S.th, children: t("logs.tableHeaders.email") }),
|
|
121
|
+
/* @__PURE__ */ jsx("th", { style: S.th, children: t("logs.tableHeaders.ip") }),
|
|
122
|
+
/* @__PURE__ */ jsx("th", { style: S.th, children: t("logs.tableHeaders.userAgent") })
|
|
123
|
+
] }) }),
|
|
124
|
+
/* @__PURE__ */ jsx("tbody", { children: logs.map((log) => /* @__PURE__ */ jsxs("tr", { children: [
|
|
125
|
+
/* @__PURE__ */ jsx("td", { style: { ...S.td, ...S.mono }, children: fmtDate(log.createdAt) }),
|
|
126
|
+
/* @__PURE__ */ jsx("td", { style: S.td, children: /* @__PURE__ */ jsx("span", { style: { ...S.badge, background: log.success ? "#dcfce7" : "#fef2f2", color: log.success ? "#16a34a" : "#dc2626" }, children: log.success ? t("logs.statusSuccess") : t("logs.statusFailed") }) }),
|
|
127
|
+
/* @__PURE__ */ jsx("td", { style: { ...S.td, ...S.mono }, children: log.email || "--" }),
|
|
128
|
+
/* @__PURE__ */ jsx("td", { style: { ...S.td, ...S.mono }, children: log.ip || "--" }),
|
|
129
|
+
/* @__PURE__ */ jsx("td", { style: { ...S.td, fontSize: 11, maxWidth: 200, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: log.userAgent || "--" })
|
|
130
|
+
] }, log.id)) })
|
|
131
|
+
] }),
|
|
132
|
+
totalDocs > 0 && /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "center", gap: 12, marginTop: 16, alignItems: "center" }, children: [
|
|
133
|
+
/* @__PURE__ */ jsx("button", { style: S.purgeBtn, onClick: () => setPage((p) => Math.max(1, p - 1)), disabled: page <= 1, children: t("common.previous") }),
|
|
134
|
+
/* @__PURE__ */ jsxs("span", { style: { fontSize: 12, color: "var(--theme-elevation-500)" }, children: [
|
|
135
|
+
t("common.page"),
|
|
136
|
+
" ",
|
|
137
|
+
page,
|
|
138
|
+
" -- ",
|
|
139
|
+
totalDocs,
|
|
140
|
+
" ",
|
|
141
|
+
t("common.results")
|
|
142
|
+
] }),
|
|
143
|
+
/* @__PURE__ */ jsx("button", { style: S.purgeBtn, onClick: () => setPage((p) => p + 1), disabled: !hasMore, children: t("common.next") })
|
|
144
|
+
] })
|
|
145
|
+
] });
|
|
146
|
+
};
|
|
147
|
+
|
|
148
|
+
export { LogsClient };
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { DefaultTemplate } from '@payloadcms/next/templates';
|
|
3
|
+
import { redirect } from 'next/navigation';
|
|
4
|
+
import { AdminErrorBoundary } from '../shared/ErrorBoundary';
|
|
5
|
+
import { LogsClient } from './client';
|
|
6
|
+
|
|
7
|
+
const LogsView = ({ initPageResult }) => {
|
|
8
|
+
const { req, visibleEntities } = initPageResult;
|
|
9
|
+
if (!req.user) redirect("/admin/login");
|
|
10
|
+
return /* @__PURE__ */ jsx(
|
|
11
|
+
DefaultTemplate,
|
|
12
|
+
{
|
|
13
|
+
i18n: req.i18n,
|
|
14
|
+
locale: initPageResult.locale,
|
|
15
|
+
params: {},
|
|
16
|
+
payload: req.payload,
|
|
17
|
+
permissions: initPageResult.permissions,
|
|
18
|
+
searchParams: {},
|
|
19
|
+
user: req.user,
|
|
20
|
+
visibleEntities,
|
|
21
|
+
children: /* @__PURE__ */ jsx(AdminErrorBoundary, { viewName: "LogsView", children: /* @__PURE__ */ jsx(LogsClient, {}) })
|
|
22
|
+
}
|
|
23
|
+
);
|
|
24
|
+
};
|
|
25
|
+
var LogsView_default = LogsView;
|
|
26
|
+
|
|
27
|
+
export { LogsView, LogsView_default as default };
|
|
@@ -0,0 +1,224 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
+
import { useState, useEffect } from 'react';
|
|
4
|
+
import Link from 'next/link';
|
|
5
|
+
import { useRouter } from 'next/navigation';
|
|
6
|
+
import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation';
|
|
7
|
+
|
|
8
|
+
const CATEGORY_KEYS = [
|
|
9
|
+
{ value: "", key: "ticket.category.select" },
|
|
10
|
+
{ value: "bug", key: "ticket.category.bugFull" },
|
|
11
|
+
{ value: "content", key: "ticket.category.contentFull" },
|
|
12
|
+
{ value: "feature", key: "ticket.category.featureFull" },
|
|
13
|
+
{ value: "question", key: "ticket.category.questionFull" },
|
|
14
|
+
{ value: "hosting", key: "ticket.category.hostingFull" }
|
|
15
|
+
];
|
|
16
|
+
const PRIORITY_KEYS = [
|
|
17
|
+
{ value: "low", key: "ticket.priority.low" },
|
|
18
|
+
{ value: "normal", key: "ticket.priority.normal" },
|
|
19
|
+
{ value: "high", key: "ticket.priority.high" },
|
|
20
|
+
{ value: "urgent", key: "ticket.priority.urgent" }
|
|
21
|
+
];
|
|
22
|
+
const NewTicketClient = () => {
|
|
23
|
+
const { t } = useTranslation();
|
|
24
|
+
const router = useRouter();
|
|
25
|
+
const [subject, setSubject] = useState("");
|
|
26
|
+
const [description, setDescription] = useState("");
|
|
27
|
+
const [category, setCategory] = useState("");
|
|
28
|
+
const [priority, setPriority] = useState("normal");
|
|
29
|
+
const [clientSearch, setClientSearch] = useState("");
|
|
30
|
+
const [clientId, setClientId] = useState(null);
|
|
31
|
+
const [clientResults, setClientResults] = useState([]);
|
|
32
|
+
const [selectedClient, setSelectedClient] = useState(null);
|
|
33
|
+
const [projectId, setProjectId] = useState(null);
|
|
34
|
+
const [projects, setProjects] = useState([]);
|
|
35
|
+
const [submitting, setSubmitting] = useState(false);
|
|
36
|
+
const [error, setError] = useState("");
|
|
37
|
+
useEffect(() => {
|
|
38
|
+
if (clientSearch.length < 2) {
|
|
39
|
+
setClientResults([]);
|
|
40
|
+
return;
|
|
41
|
+
}
|
|
42
|
+
const timer = setTimeout(async () => {
|
|
43
|
+
try {
|
|
44
|
+
const res = await fetch(`/api/support-clients?where[or][0][email][contains]=${encodeURIComponent(clientSearch)}&where[or][1][firstName][contains]=${encodeURIComponent(clientSearch)}&where[or][2][company][contains]=${encodeURIComponent(clientSearch)}&limit=8&depth=0`, { credentials: "include" });
|
|
45
|
+
if (res.ok) {
|
|
46
|
+
const d = await res.json();
|
|
47
|
+
setClientResults(d.docs || []);
|
|
48
|
+
}
|
|
49
|
+
} catch (err) {
|
|
50
|
+
console.warn("[support] client search error:", err);
|
|
51
|
+
}
|
|
52
|
+
}, 300);
|
|
53
|
+
return () => clearTimeout(timer);
|
|
54
|
+
}, [clientSearch]);
|
|
55
|
+
useEffect(() => {
|
|
56
|
+
fetch("/api/projects?where[status][equals]=active&limit=50&depth=0", { credentials: "include" }).then((r) => r.json()).then((d) => setProjects(d.docs || [])).catch(() => {
|
|
57
|
+
});
|
|
58
|
+
}, []);
|
|
59
|
+
const handleSubmit = async (e) => {
|
|
60
|
+
e.preventDefault();
|
|
61
|
+
setError("");
|
|
62
|
+
if (!subject.trim()) {
|
|
63
|
+
setError(t("newTicket.errors.subjectRequired"));
|
|
64
|
+
return;
|
|
65
|
+
}
|
|
66
|
+
if (!clientId) {
|
|
67
|
+
setError(t("newTicket.errors.clientRequired"));
|
|
68
|
+
return;
|
|
69
|
+
}
|
|
70
|
+
setSubmitting(true);
|
|
71
|
+
try {
|
|
72
|
+
const res = await fetch("/api/tickets", {
|
|
73
|
+
method: "POST",
|
|
74
|
+
headers: { "Content-Type": "application/json" },
|
|
75
|
+
credentials: "include",
|
|
76
|
+
body: JSON.stringify({
|
|
77
|
+
subject: subject.trim(),
|
|
78
|
+
client: clientId,
|
|
79
|
+
category: category || void 0,
|
|
80
|
+
priority,
|
|
81
|
+
project: projectId || void 0,
|
|
82
|
+
source: "admin",
|
|
83
|
+
status: "open"
|
|
84
|
+
})
|
|
85
|
+
});
|
|
86
|
+
if (!res.ok) {
|
|
87
|
+
const d = await res.json().catch(() => ({}));
|
|
88
|
+
setError(d.errors?.[0]?.message || t("newTicket.errors.creationError"));
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
const ticket = await res.json();
|
|
92
|
+
if (description.trim()) {
|
|
93
|
+
await fetch("/api/ticket-messages", {
|
|
94
|
+
method: "POST",
|
|
95
|
+
headers: { "Content-Type": "application/json" },
|
|
96
|
+
credentials: "include",
|
|
97
|
+
body: JSON.stringify({
|
|
98
|
+
ticket: ticket.doc.id,
|
|
99
|
+
body: description.trim(),
|
|
100
|
+
authorType: "admin",
|
|
101
|
+
isInternal: false
|
|
102
|
+
})
|
|
103
|
+
});
|
|
104
|
+
}
|
|
105
|
+
router.push(`/admin/support/ticket?id=${ticket.doc.id}`);
|
|
106
|
+
} catch {
|
|
107
|
+
setError(t("newTicket.errors.networkError"));
|
|
108
|
+
} finally {
|
|
109
|
+
setSubmitting(false);
|
|
110
|
+
}
|
|
111
|
+
};
|
|
112
|
+
const S = {
|
|
113
|
+
page: { padding: "20px 30px", maxWidth: 720, margin: "0 auto" },
|
|
114
|
+
header: { marginBottom: 24 },
|
|
115
|
+
backLink: { fontSize: 13, color: "#2563eb", textDecoration: "none" },
|
|
116
|
+
title: { fontSize: 24, fontWeight: 700, margin: "8px 0 4px", color: "var(--theme-text)" },
|
|
117
|
+
subtitle: { fontSize: 14, color: "var(--theme-elevation-500)" },
|
|
118
|
+
error: { padding: "10px 14px", borderRadius: 8, background: "#fef2f2", color: "#dc2626", fontSize: 13, marginBottom: 16, border: "1px solid #fecaca" },
|
|
119
|
+
fieldGroup: { marginBottom: 16 },
|
|
120
|
+
label: { display: "block", fontSize: 13, fontWeight: 600, marginBottom: 6, color: "var(--theme-text)" },
|
|
121
|
+
required: { color: "#dc2626" },
|
|
122
|
+
input: { width: "100%", padding: "8px 12px", borderRadius: 8, border: "1px solid var(--theme-elevation-200)", fontSize: 13, color: "var(--theme-text)", background: "var(--theme-elevation-0)" },
|
|
123
|
+
select: { width: "100%", padding: "8px 12px", borderRadius: 8, border: "1px solid var(--theme-elevation-200)", fontSize: 13, color: "var(--theme-text)", background: "var(--theme-elevation-0)" },
|
|
124
|
+
textarea: { width: "100%", padding: "8px 12px", borderRadius: 8, border: "1px solid var(--theme-elevation-200)", fontSize: 13, color: "var(--theme-text)", background: "var(--theme-elevation-0)", minHeight: 120, fontFamily: "inherit", resize: "vertical" },
|
|
125
|
+
row3: { display: "grid", gridTemplateColumns: "1fr 1fr 1fr", gap: 12, marginBottom: 16 },
|
|
126
|
+
submitBtn: { padding: "10px 20px", borderRadius: 8, background: "#2563eb", color: "#fff", fontSize: 14, fontWeight: 600, border: "none", cursor: "pointer" },
|
|
127
|
+
searchResults: { position: "absolute", top: "100%", left: 0, right: 0, background: "var(--theme-elevation-0)", border: "1px solid var(--theme-elevation-200)", borderRadius: 8, boxShadow: "0 4px 12px rgba(0,0,0,0.1)", zIndex: 50, maxHeight: 200, overflowY: "auto" },
|
|
128
|
+
searchItem: { padding: "8px 12px", cursor: "pointer", fontSize: 13, borderBottom: "1px solid var(--theme-elevation-100)" }
|
|
129
|
+
};
|
|
130
|
+
return /* @__PURE__ */ jsxs("div", { style: S.page, children: [
|
|
131
|
+
/* @__PURE__ */ jsxs("div", { style: S.header, children: [
|
|
132
|
+
/* @__PURE__ */ jsxs(Link, { href: "/admin/support/inbox", style: S.backLink, children: [
|
|
133
|
+
"\u2190 ",
|
|
134
|
+
t("newTicket.backToInbox")
|
|
135
|
+
] }),
|
|
136
|
+
/* @__PURE__ */ jsx("h1", { style: S.title, children: t("newTicket.title") }),
|
|
137
|
+
/* @__PURE__ */ jsx("p", { style: S.subtitle, children: t("newTicket.subtitle") })
|
|
138
|
+
] }),
|
|
139
|
+
error && /* @__PURE__ */ jsx("div", { style: S.error, children: error }),
|
|
140
|
+
/* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, children: [
|
|
141
|
+
/* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
|
|
142
|
+
/* @__PURE__ */ jsxs("label", { style: S.label, children: [
|
|
143
|
+
t("newTicket.clientLabel"),
|
|
144
|
+
" ",
|
|
145
|
+
/* @__PURE__ */ jsx("span", { style: S.required, children: "*" })
|
|
146
|
+
] }),
|
|
147
|
+
selectedClient ? /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 10, padding: "8px 14px", borderRadius: 10, border: "1px solid var(--theme-elevation-200)", background: "var(--theme-elevation-50)" }, children: [
|
|
148
|
+
/* @__PURE__ */ jsxs("span", { style: { fontWeight: 600, fontSize: 13, color: "var(--theme-text)" }, children: [
|
|
149
|
+
selectedClient.firstName,
|
|
150
|
+
" ",
|
|
151
|
+
selectedClient.lastName,
|
|
152
|
+
" -- ",
|
|
153
|
+
selectedClient.company
|
|
154
|
+
] }),
|
|
155
|
+
/* @__PURE__ */ jsx("span", { style: { fontSize: 12, color: "var(--theme-elevation-500)" }, children: selectedClient.email }),
|
|
156
|
+
/* @__PURE__ */ jsx("button", { type: "button", onClick: () => {
|
|
157
|
+
setSelectedClient(null);
|
|
158
|
+
setClientId(null);
|
|
159
|
+
setClientSearch("");
|
|
160
|
+
}, style: { marginLeft: "auto", background: "none", border: "none", cursor: "pointer", color: "var(--theme-elevation-400)", fontSize: 16 }, children: "\xD7" })
|
|
161
|
+
] }) : /* @__PURE__ */ jsxs("div", { style: { position: "relative" }, children: [
|
|
162
|
+
/* @__PURE__ */ jsx(
|
|
163
|
+
"input",
|
|
164
|
+
{
|
|
165
|
+
type: "text",
|
|
166
|
+
style: S.input,
|
|
167
|
+
placeholder: t("newTicket.clientSearchPlaceholder"),
|
|
168
|
+
value: clientSearch,
|
|
169
|
+
onChange: (e) => setClientSearch(e.target.value)
|
|
170
|
+
}
|
|
171
|
+
),
|
|
172
|
+
clientResults.length > 0 && /* @__PURE__ */ jsx("div", { style: S.searchResults, children: clientResults.map((c) => /* @__PURE__ */ jsxs("div", { style: S.searchItem, onClick: () => {
|
|
173
|
+
setSelectedClient(c);
|
|
174
|
+
setClientId(c.id);
|
|
175
|
+
setClientSearch("");
|
|
176
|
+
setClientResults([]);
|
|
177
|
+
}, children: [
|
|
178
|
+
/* @__PURE__ */ jsxs("strong", { children: [
|
|
179
|
+
c.firstName,
|
|
180
|
+
" ",
|
|
181
|
+
c.lastName
|
|
182
|
+
] }),
|
|
183
|
+
" -- ",
|
|
184
|
+
c.company,
|
|
185
|
+
" ",
|
|
186
|
+
/* @__PURE__ */ jsx("span", { style: { color: "var(--theme-elevation-400)", fontSize: 12 }, children: c.email })
|
|
187
|
+
] }, c.id)) })
|
|
188
|
+
] })
|
|
189
|
+
] }),
|
|
190
|
+
/* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
|
|
191
|
+
/* @__PURE__ */ jsxs("label", { style: S.label, children: [
|
|
192
|
+
t("newTicket.subjectLabel"),
|
|
193
|
+
" ",
|
|
194
|
+
/* @__PURE__ */ jsx("span", { style: S.required, children: "*" })
|
|
195
|
+
] }),
|
|
196
|
+
/* @__PURE__ */ jsx("input", { type: "text", style: S.input, placeholder: t("newTicket.subjectPlaceholder"), value: subject, onChange: (e) => setSubject(e.target.value) })
|
|
197
|
+
] }),
|
|
198
|
+
/* @__PURE__ */ jsxs("div", { style: S.row3, children: [
|
|
199
|
+
/* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
|
|
200
|
+
/* @__PURE__ */ jsx("label", { style: S.label, children: t("newTicket.categoryLabel") }),
|
|
201
|
+
/* @__PURE__ */ jsx("select", { style: S.select, value: category, onChange: (e) => setCategory(e.target.value), children: CATEGORY_KEYS.map((c) => /* @__PURE__ */ jsx("option", { value: c.value, children: t(c.key) }, c.value)) })
|
|
202
|
+
] }),
|
|
203
|
+
/* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
|
|
204
|
+
/* @__PURE__ */ jsx("label", { style: S.label, children: t("newTicket.priorityLabel") }),
|
|
205
|
+
/* @__PURE__ */ jsx("select", { style: S.select, value: priority, onChange: (e) => setPriority(e.target.value), children: PRIORITY_KEYS.map((p) => /* @__PURE__ */ jsx("option", { value: p.value, children: t(p.key) }, p.value)) })
|
|
206
|
+
] }),
|
|
207
|
+
/* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
|
|
208
|
+
/* @__PURE__ */ jsx("label", { style: S.label, children: t("newTicket.projectLabel") }),
|
|
209
|
+
/* @__PURE__ */ jsxs("select", { style: S.select, value: projectId || "", onChange: (e) => setProjectId(e.target.value ? Number(e.target.value) : null), children: [
|
|
210
|
+
/* @__PURE__ */ jsx("option", { value: "", children: t("ticket.noProject") }),
|
|
211
|
+
projects.map((p) => /* @__PURE__ */ jsx("option", { value: p.id, children: p.name }, p.id))
|
|
212
|
+
] })
|
|
213
|
+
] })
|
|
214
|
+
] }),
|
|
215
|
+
/* @__PURE__ */ jsxs("div", { style: S.fieldGroup, children: [
|
|
216
|
+
/* @__PURE__ */ jsx("label", { style: S.label, children: t("newTicket.descriptionLabel") }),
|
|
217
|
+
/* @__PURE__ */ jsx("textarea", { style: S.textarea, placeholder: t("newTicket.descriptionPlaceholder"), value: description, onChange: (e) => setDescription(e.target.value) })
|
|
218
|
+
] }),
|
|
219
|
+
/* @__PURE__ */ jsx("button", { type: "submit", style: S.submitBtn, disabled: submitting, children: submitting ? t("newTicket.submitting") : t("newTicket.submitButton") })
|
|
220
|
+
] })
|
|
221
|
+
] });
|
|
222
|
+
};
|
|
223
|
+
|
|
224
|
+
export { NewTicketClient };
|