@consilioweb/payload-support 0.15.0 → 1.0.0

package/dist/views/TicketDetailView/client.js

@@ -9,141 +9,13 @@ import { CodeBlockInserter } from '../../components/TicketConversation/component
 import { getFeatures } from '../shared/config.js';
 import { computeSlaState, formatSlaRemaining } from '../shared/sla.js';
 import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation.js';
+import { DATE_LOCALE } from '../shared/dateLocale.js';
 import s from '../../styles/TicketDetail.module.scss';
+import { STATUS_STYLE, ALIASES } from './constants.js';
+import { dateLabel, timeAgo } from './helpers.js';
+import { RewriteDropdown } from './RewriteDropdown.js';
+import { NextActionItem } from './NextActionItem.js';
 
-const ALIASES = [
-  { value: "Support Consilioweb", label: "En tant que : Support Consilioweb" },
-  { value: "contact@consilioweb.fr", label: "En tant que : contact@consilioweb.fr" }
-];
-const STATUS_STYLE = {
-  open: { bg: "#dbeafe", color: "#1e40af" },
-  waiting_client: { bg: "#fef3c7", color: "#92400e" },
-  resolved: { bg: "#dcfce7", color: "#166534" }
-};
-function timeAgo(d) {
-  const date = new Date(d), now = /* @__PURE__ */ new Date();
-  if (date.toDateString() === now.toDateString()) return date.toLocaleTimeString("fr-FR", { hour: "2-digit", minute: "2-digit" });
-  const y = new Date(now);
-  y.setDate(y.getDate() - 1);
-  if (date.toDateString() === y.toDateString()) return `Hier, ${date.toLocaleTimeString("fr-FR", { hour: "2-digit", minute: "2-digit" })}`;
-  return date.toLocaleDateString("fr-FR", { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" });
-}
-function dateLabel(d) {
-  const date = new Date(d), now = /* @__PURE__ */ new Date();
-  if (date.toDateString() === now.toDateString()) return "Aujourd'hui";
-  const y = new Date(now);
-  y.setDate(y.getDate() - 1);
-  if (date.toDateString() === y.toDateString()) return "Hier";
-  return date.toLocaleDateString("fr-FR", { day: "numeric", month: "long" });
-}
-const REWRITE_STYLES = [
-  { id: "auto", label: "\u270F\uFE0F Auto", desc: "Garde le ton actuel" },
-  { id: "tutoyer", label: "\u{1F44B} Tutoyer", desc: "Passe en tu" },
-  { id: "vouvoyer", label: "\u{1F3A9} Vouvoyer", desc: "Passe en vous" },
-  { id: "formel", label: "\u{1F4BC} Formel", desc: "Ton professionnel" },
-  { id: "amical", label: "\u{1F60A} Amical", desc: "Ton chaleureux" },
-  { id: "court", label: "\u26A1 Court", desc: "Version concise" }
-];
-const RewriteDropdown = ({ disabled, loading, onSelect, toolbarBtnClass }) => {
-  const [open, setOpen] = useState(false);
-  const ref = useRef(null);
-  useEffect(() => {
-    if (!open) return;
-    const close = (e) => {
-      if (ref.current && !ref.current.contains(e.target)) setOpen(false);
-    };
-    document.addEventListener("mousedown", close);
-    return () => document.removeEventListener("mousedown", close);
-  }, [open]);
-  return /* @__PURE__ */ jsxs("div", { ref, style: { position: "relative", display: "inline-block" }, children: [
-    /* @__PURE__ */ jsxs(
-      "button",
-      {
-        type: "button",
-        className: toolbarBtnClass,
-        onClick: () => setOpen(!open),
-        disabled,
-        style: { fontSize: 11, fontWeight: 700, padding: "4px 10px", width: "auto", display: "flex", alignItems: "center", gap: 4 },
-        children: [
-          loading ? "..." : "\u270F\uFE0F Reformuler",
-          !loading && /* @__PURE__ */ jsx("span", { style: { fontSize: 9, opacity: 0.6 }, children: "\u25BC" })
-        ]
-      }
-    ),
-    open && !disabled && !loading && /* @__PURE__ */ jsx("div", { style: {
-      position: "absolute",
-      bottom: "100%",
-      left: 0,
-      marginBottom: 4,
-      background: "#fff",
-      border: "1px solid #e5e7eb",
-      borderRadius: 8,
-      boxShadow: "0 4px 16px rgba(0,0,0,0.12)",
-      zIndex: 100,
-      minWidth: 180,
-      overflow: "hidden"
-    }, children: REWRITE_STYLES.map((style) => /* @__PURE__ */ jsxs(
-      "button",
-      {
-        type: "button",
-        onClick: () => {
-          setOpen(false);
-          onSelect(style.id);
-        },
-        style: {
-          display: "flex",
-          flexDirection: "column",
-          width: "100%",
-          padding: "8px 12px",
-          border: "none",
-          background: "transparent",
-          cursor: "pointer",
-          textAlign: "left",
-          borderBottom: "1px solid #f3f4f6"
-        },
-        onMouseEnter: (e) => {
-          e.currentTarget.style.background = "#f9fafb";
-        },
-        onMouseLeave: (e) => {
-          e.currentTarget.style.background = "transparent";
-        },
-        children: [
-          /* @__PURE__ */ jsx("span", { style: { fontSize: 12, fontWeight: 600 }, children: style.label }),
-          /* @__PURE__ */ jsx("span", { style: { fontSize: 10, color: "#9ca3af" }, children: style.desc })
-        ]
-      },
-      style.id
-    )) })
-  ] });
-};
-function NextActionItem({ action, index, onToggle }) {
-  const [pending, setPending] = useState(false);
-  const labelMap = { now: "Maintenant", today: "Aujourd'hui", "this-week": "Cette semaine" };
-  const done = !!action.done;
-  return /* @__PURE__ */ jsxs("li", { className: s.aiCardNextAction, children: [
-    /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        className: `${s.aiCardNextCheck} ${done ? s.aiCardNextCheckDone : ""}`,
-        onClick: async () => {
-          setPending(true);
-          try {
-            await onToggle(!done);
-          } finally {
-            setPending(false);
-          }
-        },
-        "aria-pressed": done,
-        "aria-label": done ? "Marquer non fait" : "Marquer fait",
-        disabled: pending,
-        children: done && /* @__PURE__ */ jsx("span", { "aria-hidden": true, children: "\u2713" })
-      }
-    ),
-    /* @__PURE__ */ jsx("span", { className: `${s.aiCardNextLabel} ${done ? s.aiCardNextLabelDone : ""}`, children: action.label }),
-    /* @__PURE__ */ jsx("span", { className: s.aiCardNextWhen, children: labelMap[action.priority] || action.priority })
-  ] });
-}
 const TicketDetailClient = () => {
   const { t } = useTranslation();
   const searchParams = useSearchParams();
@@ -703,7 +575,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
   const initials = client ? `${(client.firstName?.[0] || "").toUpperCase()}${(client.lastName?.[0] || "").toUpperCase()}` : "?";
   return /* @__PURE__ */ jsxs("div", { className: s.page, children: [
     /* @__PURE__ */ jsxs("div", { className: s.topBar, children: [
-      /* @__PURE__ */ jsx(Link, { href: "/admin/support/inbox", className: s.backLink, "aria-label": "Retour \xE0 la bo\xEEte de r\xE9ception", children: "\u2190" }),
+      /* @__PURE__ */ jsx(Link, { href: "/admin/support/inbox", className: s.backLink, "aria-label": t("detail.backToInbox"), children: "\u2190" }),
       /* @__PURE__ */ jsxs("div", { className: s.ticketMeta, children: [
         /* @__PURE__ */ jsxs("span", { className: s.ticketNumber, children: [
           /* @__PURE__ */ jsx("span", { children: ticket.ticketNumber }),
@@ -756,7 +628,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
       });
       if (slaInfo.state !== "breach") return null;
       const duration = formatSlaRemaining(slaInfo.remainingMs).replace(/^−/, "");
-      const target = slaInfo.due ? new Date(slaInfo.due).toLocaleString("fr-FR", { day: "2-digit", month: "short", hour: "2-digit", minute: "2-digit" }) : "";
+      const target = slaInfo.due ? new Date(slaInfo.due).toLocaleString(DATE_LOCALE, { day: "2-digit", month: "short", hour: "2-digit", minute: "2-digit" }) : "";
       return /* @__PURE__ */ jsxs("div", { className: s.slaBanner, role: "alert", children: [
         /* @__PURE__ */ jsx("span", { className: s.slaBannerIcon, "aria-hidden": true, children: /* @__PURE__ */ jsxs("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
           /* @__PURE__ */ jsx("path", { d: "M12 9v4M12 17h.01" }),
@@ -827,19 +699,19 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                   /* @__PURE__ */ jsxs("div", { className: s.messageHeader, children: [
                     /* @__PURE__ */ jsx("span", { className: s.messageAuthor, children: msg.fromAlias || (isAdmin ? "Support" : msg.authorType === "email" ? "Email" : client?.firstName || "Client") }),
                     /* @__PURE__ */ jsx("span", { className: s.messageTime, children: timeAgo(msg.createdAt) }),
-                    msg.isInternal && /* @__PURE__ */ jsx("span", { className: s.badge, style: { background: "#fef3c7", color: "#92400e" }, children: "Interne" }),
-                    msg.isSolution && /* @__PURE__ */ jsx("span", { className: s.badge, style: { background: "#dcfce7", color: "#166534" }, children: "Solution" }),
+                    msg.isInternal && /* @__PURE__ */ jsx("span", { className: s.badge, style: { background: "#fef3c7", color: "#92400e" }, children: t("detail.badgeInternal") }),
+                    msg.isSolution && /* @__PURE__ */ jsx("span", { className: s.badge, style: { background: "#dcfce7", color: "#166534" }, children: t("detail.badgeSolution") }),
                     /* @__PURE__ */ jsx("span", { className: s.messageMeta, children: isAdmin && !msg.isInternal && (() => {
                       const ext = msg;
                       if (ext.emailOpenedAt) {
-                        const d = new Date(ext.emailOpenedAt).toLocaleString("fr-FR", { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" });
+                        const d = new Date(ext.emailOpenedAt).toLocaleString(DATE_LOCALE, { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" });
                         return /* @__PURE__ */ jsxs("span", { style: { color: "#16a34a", cursor: "help" }, title: `Ouvert le ${d}`, children: [
                           "\u2713\u2713 Lu ",
                           d
                         ] });
                       }
                       if (ext.emailSentAt) {
-                        const d = new Date(ext.emailSentAt).toLocaleString("fr-FR", { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" });
+                        const d = new Date(ext.emailSentAt).toLocaleString(DATE_LOCALE, { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" });
                         return /* @__PURE__ */ jsxs("span", { style: { color: "#2563eb", cursor: "help" }, title: `Envoy\xE9 le ${d}`, children: [
                           "\u2713 Envoy\xE9 ",
                           d
@@ -858,7 +730,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                           setEditingHtml(html);
                           setEditingBody(text);
                         },
-                        placeholder: "\xC9diter le message...",
+                        placeholder: t("detail.editPlaceholder"),
                         minHeight: 120,
                         onFileUpload: async (file) => {
                           try {
@@ -876,8 +748,8 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                       }
                     ),
                     /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 6, justifyContent: "flex-end" }, children: [
-                      /* @__PURE__ */ jsx("button", { onClick: cancelEditMessage, disabled: editSaving, style: { padding: "5px 12px", fontSize: 12, borderRadius: 5, border: "1px solid var(--theme-elevation-200)", background: "var(--theme-elevation-0)", color: "var(--theme-text)", cursor: "pointer" }, children: "Annuler" }),
-                      /* @__PURE__ */ jsx("button", { onClick: saveEditMessage, disabled: editSaving || !editingBody.trim(), style: { padding: "5px 12px", fontSize: 12, fontWeight: 600, borderRadius: 5, border: "none", background: "#2563eb", color: "#fff", cursor: editSaving ? "wait" : "pointer", opacity: editSaving ? 0.6 : 1 }, children: editSaving ? "Sauvegarde\u2026" : "Enregistrer" })
+                      /* @__PURE__ */ jsx("button", { onClick: cancelEditMessage, disabled: editSaving, style: { padding: "5px 12px", fontSize: 12, borderRadius: 5, border: "1px solid var(--theme-elevation-200)", background: "var(--theme-elevation-0)", color: "var(--theme-text)", cursor: "pointer" }, children: t("common.cancel") }),
+                      /* @__PURE__ */ jsx("button", { onClick: saveEditMessage, disabled: editSaving || !editingBody.trim(), style: { padding: "5px 12px", fontSize: 12, fontWeight: 600, borderRadius: 5, border: "none", background: "#2563eb", color: "#fff", cursor: editSaving ? "wait" : "pointer", opacity: editSaving ? 0.6 : 1 }, children: editSaving ? t("detail.editSaving") : t("detail.editSave") })
                     ] })
                   ] }) : msg.deletedAt ? /* @__PURE__ */ jsx("div", { className: s.messageBody, style: { color: "#94a3b8", fontStyle: "italic" }, children: t("detail.messageDeleted") }) : msg.bodyHtml && hasCodeBlocks(msg.bodyHtml.replace(/<[^>]+>/g, "")) ? /* @__PURE__ */ jsx(CodeBlockRendererHtml, { html: msg.bodyHtml }) : msg.bodyHtml ? /* @__PURE__ */ jsx("div", { className: `${s.messageBody} ${s.rteDisplay}`, dangerouslySetInnerHTML: { __html: msg.bodyHtml } }) : hasCodeBlocks(msg.body) ? /* @__PURE__ */ jsx(MessageWithCodeBlocks, { text: msg.body, style: { fontSize: "13px", lineHeight: 1.5 } }) : /* @__PURE__ */ jsx("div", { className: s.messageBody, children: msg.body }),
                   Array.isArray(msg.attachments) && msg.attachments.length > 0 && /* @__PURE__ */ jsx("div", { className: s.attachments, children: msg.attachments.map((att, i) => {
@@ -890,7 +762,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                   }) })
                 ] }),
                 editingMsgId !== msg.id && !msg.deletedAt && /* @__PURE__ */ jsxs("div", { className: s.messageActions, children: [
-                  /* @__PURE__ */ jsx("button", { className: s.actionIcon, title: "\xC9diter", "aria-label": "\xC9diter le message", onClick: () => startEditMessage(msg), style: { fontSize: 11, width: "auto", padding: "4px 8px" }, children: "\xC9diter" }),
+                  /* @__PURE__ */ jsx("button", { className: s.actionIcon, title: t("detail.editMessage"), "aria-label": t("detail.editMessageLabel"), onClick: () => startEditMessage(msg), style: { fontSize: 11, width: "auto", padding: "4px 8px" }, children: t("detail.editMessage") }),
                   /* @__PURE__ */ jsx("button", { className: `${s.actionIcon} ${s.danger}`, title: t("actions.deleteMessage"), "aria-label": t("actions.deleteMessage"), onClick: () => handleDeleteMessage(msg.id), style: { fontSize: 11, width: "auto", padding: "4px 8px" }, children: t("actions.deleteMessage") }),
                   features.splitTicket && !msg.isInternal && /* @__PURE__ */ jsx("button", { className: s.actionIcon, title: t("actions.extractMessage"), "aria-label": t("actions.extractToNewTicket"), onClick: () => {
                     setSplitModal({ messageId: msg.id, preview: msg.body.slice(0, 200) });
@@ -986,7 +858,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                     },
                     disabled: applyingMacro,
                     style: { marginLeft: 0 },
-                    "aria-label": "Appliquer une macro",
+                    "aria-label": t("detail.macros"),
                     children: [
                       /* @__PURE__ */ jsx("option", { value: "", children: applyingMacro ? t("detail.applyingMacro") : t("detail.macros") }),
                       macros.map((m) => /* @__PURE__ */ jsx("option", { value: m.id, children: m.name }, m.id))
@@ -994,7 +866,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                   }
                 ),
                 /* @__PURE__ */ jsx("span", { className: s.toolbarDivider }),
-                features.canned && cannedResponses.length > 0 && /* @__PURE__ */ jsxs("select", { className: s.cannedSelect, "aria-label": "R\xE9ponses types", onChange: (e) => {
+                features.canned && cannedResponses.length > 0 && /* @__PURE__ */ jsxs("select", { className: s.cannedSelect, "aria-label": t("detail.cannedResponses"), onChange: (e) => {
                   const cr = cannedResponses.find((c) => String(c.id) === e.target.value);
                   if (cr) {
                     let b = cr.body;
@@ -1039,11 +911,8 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                   }
                 ),
                 pendingFiles.length > 0 && /* @__PURE__ */ jsx("div", { className: s.uploadPreview, children: pendingFiles.map((f, i) => /* @__PURE__ */ jsxs("div", { className: s.uploadPreviewItem, children: [
-                  /* @__PURE__ */ jsxs("span", { children: [
-                    "PJ ",
-                    f.name
-                  ] }),
-                  /* @__PURE__ */ jsx("button", { className: s.uploadRemoveBtn, "aria-label": `Retirer ${f.name}`, onClick: () => setPendingFiles((prev) => prev.filter((_, j) => j !== i)), children: "\xD7" })
+                  /* @__PURE__ */ jsx("span", { children: t("detail.uploadItem", { name: f.name }) }),
+                  /* @__PURE__ */ jsx("button", { className: s.uploadRemoveBtn, "aria-label": t("detail.removeUpload", { name: f.name }), onClick: () => setPendingFiles((prev) => prev.filter((_, j) => j !== i)), children: "\xD7" })
                 ] }, i)) })
               ] }),
               /* @__PURE__ */ jsxs("div", { className: s.composerFooter, children: [
@@ -1062,8 +931,8 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                       },
                       style: { fontSize: "12px", padding: "4px 8px", fontWeight: 600, borderRadius: 6, border: "1px solid var(--theme-elevation-200)", background: "var(--theme-elevation-0)", color: "var(--theme-text)" },
                       children: [
-                        /* @__PURE__ */ jsx("option", { value: "admin", children: "En tant que : Support" }),
-                        /* @__PURE__ */ jsx("option", { value: "client", children: "En tant que : Client" })
+                        /* @__PURE__ */ jsx("option", { value: "admin", children: t("detail.sendAsSupport") }),
+                        /* @__PURE__ */ jsx("option", { value: "client", children: t("detail.sendAsClient") })
                       ]
                     }
                   ),
@@ -1098,7 +967,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                   /* @__PURE__ */ jsx("kbd", { children: "\u2318" }),
                   /* @__PURE__ */ jsx("kbd", { children: "\u21B5" })
                 ] }),
-                /* @__PURE__ */ jsx("button", { className: `${s.sendBtn} ${isInternal ? s.sendBtnInternal : ""}`, onClick: handleSend, disabled: sending || !replyBody.trim(), "data-action": "send-reply", children: sending ? t("detail.sending") : sendAsClient ? "Ajouter message client" : isInternal ? t("detail.sendNote") : t("detail.sendReply") })
+                /* @__PURE__ */ jsx("button", { className: `${s.sendBtn} ${isInternal ? s.sendBtnInternal : ""}`, onClick: handleSend, disabled: sending || !replyBody.trim(), "data-action": "send-reply", children: sending ? t("detail.sending") : sendAsClient ? t("detail.addClientMessage") : isInternal ? t("detail.sendNote") : t("detail.sendReply") })
               ] })
             ]
           }
@@ -1171,7 +1040,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
           clientSummary && clientSummary.summary && /* @__PURE__ */ jsxs("div", { className: `${s.sideSection} ${s.aiCard}`, children: [
             /* @__PURE__ */ jsxs("div", { className: s.aiCardTitle, children: [
               /* @__PURE__ */ jsx("span", { className: s.aiCardIcon, "aria-hidden": true, children: "\u2728" }),
-              "Synth\xE8se client"
+              t("detail.aiCard.title")
             ] }),
             /* @__PURE__ */ jsx("p", { className: s.aiCardLead, children: clientSummary.summary }),
             clientSummary.recurringTopics && clientSummary.recurringTopics.length > 0 && /* @__PURE__ */ jsx("div", { className: s.aiCardChips, children: clientSummary.recurringTopics.slice(0, 5).map((tp, i) => /* @__PURE__ */ jsx("span", { className: s.aiChip, children: tp.topic }, `tp-${i}`)) }),
@@ -1250,12 +1119,12 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                 ":",
                 String(timerSeconds % 60).padStart(2, "0")
               ] }),
-              !timerRunning ? /* @__PURE__ */ jsx("button", { className: s.timerBtn, onClick: () => setTimerRunning(true), "aria-label": "D\xE9marrer le timer", children: timerSeconds > 0 ? "\u25B6" : "\u25B6 Go" }) : /* @__PURE__ */ jsx("button", { className: `${s.timerBtn} ${s.timerBtnRunning}`, onClick: () => setTimerRunning(false), "aria-label": "Mettre en pause le timer", children: "\u23F8 Pause" }),
+              !timerRunning ? /* @__PURE__ */ jsx("button", { className: s.timerBtn, onClick: () => setTimerRunning(true), "aria-label": t("detail.timerStart"), children: timerSeconds > 0 ? "\u25B6" : "\u25B6 Go" }) : /* @__PURE__ */ jsx("button", { className: `${s.timerBtn} ${s.timerBtnRunning}`, onClick: () => setTimerRunning(false), "aria-label": t("detail.timerPause"), children: "\u23F8 Pause" }),
               timerSeconds >= 60 && !timerRunning && /* @__PURE__ */ jsxs("button", { className: `${s.timerBtn} ${s.timerBtnGhost}`, onClick: () => {
                 handleTimerSave();
                 localStorage.removeItem(`timer-sec-${ticketId}`);
                 localStorage.removeItem(`timer-run-${ticketId}`);
-              }, "aria-label": "Sauvegarder le temps", children: [
+              }, "aria-label": t("detail.timerSave"), children: [
                 "\u{1F4BE} ",
                 Math.round(timerSeconds / 60),
                 "m"
@@ -1274,11 +1143,11 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                   fetchAll();
                 } catch {
                 }
-              }, style: { fontSize: 11 }, children: "+ Ajouter" })
+              }, style: { fontSize: 11 }, children: t("detail.addTime") })
             ] }),
             /* @__PURE__ */ jsxs("div", { style: { marginTop: 8, fontSize: 11, color: "var(--theme-elevation-500)" }, children: [
               /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", padding: "2px 0", alignItems: "center" }, children: [
-                /* @__PURE__ */ jsx("span", { children: "Facturable" }),
+                /* @__PURE__ */ jsx("span", { children: t("detail.billing.billable") }),
                 /* @__PURE__ */ jsx(
                   "button",
                   {
@@ -1291,12 +1160,12 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                       }
                     },
                     style: { fontWeight: 600, color: ticket.billable !== false ? "#16a34a" : "#dc2626", background: "none", border: "none", cursor: "pointer", fontSize: 11, textDecoration: "underline" },
-                    children: ticket.billable !== false ? "Oui" : "Non"
+                    children: ticket.billable !== false ? t("detail.billing.yes") : t("detail.billing.no")
                   }
                 )
               ] }),
               totalMin > 0 && /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", padding: "2px 0" }, children: [
-                /* @__PURE__ */ jsx("span", { children: "Montant estim\xE9" }),
+                /* @__PURE__ */ jsx("span", { children: t("detail.billing.estimatedAmount") }),
                 /* @__PURE__ */ jsxs("span", { style: { fontWeight: 700, color: "var(--theme-text)" }, children: [
                   (totalMin / 60 * 60).toFixed(0),
                   "\u20AC"
@@ -1304,7 +1173,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
               ] })
             ] }),
             timeEntries.length > 0 && /* @__PURE__ */ jsx("div", { style: { marginTop: 8, fontSize: 11 }, children: timeEntries.slice(0, 6).map((e) => /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", padding: "3px 0", color: "var(--theme-elevation-500)" }, children: [
-              /* @__PURE__ */ jsx("span", { children: new Date(e.date).toLocaleDateString("fr-FR", { day: "numeric", month: "short" }) }),
+              /* @__PURE__ */ jsx("span", { children: new Date(e.date).toLocaleDateString(DATE_LOCALE, { day: "numeric", month: "short" }) }),
               /* @__PURE__ */ jsxs("span", { title: e.description, style: { fontWeight: 600, cursor: e.description ? "help" : "default" }, children: [
                 e.duration,
                 "min"
@@ -1316,7 +1185,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
             /* @__PURE__ */ jsxs("div", { className: s.tagsWrap, children: [
               tags.map((tag) => /* @__PURE__ */ jsxs("span", { className: s.tagChip, children: [
                 tag,
-                /* @__PURE__ */ jsx("button", { className: s.tagRemove, "aria-label": `Retirer le tag ${tag}`, onClick: () => handleRemoveTag(tag), children: "\xD7" })
+                /* @__PURE__ */ jsx("button", { className: s.tagRemove, "aria-label": t("detail.removeTag", { tag }), onClick: () => handleRemoveTag(tag), children: "\xD7" })
               ] }, tag)),
               addingTag ? /* @__PURE__ */ jsx(
                 "input",
@@ -1332,17 +1201,17 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                     }
                   },
                   onBlur: handleAddTag,
-                  placeholder: "Tag...",
+                  placeholder: t("detail.tagPlaceholder"),
                   autoFocus: true
                 }
-              ) : /* @__PURE__ */ jsx("button", { className: s.tagAddBtn, onClick: () => setAddingTag(true), "aria-label": "Ajouter un tag", children: "+ Tag" })
+              ) : /* @__PURE__ */ jsx("button", { className: s.tagAddBtn, onClick: () => setAddingTag(true), "aria-label": t("detail.addTag"), children: t("detail.addTagBtn") })
             ] })
           ] }),
           /* @__PURE__ */ jsxs("div", { className: s.sideSection, children: [
-            /* @__PURE__ */ jsx("div", { className: s.sideSectionTitle, children: "Facturation" }),
+            /* @__PURE__ */ jsx("div", { className: s.sideSectionTitle, children: t("detail.billing.title") }),
             /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
               /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
-                /* @__PURE__ */ jsx("span", { style: { fontSize: 12 }, children: "Type" }),
+                /* @__PURE__ */ jsx("span", { style: { fontSize: 12 }, children: t("detail.billing.type") }),
                 /* @__PURE__ */ jsxs(
                   "select",
                   {
@@ -1361,14 +1230,14 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                     },
                     style: { fontSize: 12, padding: "4px 8px", borderRadius: 6, border: "1px solid #e5e7eb", background: "#fff" },
                     children: [
-                      /* @__PURE__ */ jsx("option", { value: "hourly", children: "Au temps" }),
-                      /* @__PURE__ */ jsx("option", { value: "flat", children: "Forfait" })
+                      /* @__PURE__ */ jsx("option", { value: "hourly", children: t("detail.billing.hourly") }),
+                      /* @__PURE__ */ jsx("option", { value: "flat", children: t("detail.billing.flat") })
                     ]
                   }
                 )
               ] }),
               ticket?.billingType === "flat" && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
-                /* @__PURE__ */ jsx("span", { style: { fontSize: 12 }, children: "Montant forfait" }),
+                /* @__PURE__ */ jsx("span", { style: { fontSize: 12 }, children: t("detail.billing.flatAmount") }),
                 /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 4 }, children: [
                   /* @__PURE__ */ jsx(
                     "input",
@@ -1396,7 +1265,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                 ] })
               ] }),
               /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
-                /* @__PURE__ */ jsx("span", { style: { fontSize: 12 }, children: "Montant factur\xE9" }),
+                /* @__PURE__ */ jsx("span", { style: { fontSize: 12 }, children: t("detail.billing.billedAmount") }),
                 /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 4 }, children: [
                   /* @__PURE__ */ jsx(
                     "input",
@@ -1424,7 +1293,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                 ] })
               ] }),
               /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
-                /* @__PURE__ */ jsx("span", { style: { fontSize: 12 }, children: "Paiement" }),
+                /* @__PURE__ */ jsx("span", { style: { fontSize: 12 }, children: t("detail.billing.payment") }),
                 /* @__PURE__ */ jsxs(
                   "select",
                   {
@@ -1443,16 +1312,16 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
                     },
                     style: { fontSize: 12, padding: "4px 8px", borderRadius: 6, border: "1px solid #e5e7eb", background: "#fff" },
                     children: [
-                      /* @__PURE__ */ jsx("option", { value: "unpaid", children: "Non pay\xE9" }),
-                      /* @__PURE__ */ jsx("option", { value: "partial", children: "Partiel" }),
-                      /* @__PURE__ */ jsx("option", { value: "paid", children: "Pay\xE9" })
+                      /* @__PURE__ */ jsx("option", { value: "unpaid", children: t("detail.billing.unpaid") }),
+                      /* @__PURE__ */ jsx("option", { value: "partial", children: t("detail.billing.partial") }),
+                      /* @__PURE__ */ jsx("option", { value: "paid", children: t("detail.billing.paid") })
                     ]
                   }
                 )
               ] })
             ] })
           ] }),
-          summaryLoading && /* @__PURE__ */ jsx("div", { className: s.sideSection, children: /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: "var(--theme-elevation-400)", textAlign: "center", padding: 8 }, children: "\u2728 Chargement de la synth\xE8se\u2026" }) })
+          summaryLoading && /* @__PURE__ */ jsx("div", { className: s.sideSection, children: /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: "var(--theme-elevation-400)", textAlign: "center", padding: 8 }, children: t("detail.loadingSummary") }) })
         ] }),
         sidebarTab === "client" && /* @__PURE__ */ jsxs("div", { role: "tabpanel", id: "sidebar-panel-client", "aria-labelledby": "sidebar-tab-client", children: [
           client && /* @__PURE__ */ jsxs("div", { className: s.sideSection, children: [
@@ -1480,7 +1349,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
               /* @__PURE__ */ jsx("span", { className: s.previousTicketsSubject, children: pt.subject || `#${pt.id}` }),
               /* @__PURE__ */ jsxs("span", { className: s.previousTicketsMeta, children: [
                 pt.status ? /* @__PURE__ */ jsx("span", { className: s.previousTicketsStatus, children: pt.status }) : null,
-                /* @__PURE__ */ jsx("span", { className: s.previousTicketsDate, children: new Date(pt.createdAt).toLocaleDateString("fr-FR", { day: "numeric", month: "short", year: "numeric" }) })
+                /* @__PURE__ */ jsx("span", { className: s.previousTicketsDate, children: new Date(pt.createdAt).toLocaleDateString(DATE_LOCALE, { day: "numeric", month: "short", year: "numeric" }) })
               ] })
             ] }) }, pt.id)) })
           ] })
@@ -1498,16 +1367,16 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
       ] })
     ] }),
     undoToast && /* @__PURE__ */ jsxs("div", { className: s.undoToast, role: "alert", children: [
-      /* @__PURE__ */ jsx("span", { children: "Message supprim\xE9" }),
-      /* @__PURE__ */ jsx("button", { className: s.undoBtn, onClick: handleUndoDelete, children: "Annuler" })
+      /* @__PURE__ */ jsx("span", { children: t("detail.messageDeletedToast") }),
+      /* @__PURE__ */ jsx("button", { className: s.undoBtn, onClick: handleUndoDelete, children: t("common.cancel") })
     ] }),
     splitModal && /* @__PURE__ */ jsx("div", { className: s.splitOverlay, onClick: (e) => {
       if (e.target === e.currentTarget) {
         setSplitModal(null);
         setSplitSubject("");
       }
-    }, children: /* @__PURE__ */ jsxs("div", { className: s.splitModal, role: "dialog", "aria-label": "Extraire dans un nouveau ticket", children: [
-      /* @__PURE__ */ jsx("h3", { className: s.splitTitle, children: "Extraire dans un nouveau ticket" }),
+    }, children: /* @__PURE__ */ jsxs("div", { className: s.splitModal, role: "dialog", "aria-label": t("actions.extractToNewTicket"), children: [
+      /* @__PURE__ */ jsx("h3", { className: s.splitTitle, children: t("actions.extractToNewTicket") }),
       /* @__PURE__ */ jsx("div", { className: s.splitPreview, children: splitModal.preview }),
       /* @__PURE__ */ jsx(
         "input",
@@ -1518,7 +1387,7 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
           onKeyDown: (e) => {
             if (e.key === "Enter") handleSplitConfirm();
           },
-          placeholder: "Sujet du nouveau ticket...",
+          placeholder: t("detail.split.subjectPlaceholder"),
           autoFocus: true
         }
       ),
@@ -1526,8 +1395,8 @@ ${uploadedLinks.join("\n")}` : replyBody.trim() || "[Contenu enrichi]";
         /* @__PURE__ */ jsx("button", { className: s.splitCancelBtn, onClick: () => {
           setSplitModal(null);
           setSplitSubject("");
-        }, children: "Annuler" }),
-        /* @__PURE__ */ jsx("button", { className: s.splitConfirmBtn, onClick: handleSplitConfirm, disabled: !splitSubject.trim(), children: "Cr\xE9er le ticket" })
+        }, children: t("common.cancel") }),
+        /* @__PURE__ */ jsx("button", { className: s.splitConfirmBtn, onClick: handleSplitConfirm, disabled: !splitSubject.trim(), children: t("detail.split.createBtn") })
       ] })
     ] }) })
   ] });

package/dist/views/TicketDetailView/constants.cjs

@@ -0,0 +1,20 @@
+'use strict';
+
+const ALIASES = (process.env.NEXT_PUBLIC_SUPPORT_SEND_ALIASES || "").split(",").map((v) => v.trim()).filter(Boolean).map((value) => ({ value, label: `En tant que : ${value}` }));
+const STATUS_STYLE = {
+  open: { bg: "#dbeafe", color: "#1e40af" },
+  waiting_client: { bg: "#fef3c7", color: "#92400e" },
+  resolved: { bg: "#dcfce7", color: "#166534" }
+};
+const REWRITE_STYLES = [
+  { id: "auto", label: "\u270F\uFE0F Auto", desc: "Garde le ton actuel" },
+  { id: "tutoyer", label: "\u{1F44B} Tutoyer", desc: "Passe en tu" },
+  { id: "vouvoyer", label: "\u{1F3A9} Vouvoyer", desc: "Passe en vous" },
+  { id: "formel", label: "\u{1F4BC} Formel", desc: "Ton professionnel" },
+  { id: "amical", label: "\u{1F60A} Amical", desc: "Ton chaleureux" },
+  { id: "court", label: "\u26A1 Court", desc: "Version concise" }
+];
+
+exports.ALIASES = ALIASES;
+exports.REWRITE_STYLES = REWRITE_STYLES;
+exports.STATUS_STYLE = STATUS_STYLE;

package/dist/views/TicketDetailView/constants.js

@@ -0,0 +1,16 @@
+const ALIASES = (process.env.NEXT_PUBLIC_SUPPORT_SEND_ALIASES || "").split(",").map((v) => v.trim()).filter(Boolean).map((value) => ({ value, label: `En tant que : ${value}` }));
+const STATUS_STYLE = {
+  open: { bg: "#dbeafe", color: "#1e40af" },
+  waiting_client: { bg: "#fef3c7", color: "#92400e" },
+  resolved: { bg: "#dcfce7", color: "#166534" }
+};
+const REWRITE_STYLES = [
+  { id: "auto", label: "\u270F\uFE0F Auto", desc: "Garde le ton actuel" },
+  { id: "tutoyer", label: "\u{1F44B} Tutoyer", desc: "Passe en tu" },
+  { id: "vouvoyer", label: "\u{1F3A9} Vouvoyer", desc: "Passe en vous" },
+  { id: "formel", label: "\u{1F4BC} Formel", desc: "Ton professionnel" },
+  { id: "amical", label: "\u{1F60A} Amical", desc: "Ton chaleureux" },
+  { id: "court", label: "\u26A1 Court", desc: "Version concise" }
+];
+
+export { ALIASES, REWRITE_STYLES, STATUS_STYLE };

package/dist/views/TicketDetailView/helpers.cjs

@@ -0,0 +1,23 @@
+'use strict';
+
+var dateLocale = require('../shared/dateLocale');
+
+function timeAgo(d) {
+  const date = new Date(d), now = /* @__PURE__ */ new Date();
+  if (date.toDateString() === now.toDateString()) return date.toLocaleTimeString(dateLocale.DATE_LOCALE, { hour: "2-digit", minute: "2-digit" });
+  const y = new Date(now);
+  y.setDate(y.getDate() - 1);
+  if (date.toDateString() === y.toDateString()) return `Hier, ${date.toLocaleTimeString(dateLocale.DATE_LOCALE, { hour: "2-digit", minute: "2-digit" })}`;
+  return date.toLocaleDateString(dateLocale.DATE_LOCALE, { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" });
+}
+function dateLabel(d) {
+  const date = new Date(d), now = /* @__PURE__ */ new Date();
+  if (date.toDateString() === now.toDateString()) return "Aujourd'hui";
+  const y = new Date(now);
+  y.setDate(y.getDate() - 1);
+  if (date.toDateString() === y.toDateString()) return "Hier";
+  return date.toLocaleDateString(dateLocale.DATE_LOCALE, { day: "numeric", month: "long" });
+}
+
+exports.dateLabel = dateLabel;
+exports.timeAgo = timeAgo;

package/dist/views/TicketDetailView/helpers.js

@@ -0,0 +1,20 @@
+import { DATE_LOCALE } from '../shared/dateLocale.js';
+
+function timeAgo(d) {
+  const date = new Date(d), now = /* @__PURE__ */ new Date();
+  if (date.toDateString() === now.toDateString()) return date.toLocaleTimeString(DATE_LOCALE, { hour: "2-digit", minute: "2-digit" });
+  const y = new Date(now);
+  y.setDate(y.getDate() - 1);
+  if (date.toDateString() === y.toDateString()) return `Hier, ${date.toLocaleTimeString(DATE_LOCALE, { hour: "2-digit", minute: "2-digit" })}`;
+  return date.toLocaleDateString(DATE_LOCALE, { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" });
+}
+function dateLabel(d) {
+  const date = new Date(d), now = /* @__PURE__ */ new Date();
+  if (date.toDateString() === now.toDateString()) return "Aujourd'hui";
+  const y = new Date(now);
+  y.setDate(y.getDate() - 1);
+  if (date.toDateString() === y.toDateString()) return "Hier";
+  return date.toLocaleDateString(DATE_LOCALE, { day: "numeric", month: "long" });
+}
+
+export { dateLabel, timeAgo };

package/dist/views/TicketDetailView/types.cjs

@@ -0,0 +1,2 @@
+'use strict';
+

package/dist/views/TicketDetailView/types.js

@@ -0,0 +1 @@
+