@consilioweb/payload-support 0.6.0 → 0.6.2

package/dist/components/TicketConversation.js

@@ -0,0 +1,3004 @@
+"use client";
+import React6, { useState, useRef, useCallback, useEffect } from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+// src/components/TicketConversation/constants.ts
+var statusLabels = {
+  open: { label: "Ouvert", bg: "#dbeafe", color: "#1e40af" },
+  waiting_client: { label: "Attente", bg: "#fef3c7", color: "#92400e" },
+  resolved: { label: "R\xE9solu", bg: "#dcfce7", color: "#166534" }
+};
+var projectStatusLabels = {
+  active: { label: "Actif", bg: "#dcfce7", color: "#166534" },
+  paused: { label: "En pause", bg: "#fef3c7", color: "#92400e" },
+  completed: { label: "Termin\xE9", bg: "#e5e7eb", color: "#374151" }
+};
+var C = {
+  blue: "#2563eb",
+  amber: "#d97706",
+  orange: "#ea580c",
+  white: "#fff",
+  textPrimary: "var(--theme-text)",
+  textSecondary: "#6b7280",
+  textMuted: "#9ca3af",
+  border: "#e2e8f0",
+  statusOpen: "#2563eb",
+  statusWaiting: "#d97706",
+  statusResolved: "#16a34a",
+  adminBg: "#f8fafc",
+  clientBg: "#fafafa",
+  clientBorder: "#e2e8f0",
+  emailBg: "#fffbeb",
+  internalBg: "#fefce8",
+  internalBorder: "#d97706"
+};
+var s = {
+  section: { borderTop: `1px solid ${C.border}`, paddingTop: "18px", marginTop: "20px" },
+  sectionTitle: { fontSize: "14px", fontWeight: 600, marginBottom: "12px", display: "flex", alignItems: "center", gap: "8px" },
+  btn: (bg, disabled) => {
+    const hex = bg.replace("#", "");
+    const r = parseInt(hex.substring(0, 2), 16) || 0;
+    const g = parseInt(hex.substring(2, 4), 16) || 0;
+    const b = parseInt(hex.substring(4, 6), 16) || 0;
+    const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
+    const textColor = luminance > 0.6 ? "#374151" : C.white;
+    return {
+      padding: "7px 14px",
+      borderRadius: "6px",
+      border: `1px solid ${C.border}`,
+      backgroundColor: bg,
+      color: textColor,
+      fontWeight: 600,
+      fontSize: "13px",
+      cursor: disabled ? "not-allowed" : "pointer",
+      opacity: disabled ? 0.5 : 1,
+      whiteSpace: "nowrap"
+    };
+  },
+  ghostBtn: (color, disabled) => ({
+    padding: "7px 14px",
+    borderRadius: "6px",
+    border: `1px solid ${C.border}`,
+    backgroundColor: "transparent",
+    color,
+    fontWeight: 600,
+    fontSize: "13px",
+    cursor: disabled ? "not-allowed" : "pointer",
+    opacity: disabled ? 0.5 : 1,
+    whiteSpace: "nowrap"
+  }),
+  outlineBtn: (color, disabled) => ({
+    padding: "7px 14px",
+    borderRadius: "6px",
+    border: `1px solid ${color}`,
+    backgroundColor: "transparent",
+    color,
+    fontWeight: 600,
+    fontSize: "13px",
+    cursor: disabled ? "not-allowed" : "pointer",
+    opacity: disabled ? 0.5 : 1,
+    whiteSpace: "nowrap"
+  }),
+  input: { padding: "8px 12px", borderRadius: "6px", border: `1px solid ${C.border}`, fontSize: "14px", color: "#374151", backgroundColor: C.white },
+  badge: (bg, color) => ({
+    display: "inline-block",
+    padding: "2px 8px",
+    borderRadius: "4px",
+    fontSize: "11px",
+    fontWeight: 600,
+    backgroundColor: bg,
+    color
+  })
+};
+
+// src/components/TicketConversation/utils.ts
+function getDateLabel(dateStr) {
+  const date = new Date(dateStr);
+  const today = /* @__PURE__ */ new Date();
+  const yesterday = new Date(today);
+  yesterday.setDate(yesterday.getDate() - 1);
+  if (date.toDateString() === today.toDateString()) return "Aujourd'hui";
+  if (date.toDateString() === yesterday.toDateString()) return "Hier";
+  return date.toLocaleDateString("fr-FR", { day: "numeric", month: "short", year: "numeric" });
+}
+function formatMessageDate(dateStr) {
+  const date = new Date(dateStr);
+  const today = /* @__PURE__ */ new Date();
+  const yesterday = new Date(today);
+  yesterday.setDate(yesterday.getDate() - 1);
+  const time = date.toLocaleTimeString("fr-FR", { hour: "2-digit", minute: "2-digit" });
+  if (date.toDateString() === today.toDateString()) return time;
+  if (date.toDateString() === yesterday.toDateString()) return `Hier, ${time}`;
+  if (date.getFullYear() === today.getFullYear()) {
+    return `${date.toLocaleDateString("fr-FR", { day: "numeric", month: "short" })}, ${time}`;
+  }
+  return `${date.toLocaleDateString("fr-FR", { day: "numeric", month: "short", year: "numeric" })}, ${time}`;
+}
+var LANG_CONFIG = {
+  javascript: { label: "JavaScript", accent: "#f7df1e" },
+  js: { label: "JavaScript", accent: "#f7df1e" },
+  typescript: { label: "TypeScript", accent: "#3178c6" },
+  ts: { label: "TypeScript", accent: "#3178c6" },
+  tsx: { label: "TSX", accent: "#3178c6" },
+  jsx: { label: "JSX", accent: "#f7df1e" },
+  php: { label: "PHP", accent: "#777bb4" },
+  python: { label: "Python", accent: "#3776ab" },
+  py: { label: "Python", accent: "#3776ab" },
+  html: { label: "HTML", accent: "#e34f26" },
+  css: { label: "CSS", accent: "#1572b6" },
+  scss: { label: "SCSS", accent: "#cc6699" },
+  json: { label: "JSON", accent: "#292929" },
+  sql: { label: "SQL", accent: "#e48e00" },
+  bash: { label: "Bash", accent: "#4eaa25" },
+  sh: { label: "Shell", accent: "#4eaa25" },
+  yaml: { label: "YAML", accent: "#cb171e" },
+  yml: { label: "YAML", accent: "#cb171e" },
+  xml: { label: "XML", accent: "#f16529" },
+  markdown: { label: "Markdown", accent: "#083fa1" },
+  md: { label: "Markdown", accent: "#083fa1" },
+  diff: { label: "Diff", accent: "#41b883" },
+  go: { label: "Go", accent: "#00add8" },
+  rust: { label: "Rust", accent: "#dea584" },
+  java: { label: "Java", accent: "#ed8b00" },
+  c: { label: "C", accent: "#555555" },
+  cpp: { label: "C++", accent: "#00599c" },
+  ruby: { label: "Ruby", accent: "#cc342d" },
+  swift: { label: "Swift", accent: "#f05138" },
+  nginx: { label: "Nginx", accent: "#009639" },
+  docker: { label: "Docker", accent: "#2496ed" },
+  dockerfile: { label: "Dockerfile", accent: "#2496ed" },
+  env: { label: ".env", accent: "#ecd53f" }
+};
+var DEFAULT_CONFIG = { label: "Code", accent: "#6b7280" };
+function SingleCodeBlock({ lang, code }) {
+  const [copied, setCopied] = useState(false);
+  const config = LANG_CONFIG[lang.toLowerCase()] || (lang ? { label: lang.toUpperCase(), accent: "#6b7280" } : DEFAULT_CONFIG);
+  const handleCopy = () => {
+    navigator.clipboard.writeText(code);
+    setCopied(true);
+    setTimeout(() => setCopied(false), 1500);
+  };
+  const lines = code.split("\n");
+  return /* @__PURE__ */ jsxs("div", { style: {
+    marginTop: 8,
+    marginBottom: 8,
+    borderRadius: 8,
+    overflow: "hidden",
+    border: "1px solid #334155",
+    backgroundColor: "#0f172a",
+    fontSize: 13
+  }, children: [
+    /* @__PURE__ */ jsxs("div", { style: {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "space-between",
+      padding: "6px 12px",
+      backgroundColor: "#1e293b",
+      borderBottom: "1px solid #334155"
+    }, children: [
+      /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
+        /* @__PURE__ */ jsx("span", { style: {
+          display: "inline-block",
+          width: 8,
+          height: 8,
+          borderRadius: "50%",
+          backgroundColor: config.accent,
+          flexShrink: 0
+        } }),
+        /* @__PURE__ */ jsx("span", { style: {
+          fontSize: 11,
+          fontWeight: 700,
+          color: "#e2e8f0",
+          letterSpacing: "0.02em"
+        }, children: config.label })
+      ] }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: handleCopy,
+          style: {
+            background: "none",
+            border: "1px solid #475569",
+            borderRadius: 4,
+            padding: "2px 10px",
+            fontSize: 11,
+            color: copied ? "#4ade80" : "#94a3b8",
+            cursor: "pointer",
+            fontWeight: 600,
+            transition: "color 150ms"
+          },
+          children: copied ? "Copi\xE9 !" : "Copier"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", overflowX: "auto" }, children: [
+      /* @__PURE__ */ jsx("div", { style: {
+        padding: "12px 0",
+        borderRight: "1px solid #334155",
+        userSelect: "none",
+        flexShrink: 0
+      }, children: lines.map((_, i) => /* @__PURE__ */ jsx("div", { style: {
+        padding: "0 12px",
+        fontSize: 12,
+        lineHeight: "20px",
+        color: "#475569",
+        textAlign: "right",
+        fontFamily: '"SF Mono", "Fira Code", "JetBrains Mono", monospace'
+      }, children: i + 1 }, i)) }),
+      /* @__PURE__ */ jsx("pre", { style: {
+        margin: 0,
+        padding: 12,
+        overflow: "auto",
+        flex: 1
+      }, children: /* @__PURE__ */ jsx("code", { style: {
+        fontSize: 12,
+        lineHeight: "20px",
+        fontFamily: '"SF Mono", "Fira Code", "JetBrains Mono", monospace',
+        color: "#e2e8f0",
+        whiteSpace: "pre"
+      }, children: code }) })
+    ] })
+  ] });
+}
+function CodeBlockRenderer({ text }) {
+  const parts = text.split(/(```[\s\S]*?```)/g);
+  const hasCodeBlock = parts.some((p) => p.startsWith("```"));
+  if (!hasCodeBlock) return null;
+  return /* @__PURE__ */ jsx(Fragment, { children: parts.map((part, i) => {
+    if (part.startsWith("```")) {
+      const match = part.match(/^```(\w*)\n?([\s\S]*?)```$/);
+      if (match) {
+        const lang = match[1] || "";
+        const code = match[2].replace(/\n$/, "");
+        return /* @__PURE__ */ jsx(SingleCodeBlock, { lang, code }, i);
+      }
+    }
+    return null;
+  }) });
+}
+function CodeBlockRendererHtml({ html }) {
+  const stripped = html.replace(/<[^>]+>/g, "");
+  return /* @__PURE__ */ jsx(CodeBlockRenderer, { text: stripped });
+}
+var LANGUAGES = [
+  { value: "javascript", label: "JavaScript" },
+  { value: "typescript", label: "TypeScript" },
+  { value: "php", label: "PHP" },
+  { value: "python", label: "Python" },
+  { value: "html", label: "HTML" },
+  { value: "css", label: "CSS" },
+  { value: "scss", label: "SCSS" },
+  { value: "json", label: "JSON" },
+  { value: "sql", label: "SQL" },
+  { value: "bash", label: "Bash" },
+  { value: "yaml", label: "YAML" },
+  { value: "xml", label: "XML" },
+  { value: "markdown", label: "Markdown" },
+  { value: "diff", label: "Diff" },
+  { value: "go", label: "Go" },
+  { value: "rust", label: "Rust" },
+  { value: "java", label: "Java" },
+  { value: "ruby", label: "Ruby" },
+  { value: "swift", label: "Swift" },
+  { value: "docker", label: "Dockerfile" },
+  { value: "nginx", label: "Nginx" },
+  { value: "env", label: ".env" }
+];
+function CodeBlockInserter({ onInsert, className, style }) {
+  const [open, setOpen] = useState(false);
+  const [filter, setFilter] = useState("");
+  const dropdownRef = useRef(null);
+  const inputRef = useRef(null);
+  useEffect(() => {
+    if (open && inputRef.current) inputRef.current.focus();
+  }, [open]);
+  useEffect(() => {
+    const handleClickOutside = (e) => {
+      if (dropdownRef.current && !dropdownRef.current.contains(e.target)) {
+        setOpen(false);
+        setFilter("");
+      }
+    };
+    if (open) document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, [open]);
+  const filtered = filter ? LANGUAGES.filter((l) => l.label.toLowerCase().includes(filter.toLowerCase()) || l.value.includes(filter.toLowerCase())) : LANGUAGES;
+  const handleSelect = (lang) => {
+    onInsert(`
+\`\`\`${lang}
+
+\`\`\`
+`);
+    setOpen(false);
+    setFilter("");
+  };
+  return /* @__PURE__ */ jsxs("div", { ref: dropdownRef, style: { position: "relative", display: "inline-block" }, children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: () => setOpen(!open),
+        className,
+        style: {
+          fontSize: 11,
+          fontWeight: 700,
+          padding: "4px 10px",
+          width: "auto",
+          cursor: "pointer",
+          ...style
+        },
+        type: "button",
+        "aria-label": "Ins\xE9rer un bloc de code",
+        "data-tooltip": "Bloc de code",
+        children: "</> Code"
+      }
+    ),
+    open && /* @__PURE__ */ jsxs("div", { style: {
+      position: "absolute",
+      bottom: "100%",
+      left: 0,
+      marginBottom: 4,
+      width: 200,
+      maxHeight: 280,
+      backgroundColor: "#1e293b",
+      border: "1px solid #334155",
+      borderRadius: 8,
+      boxShadow: "0 8px 24px rgba(0,0,0,0.4)",
+      zIndex: 1e3,
+      overflow: "hidden",
+      display: "flex",
+      flexDirection: "column"
+    }, children: [
+      /* @__PURE__ */ jsx("div", { style: { padding: "8px 8px 4px" }, children: /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref: inputRef,
+          type: "text",
+          value: filter,
+          onChange: (e) => setFilter(e.target.value),
+          onKeyDown: (e) => {
+            if (e.key === "Escape") {
+              setOpen(false);
+              setFilter("");
+            }
+            if (e.key === "Enter" && filtered.length > 0) handleSelect(filtered[0].value);
+          },
+          placeholder: "Rechercher...",
+          style: {
+            width: "100%",
+            padding: "6px 10px",
+            fontSize: 12,
+            backgroundColor: "#0f172a",
+            border: "1px solid #334155",
+            borderRadius: 6,
+            color: "#e2e8f0",
+            outline: "none",
+            boxSizing: "border-box"
+          }
+        }
+      ) }),
+      /* @__PURE__ */ jsxs("div", { style: { overflowY: "auto", maxHeight: 230, padding: "4px 0" }, children: [
+        filtered.map((lang) => /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: () => handleSelect(lang.value),
+            style: {
+              display: "block",
+              width: "100%",
+              padding: "6px 12px",
+              fontSize: 12,
+              fontWeight: 500,
+              color: "#e2e8f0",
+              backgroundColor: "transparent",
+              border: "none",
+              cursor: "pointer",
+              textAlign: "left"
+            },
+            onMouseEnter: (e) => {
+              e.target.style.backgroundColor = "#334155";
+            },
+            onMouseLeave: (e) => {
+              e.target.style.backgroundColor = "transparent";
+            },
+            type: "button",
+            children: lang.label
+          },
+          lang.value
+        )),
+        filtered.length === 0 && /* @__PURE__ */ jsx("div", { style: { padding: "12px", fontSize: 12, color: "#64748b", textAlign: "center" }, children: "Aucun langage trouv\xE9" })
+      ] })
+    ] })
+  ] });
+}
+var sourceLabels = {
+  email: "Email",
+  "live-chat": "Live Chat",
+  portal: "Portail",
+  admin: "Admin"
+};
+function TicketHeader({
+  ticketNumber,
+  currentStatus,
+  clientSentiment,
+  ticketSource,
+  chatSession,
+  snoozeUntil,
+  satisfaction,
+  copiedLink,
+  onCopyLink
+}) {
+  return /* @__PURE__ */ jsxs("div", { style: {
+    display: "flex",
+    alignItems: "center",
+    gap: "10px",
+    padding: "10px 14px",
+    borderRadius: "8px",
+    backgroundColor: "var(--theme-elevation-100)",
+    marginBottom: "12px",
+    flexWrap: "wrap"
+  }, children: [
+    ticketNumber && /* @__PURE__ */ jsx("span", { style: { fontFamily: "'SF Mono', 'Fira Code', 'JetBrains Mono', 'Cascadia Code', monospace", fontWeight: 700, fontSize: "14px", color: C.textPrimary }, children: ticketNumber }),
+    currentStatus && (() => {
+      const st = statusLabels[currentStatus] || statusLabels.open;
+      return /* @__PURE__ */ jsx("span", { style: s.badge(st.bg, st.color), children: st.label });
+    })(),
+    clientSentiment && /* @__PURE__ */ jsxs(
+      "span",
+      {
+        style: { ...s.badge(`${clientSentiment.color}15`, clientSentiment.color), fontSize: "11px" },
+        title: `Sentiment : ${clientSentiment.label}`,
+        children: [
+          clientSentiment.emoji,
+          " ",
+          clientSentiment.label
+        ]
+      }
+    ),
+    ticketSource && ticketSource !== "portal" && /* @__PURE__ */ jsx("span", { style: s.badge("#f1f5f9", "#475569"), children: sourceLabels[ticketSource] || ticketSource }),
+    chatSession && ticketSource === "live-chat" && /* @__PURE__ */ jsxs("span", { style: { fontSize: "11px", color: C.textMuted }, children: [
+      "Session : ",
+      chatSession.slice(0, 16),
+      "..."
+    ] }),
+    snoozeUntil && new Date(snoozeUntil) > /* @__PURE__ */ new Date() && /* @__PURE__ */ jsxs("span", { style: s.badge("#f5f3ff", "#7c3aed"), children: [
+      "Snooz\xE9 ",
+      new Date(snoozeUntil).toLocaleDateString("fr-FR", { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" })
+    ] }),
+    satisfaction && /* @__PURE__ */ jsxs("span", { style: s.badge(
+      satisfaction.rating >= 4 ? "#dcfce7" : satisfaction.rating >= 3 ? "#fef9c3" : "#fee2e2",
+      satisfaction.rating >= 4 ? "#166534" : satisfaction.rating >= 3 ? "#854d0e" : "#991b1b"
+    ), children: [
+      Array.from({ length: 5 }, (_, i) => i < satisfaction.rating ? "\u2605" : "\u2606").join(""),
+      " ",
+      satisfaction.rating,
+      "/5"
+    ] }),
+    /* @__PURE__ */ jsxs("span", { style: { marginLeft: "auto", display: "inline-flex", alignItems: "center", gap: "4px" }, children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: () => onCopyLink("admin"),
+          title: "Copier le lien admin",
+          style: { background: "none", border: "none", cursor: "pointer", fontSize: "13px", opacity: copiedLink === "admin" ? 1 : 0.5, padding: "2px 4px" },
+          children: copiedLink === "admin" ? "\u2705" : "\u{1F4CB}"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: () => onCopyLink("client"),
+          title: "Copier le lien client",
+          style: { background: "none", border: "none", cursor: "pointer", fontSize: "13px", opacity: copiedLink === "client" ? 1 : 0.5, padding: "2px 4px" },
+          children: copiedLink === "client" ? "\u2705" : "\u{1F517}"
+        }
+      ),
+      copiedLink && /* @__PURE__ */ jsx("span", { style: { fontSize: "11px", color: "#16a34a", fontWeight: 600 }, children: "Copi\xE9" })
+    ] })
+  ] });
+}
+function ClientBar({ client }) {
+  return /* @__PURE__ */ jsxs("div", { style: {
+    display: "flex",
+    alignItems: "center",
+    gap: "12px",
+    padding: "10px 16px",
+    borderRadius: "8px",
+    backgroundColor: "var(--theme-elevation-100)",
+    marginBottom: "16px",
+    flexWrap: "wrap"
+  }, children: [
+    /* @__PURE__ */ jsx("span", { style: { fontSize: "16px" }, children: "\u{1F464}" }),
+    /* @__PURE__ */ jsx("span", { style: { fontWeight: 700, fontSize: "13px", color: C.textPrimary }, children: client.company }),
+    /* @__PURE__ */ jsxs("span", { style: { color: C.textSecondary, fontSize: "13px" }, children: [
+      client.firstName,
+      " ",
+      client.lastName
+    ] }),
+    /* @__PURE__ */ jsx("span", { style: { color: C.textMuted, fontSize: "12px" }, children: "|" }),
+    /* @__PURE__ */ jsx("a", { href: `mailto:${client.email}`, style: { color: "#2563eb", fontSize: "12px", fontWeight: 600, textDecoration: "none" }, children: client.email }),
+    client.phone && /* @__PURE__ */ jsx("span", { style: { color: C.textSecondary, fontSize: "12px" }, children: client.phone }),
+    /* @__PURE__ */ jsxs("span", { style: { marginLeft: "auto", display: "inline-flex", gap: "8px", alignItems: "center" }, children: [
+      /* @__PURE__ */ jsx("a", { href: `/admin/collections/support-clients/${client.id}`, style: { ...s.ghostBtn("#475569"), fontSize: "11px", padding: "4px 10px", textDecoration: "none" }, children: "Fiche client" }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => window.open(`/api/admin/impersonate?clientId=${client.id}`, "_blank"),
+          style: { ...s.ghostBtn("#7c3aed"), fontSize: "11px", padding: "4px 10px" },
+          title: "Se connecter au portail support en tant que ce client",
+          children: "Voir en tant que client"
+        }
+      )
+    ] })
+  ] });
+}
+function QuickActions({
+  statusTransitions,
+  statusUpdating,
+  onStatusChange,
+  snoozeUntil,
+  snoozeSaving,
+  onCancelSnooze,
+  showMerge: _showMerge,
+  showExtMsg: _showExtMsg,
+  showSnooze: _showSnooze,
+  onToggleMerge,
+  onToggleExtMsg,
+  onToggleSnooze,
+  onNextTicket,
+  showNextTicket,
+  nextTicketId,
+  nextTicketInfo,
+  onCloseNextTicket
+}) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", flexWrap: "wrap", marginBottom: "16px", alignItems: "center" }, children: [
+      statusTransitions.map((a) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: () => onStatusChange(a.status),
+          disabled: statusUpdating,
+          style: s.outlineBtn(a.color, statusUpdating),
+          children: a.label
+        },
+        a.status
+      )),
+      snoozeUntil && new Date(snoozeUntil) > /* @__PURE__ */ new Date() && /* @__PURE__ */ jsx("button", { onClick: onCancelSnooze, disabled: snoozeSaving, style: { ...s.ghostBtn("#7c3aed", snoozeSaving), fontSize: "12px", padding: "5px 10px" }, children: "Annuler snooze" }),
+      /* @__PURE__ */ jsx("span", { style: { borderLeft: `1px solid ${C.border}`, height: "20px", margin: "0 4px" } }),
+      /* @__PURE__ */ jsx("button", { onClick: onToggleMerge, style: s.ghostBtn("#be185d"), children: "Fusionner" }),
+      /* @__PURE__ */ jsx("button", { onClick: onToggleExtMsg, style: s.ghostBtn("#4f46e5"), children: "+ Message re\xE7u" }),
+      /* @__PURE__ */ jsx("button", { onClick: onToggleSnooze, style: s.ghostBtn("#7c3aed"), children: "Snooze" }),
+      /* @__PURE__ */ jsx("button", { onClick: onNextTicket, style: s.ghostBtn("#16a34a"), children: "Ticket suivant" })
+    ] }),
+    showNextTicket && /* @__PURE__ */ jsxs("div", { style: { padding: "10px 14px", borderRadius: "8px", backgroundColor: "#f0fdf4", border: `1px solid ${C.border}`, marginBottom: "14px", display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
+      nextTicketId ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs("span", { style: { fontSize: "13px", color: "#166534", fontWeight: 600 }, children: [
+          "Ticket suivant : ",
+          /* @__PURE__ */ jsx("strong", { children: nextTicketInfo })
+        ] }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: () => {
+              window.location.href = `/admin/support/ticket?id=${nextTicketId}`;
+            },
+            style: { ...s.btn(C.statusResolved), color: C.white, fontSize: "12px", padding: "5px 14px" },
+            children: "Ouvrir"
+          }
+        )
+      ] }) : /* @__PURE__ */ jsx("span", { style: { fontSize: "13px", color: "#166534", fontWeight: 700 }, children: nextTicketInfo }),
+      /* @__PURE__ */ jsx("button", { onClick: onCloseNextTicket, style: { border: "none", background: "none", color: C.textMuted, cursor: "pointer", fontSize: "16px", fontWeight: 700, marginLeft: "8px" }, children: "\xD7" })
+    ] })
+  ] });
+}
+function AISummaryPanel({
+  showAiSummary,
+  setShowAiSummary,
+  aiSummary,
+  aiGenerating,
+  aiSaving,
+  aiSaved,
+  handleAiGenerate,
+  handleAiSave
+}) {
+  return /* @__PURE__ */ jsxs("div", { style: { marginBottom: "14px" }, children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: () => {
+          setShowAiSummary(!showAiSummary);
+          if (!showAiSummary && !aiSummary) handleAiGenerate();
+        },
+        style: {
+          ...s.ghostBtn("#7c3aed", false),
+          fontSize: "12px",
+          display: "inline-flex",
+          alignItems: "center",
+          gap: "6px"
+        },
+        children: showAiSummary ? "Masquer la synth\xE8se IA" : "Synth\xE8se IA"
+      }
+    ),
+    showAiSummary && /* @__PURE__ */ jsxs("div", { style: {
+      marginTop: "10px",
+      padding: "14px 18px",
+      borderRadius: "8px",
+      backgroundColor: "#faf5ff",
+      border: "1px solid #e9d5ff"
+    }, children: [
+      /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", marginBottom: "10px" }, children: [
+        /* @__PURE__ */ jsx("h4", { style: { fontSize: "13px", fontWeight: 600, color: "#7c3aed", margin: 0 }, children: "Synth\xE8se IA" }),
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "6px" }, children: [
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              onClick: handleAiGenerate,
+              disabled: aiGenerating,
+              style: { ...s.outlineBtn("#7c3aed", aiGenerating), fontSize: "11px", padding: "4px 10px" },
+              children: aiGenerating ? "G\xE9n\xE9ration..." : "R\xE9g\xE9n\xE9rer"
+            }
+          ),
+          aiSummary && !aiGenerating && /* @__PURE__ */ jsx(
+            "button",
+            {
+              onClick: handleAiSave,
+              disabled: aiSaving || aiSaved,
+              style: { ...s.btn(aiSaved ? "#16a34a" : "#2563eb", aiSaving), fontSize: "11px", padding: "4px 10px" },
+              children: aiSaved ? "Sauvegard\xE9" : aiSaving ? "Sauvegarde..." : "Sauvegarder (note interne)"
+            }
+          )
+        ] })
+      ] }),
+      aiGenerating ? /* @__PURE__ */ jsx("div", { style: { display: "flex", alignItems: "center", gap: "10px", color: "#7c3aed", fontSize: "13px" }, children: "Analyse de la conversation en cours..." }) : aiSummary ? /* @__PURE__ */ jsx(
+        "div",
+        {
+          style: { fontSize: "13px", lineHeight: "1.7", color: "#1e1b4b", whiteSpace: "pre-wrap" },
+          dangerouslySetInnerHTML: {
+            __html: aiSummary.replace(/\*\*(.*?)\*\*/g, "<strong>$1</strong>").replace(/\n/g, "<br/>")
+          }
+        }
+      ) : /* @__PURE__ */ jsx("p", { style: { color: "#999", fontStyle: "italic", fontSize: "13px", margin: 0 }, children: `Cliquez sur "R\xE9g\xE9n\xE9rer" pour lancer l'analyse` })
+    ] })
+  ] });
+}
+function MergePanel({
+  mergeTarget,
+  setMergeTarget,
+  mergeTargetInfo,
+  setMergeTargetInfo,
+  mergeError,
+  setMergeError,
+  merging,
+  handleMergeLookup,
+  handleMerge
+}) {
+  return /* @__PURE__ */ jsxs("div", { style: { padding: "14px 18px", borderRadius: "8px", backgroundColor: "#fdf2f8", border: "1px solid #fbcfe8", marginBottom: "14px" }, children: [
+    /* @__PURE__ */ jsx("h4", { style: { fontSize: "13px", fontWeight: 600, marginBottom: "10px", color: "#831843" }, children: "Fusionner ce ticket dans un autre" }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", alignItems: "center", marginBottom: "8px" }, children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "text",
+          value: mergeTarget,
+          onChange: (e) => {
+            setMergeTarget(e.target.value);
+            setMergeTargetInfo(null);
+            setMergeError("");
+          },
+          placeholder: "TK-0001",
+          style: { ...s.input, width: "130px" }
+        }
+      ),
+      /* @__PURE__ */ jsx("button", { onClick: handleMergeLookup, style: { ...s.outlineBtn("#ec4899"), fontSize: "12px", padding: "6px 14px" }, children: "Rechercher" }),
+      mergeError && /* @__PURE__ */ jsx("span", { style: { fontSize: "12px", color: "#be185d", fontWeight: 600 }, children: mergeError })
+    ] }),
+    mergeTargetInfo && /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", alignItems: "center" }, children: [
+      /* @__PURE__ */ jsxs("span", { style: { fontSize: "13px", fontWeight: 600 }, children: [
+        mergeTargetInfo.ticketNumber,
+        " \u2014 ",
+        mergeTargetInfo.subject
+      ] }),
+      /* @__PURE__ */ jsx("button", { onClick: handleMerge, disabled: merging, style: { ...s.btn("#ec4899", merging), color: "#fff", fontSize: "12px", padding: "6px 14px" }, children: merging ? "Fusion..." : "Confirmer la fusion" })
+    ] })
+  ] });
+}
+function ExtMessagePanel({
+  extMsgBody,
+  setExtMsgBody,
+  extMsgAuthor,
+  setExtMsgAuthor,
+  extMsgDate,
+  setExtMsgDate,
+  extMsgFiles,
+  setExtMsgFiles,
+  sendingExtMsg,
+  handleSendExtMsg,
+  handleExtFileChange
+}) {
+  const extFileInputRef = useRef(null);
+  return /* @__PURE__ */ jsxs("div", { style: { padding: "14px 18px", borderRadius: "8px", backgroundColor: "#eef2ff", border: "1px solid #c7d2fe", marginBottom: "14px" }, children: [
+    /* @__PURE__ */ jsx("h4", { style: { fontSize: "13px", fontWeight: 600, marginBottom: "10px", color: "#312e81" }, children: "Ajouter un message re\xE7u (email, SMS, WhatsApp...)" }),
+    /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        value: extMsgBody,
+        onChange: (e) => setExtMsgBody(e.target.value),
+        placeholder: "Coller le contenu du message re\xE7u...",
+        rows: 3,
+        style: { ...s.input, width: "100%", resize: "vertical", marginBottom: "10px" }
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", alignItems: "center", flexWrap: "wrap", marginBottom: "10px" }, children: [
+      /* @__PURE__ */ jsxs("select", { value: extMsgAuthor, onChange: (e) => setExtMsgAuthor(e.target.value), style: { ...s.input, fontSize: "12px" }, children: [
+        /* @__PURE__ */ jsx("option", { value: "client", children: "Envoy\xE9 par le client" }),
+        /* @__PURE__ */ jsx("option", { value: "admin", children: "Envoy\xE9 par le support" })
+      ] }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "datetime-local",
+          value: extMsgDate,
+          onChange: (e) => setExtMsgDate(e.target.value),
+          style: { ...s.input, fontSize: "12px" }
+        }
+      ),
+      /* @__PURE__ */ jsx("input", { ref: extFileInputRef, type: "file", multiple: true, onChange: handleExtFileChange, style: { display: "none" }, accept: "image/*,.pdf,.doc,.docx,.txt,.zip" }),
+      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => extFileInputRef.current?.click(), style: { ...s.ghostBtn("#6b7280"), fontSize: "12px", padding: "6px 12px" }, children: "+ PJ" })
+    ] }),
+    extMsgFiles.length > 0 && /* @__PURE__ */ jsx("div", { style: { marginBottom: "10px", display: "flex", gap: "6px", flexWrap: "wrap" }, children: extMsgFiles.map((file, i) => /* @__PURE__ */ jsxs("span", { style: { ...s.badge("#f1f5f9", "#374151"), display: "inline-flex", alignItems: "center", gap: "4px" }, children: [
+      file.name,
+      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => setExtMsgFiles((prev) => prev.filter((_, idx) => idx !== i)), style: { border: "none", background: "none", color: "#ef4444", fontWeight: 700, cursor: "pointer", fontSize: "14px", lineHeight: 1 }, children: "\xD7" })
+    ] }, i)) }),
+    /* @__PURE__ */ jsx("button", { onClick: handleSendExtMsg, disabled: sendingExtMsg || !extMsgBody.trim(), style: s.btn("#818cf8", sendingExtMsg || !extMsgBody.trim()), children: sendingExtMsg ? "Ajout..." : "Ajouter (sans notification)" })
+  ] });
+}
+function SnoozePanel({ snoozeSaving, handleSnooze }) {
+  return /* @__PURE__ */ jsxs("div", { style: { padding: "14px 18px", borderRadius: "8px", backgroundColor: "#faf5ff", border: "1px solid #e9d5ff", marginBottom: "14px" }, children: [
+    /* @__PURE__ */ jsx("h4", { style: { fontSize: "13px", fontWeight: 600, marginBottom: "10px", color: "#5b21b6" }, children: "Snooze \u2014 masquer temporairement" }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", flexWrap: "wrap", alignItems: "center" }, children: [
+      /* @__PURE__ */ jsx("button", { onClick: () => handleSnooze(1), disabled: snoozeSaving, style: { ...s.outlineBtn("#8b5cf6", snoozeSaving), fontSize: "12px" }, children: "1 jour" }),
+      /* @__PURE__ */ jsx("button", { onClick: () => handleSnooze(3), disabled: snoozeSaving, style: { ...s.outlineBtn("#8b5cf6", snoozeSaving), fontSize: "12px" }, children: "3 jours" }),
+      /* @__PURE__ */ jsx("button", { onClick: () => handleSnooze(7), disabled: snoozeSaving, style: { ...s.outlineBtn("#8b5cf6", snoozeSaving), fontSize: "12px" }, children: "1 semaine" }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "datetime-local",
+          onChange: (e) => {
+            if (e.target.value) handleSnooze(null, e.target.value);
+          },
+          style: { ...s.input, fontSize: "12px" }
+        }
+      )
+    ] })
+  ] });
+}
+function ActivityLog({ activityLog }) {
+  const [showActivity, setShowActivity] = useState(false);
+  return /* @__PURE__ */ jsxs("div", { style: s.section, children: [
+    /* @__PURE__ */ jsxs("h4", { style: { ...s.sectionTitle, cursor: "pointer" }, onClick: () => setShowActivity(!showActivity), children: [
+      "Historique ",
+      /* @__PURE__ */ jsx("span", { style: s.badge("#f1f5f9", "#475569"), children: activityLog.length }),
+      /* @__PURE__ */ jsx("span", { style: { fontSize: "12px", color: C.textMuted, transition: "transform 0.2s", display: "inline-block", transform: showActivity ? "rotate(90deg)" : "none" }, children: "\u25B6" })
+    ] }),
+    showActivity && (activityLog.length === 0 ? /* @__PURE__ */ jsx("p", { style: { fontSize: "12px", color: C.textMuted, fontStyle: "italic" }, children: "Aucune activit\xE9 enregistr\xE9e." }) : /* @__PURE__ */ jsx("div", { style: { fontSize: "12px", display: "flex", flexDirection: "column", gap: "2px", borderLeft: "2px solid #bfdbfe", paddingLeft: "14px", marginLeft: "4px" }, children: activityLog.map((entry) => /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "10px", alignItems: "center", padding: "5px 0", borderBottom: "1px solid #f8fafc" }, children: [
+      /* @__PURE__ */ jsx("span", { style: { color: C.textMuted, fontSize: "11px", whiteSpace: "nowrap", fontWeight: 500 }, children: new Date(entry.createdAt).toLocaleString("fr-FR", { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" }) }),
+      /* @__PURE__ */ jsx("span", { style: s.badge(entry.actorType === "admin" ? "#eff6ff" : "#dcfce7", entry.actorType === "admin" ? "#1e40af" : "#166534"), children: entry.actorType || "system" }),
+      /* @__PURE__ */ jsx("span", { style: { color: "#374151", fontWeight: 500 }, children: (entry.detail || entry.action).replace(/\[object Object\]/g, "(utilisateur)") }),
+      /* @__PURE__ */ jsx("span", { style: { color: C.textMuted, fontSize: "11px" }, children: entry.actorEmail })
+    ] }, entry.id)) }))
+  ] });
+}
+function ClientHistory({
+  client: _client,
+  clientTickets,
+  clientProjects,
+  clientNotes,
+  onNotesChange,
+  onNotesSave,
+  savingNotes,
+  notesSaved
+}) {
+  const [showClientHistory, setShowClientHistory] = useState(false);
+  return /* @__PURE__ */ jsxs("div", { style: s.section, children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        onClick: () => setShowClientHistory(!showClientHistory),
+        style: {
+          background: "none",
+          border: `1px dashed ${C.border}`,
+          borderRadius: "6px",
+          padding: "8px 14px",
+          cursor: "pointer",
+          color: C.textSecondary,
+          fontSize: "13px",
+          fontWeight: 600,
+          width: "100%",
+          textAlign: "left",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "space-between"
+        },
+        children: [
+          /* @__PURE__ */ jsxs("span", { children: [
+            "Historique client (",
+            clientTickets.length,
+            " ticket",
+            clientTickets.length !== 1 ? "s" : "",
+            ", ",
+            clientProjects.length,
+            " projet",
+            clientProjects.length !== 1 ? "s" : "",
+            ")"
+          ] }),
+          /* @__PURE__ */ jsx("span", { style: { fontSize: "12px", transition: "transform 0.2s", display: "inline-block", transform: showClientHistory ? "rotate(90deg)" : "none" }, children: "\u25B6" })
+        ]
+      }
+    ),
+    showClientHistory && /* @__PURE__ */ jsxs("div", { style: { marginTop: "10px", padding: "14px 18px", borderRadius: "8px", backgroundColor: C.white, border: `1px solid ${C.border}` }, children: [
+      /* @__PURE__ */ jsx("h5", { style: { fontSize: "12px", fontWeight: 600, color: C.textSecondary, marginBottom: "8px" }, children: "Derniers tickets" }),
+      clientTickets.length === 0 ? /* @__PURE__ */ jsx("p", { style: { fontSize: "12px", color: C.textMuted, fontStyle: "italic", marginBottom: "14px" }, children: "Aucun autre ticket" }) : /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "4px", marginBottom: "14px" }, children: clientTickets.map((t) => {
+        const st = statusLabels[t.status] || statusLabels.open;
+        return /* @__PURE__ */ jsxs(
+          "a",
+          {
+            href: `/admin/support/ticket?id=${t.id}`,
+            style: {
+              display: "flex",
+              alignItems: "center",
+              gap: "8px",
+              padding: "6px 10px",
+              borderRadius: "6px",
+              border: `1px solid ${C.border}`,
+              textDecoration: "none",
+              fontSize: "12px",
+              color: "#374151",
+              backgroundColor: "#fafafa"
+            },
+            children: [
+              /* @__PURE__ */ jsx("span", { style: { fontFamily: "'SF Mono', 'Fira Code', 'JetBrains Mono', 'Cascadia Code', monospace", fontWeight: 600, color: C.textMuted, fontSize: "11px", whiteSpace: "nowrap" }, children: t.ticketNumber }),
+              /* @__PURE__ */ jsx("span", { style: { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", fontWeight: 600 }, children: t.subject }),
+              /* @__PURE__ */ jsx("span", { style: s.badge(st.bg, st.color), children: st.label }),
+              /* @__PURE__ */ jsx("span", { style: { fontSize: "10px", color: C.textMuted, whiteSpace: "nowrap" }, children: new Date(t.createdAt).toLocaleDateString("fr-FR", { day: "numeric", month: "short" }) })
+            ]
+          },
+          t.id
+        );
+      }) }),
+      /* @__PURE__ */ jsx("h5", { style: { fontSize: "12px", fontWeight: 600, color: C.textSecondary, marginBottom: "8px" }, children: "Projets" }),
+      clientProjects.length === 0 ? /* @__PURE__ */ jsx("p", { style: { fontSize: "12px", color: C.textMuted, fontStyle: "italic", marginBottom: "14px" }, children: "Aucun projet" }) : /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: "6px", flexWrap: "wrap", marginBottom: "14px" }, children: clientProjects.map((p) => {
+        const ps = projectStatusLabels[p.status] || projectStatusLabels.active;
+        return /* @__PURE__ */ jsxs(
+          "a",
+          {
+            href: `/admin/collections/projects/${p.id}`,
+            style: {
+              display: "inline-flex",
+              alignItems: "center",
+              gap: "6px",
+              padding: "5px 10px",
+              borderRadius: "6px",
+              border: `1px solid ${C.border}`,
+              textDecoration: "none",
+              fontSize: "12px",
+              fontWeight: 600,
+              color: "#374151",
+              backgroundColor: "#fafafa"
+            },
+            children: [
+              p.name,
+              /* @__PURE__ */ jsx("span", { style: s.badge(ps.bg, ps.color), children: ps.label })
+            ]
+          },
+          p.id
+        );
+      }) }),
+      /* @__PURE__ */ jsx("h5", { style: { fontSize: "12px", fontWeight: 600, color: C.textSecondary, marginBottom: "8px" }, children: "Notes internes" }),
+      /* @__PURE__ */ jsx(
+        "textarea",
+        {
+          value: clientNotes,
+          onChange: (e) => onNotesChange(e.target.value),
+          rows: 3,
+          style: { ...s.input, width: "100%", resize: "vertical", fontSize: "12px", marginBottom: "8px" },
+          placeholder: "Notes sur ce client..."
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: onNotesSave,
+          disabled: savingNotes,
+          style: { ...s.btn(notesSaved ? "#16a34a" : C.blue, savingNotes), fontSize: "11px", padding: "5px 12px" },
+          children: notesSaved ? "Sauvegarde OK" : savingNotes ? "Sauvegarde..." : "Sauvegarder les notes"
+        }
+      )
+    ] })
+  ] });
+}
+function TimeTrackingPanel({
+  timeEntries,
+  totalMinutes,
+  timerRunning,
+  timerSeconds,
+  setTimerSeconds,
+  timerDescription,
+  setTimerDescription,
+  handleTimerStart,
+  handleTimerStop,
+  handleTimerSave,
+  handleTimerDiscard,
+  duration,
+  setDuration,
+  timeDescription,
+  setTimeDescription,
+  handleAddTime,
+  addingTime,
+  timeSuccess
+}) {
+  const totalH = Math.floor(totalMinutes / 60);
+  const totalM = totalMinutes % 60;
+  return /* @__PURE__ */ jsxs("div", { style: s.section, children: [
+    /* @__PURE__ */ jsxs("h4", { style: s.sectionTitle, children: [
+      "Temps",
+      totalMinutes > 0 && /* @__PURE__ */ jsxs("span", { style: s.badge("#fef3c7", "#92400e"), children: [
+        totalH,
+        "h",
+        String(totalM).padStart(2, "0"),
+        " total"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: {
+      display: "flex",
+      alignItems: "center",
+      gap: "10px",
+      flexWrap: "wrap",
+      padding: "12px 16px",
+      borderRadius: "10px",
+      marginBottom: "14px",
+      backgroundColor: timerRunning ? "#fef2f2" : "var(--theme-elevation-100)",
+      border: timerRunning ? "1px solid #fca5a5" : "1px solid var(--theme-elevation-300)"
+    }, children: [
+      /* @__PURE__ */ jsxs("div", { style: {
+        fontFamily: "monospace",
+        fontSize: "24px",
+        fontWeight: 700,
+        color: timerRunning ? "#dc2626" : "var(--theme-text)",
+        minWidth: "90px"
+      }, children: [
+        String(Math.floor(timerSeconds / 3600)).padStart(2, "0"),
+        ":",
+        String(Math.floor(timerSeconds % 3600 / 60)).padStart(2, "0"),
+        ":",
+        String(timerSeconds % 60).padStart(2, "0")
+      ] }),
+      !timerRunning && timerSeconds > 0 && /* @__PURE__ */ jsx("div", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [-5, -1, 1, 5, 15, 30].map((m) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: () => setTimerSeconds((p) => Math.max(0, p + m * 60)),
+          style: { width: Math.abs(m) >= 15 ? "32px" : "28px", height: "28px", borderRadius: "6px", border: "1px solid #e2e8f0", background: "white", cursor: "pointer", fontSize: Math.abs(m) >= 15 ? "12px" : "14px", fontWeight: 700, color: "#64748b" },
+          title: `${m > 0 ? "+" : ""}${m} min`,
+          children: m > 0 ? `+${m}` : String(m)
+        },
+        m
+      )) }),
+      !timerRunning && timerSeconds === 0 && /* @__PURE__ */ jsx("button", { onClick: () => handleTimerStart(true), style: { ...s.btn("#dc2626", false), fontSize: "12px", padding: "6px 16px", display: "flex", alignItems: "center", gap: "6px" }, children: "\u25B6 D\xE9marrer" }),
+      timerRunning && /* @__PURE__ */ jsx("button", { onClick: handleTimerStop, style: { ...s.btn("#374151", false), fontSize: "12px", padding: "6px 16px", display: "flex", alignItems: "center", gap: "6px" }, children: "\u23F8 Pause" }),
+      !timerRunning && timerSeconds > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("button", { onClick: () => handleTimerStart(false), style: { ...s.btn("#dc2626", false), fontSize: "12px", padding: "6px 14px" }, children: "\u25B6 Reprendre" }),
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "text",
+            value: timerDescription,
+            onChange: (e) => setTimerDescription(e.target.value),
+            placeholder: "Description...",
+            style: { ...s.input, fontSize: "12px", flex: 1, minWidth: "120px" }
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: handleTimerSave,
+            disabled: addingTime || timerSeconds < 60,
+            style: { ...s.btn("#16a34a", addingTime || timerSeconds < 60), fontSize: "12px", padding: "6px 14px" },
+            title: timerSeconds < 60 ? "Minimum 1 minute" : `Sauvegarder ${Math.round(timerSeconds / 60)} min`,
+            children: [
+              "\u{1F4BE} ",
+              Math.round(timerSeconds / 60),
+              " min"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx("button", { onClick: handleTimerDiscard, style: { background: "none", border: "none", cursor: "pointer", fontSize: "14px", color: "#94a3b8", padding: "4px" }, title: "Annuler", children: "\u2715" })
+      ] }),
+      timerRunning && /* @__PURE__ */ jsx("span", { style: { fontSize: "11px", color: "#dc2626", fontWeight: 600 }, children: "\u25CF Enregistrement en cours \u2014 session maintenue active" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", alignItems: "flex-end", flexWrap: "wrap", marginBottom: "14px" }, children: [
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx("label", { style: { display: "block", fontSize: "11px", color: C.textSecondary, marginBottom: "3px", fontWeight: 600 }, children: "Min" }),
+        /* @__PURE__ */ jsx("input", { type: "number", min: "1", value: duration, onChange: (e) => setDuration(e.target.value), placeholder: "30", style: { ...s.input, width: "80px" } })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { style: { flex: 1 }, children: [
+        /* @__PURE__ */ jsx("label", { style: { display: "block", fontSize: "11px", color: C.textSecondary, marginBottom: "3px", fontWeight: 600 }, children: "Description" }),
+        /* @__PURE__ */ jsx("input", { type: "text", value: timeDescription, onChange: (e) => setTimeDescription(e.target.value), placeholder: "Travail effectu\xE9...", style: { ...s.input, width: "100%" } })
+      ] }),
+      /* @__PURE__ */ jsx("button", { onClick: handleAddTime, disabled: addingTime || !duration, style: s.btn(C.amber, addingTime || !duration), children: addingTime ? "..." : "+ Temps" }),
+      timeSuccess && /* @__PURE__ */ jsx("span", { style: { fontSize: "12px", color: "#16a34a", fontWeight: 600 }, children: timeSuccess })
+    ] }),
+    timeEntries.length > 0 && /* @__PURE__ */ jsx("div", { style: { fontSize: "12px" }, children: /* @__PURE__ */ jsxs("table", { style: { width: "100%", borderCollapse: "collapse" }, children: [
+      /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { style: { borderBottom: `1px solid ${C.border}` }, children: [
+        /* @__PURE__ */ jsx("th", { style: { textAlign: "left", padding: "6px 8px", fontWeight: 600, fontSize: "11px", color: C.textSecondary }, children: "Date" }),
+        /* @__PURE__ */ jsx("th", { style: { textAlign: "left", padding: "6px 8px", fontWeight: 600, fontSize: "11px", color: C.textSecondary }, children: "Dur\xE9e" }),
+        /* @__PURE__ */ jsx("th", { style: { textAlign: "left", padding: "6px 8px", fontWeight: 600, fontSize: "11px", color: C.textSecondary }, children: "Description" })
+      ] }) }),
+      /* @__PURE__ */ jsx("tbody", { children: timeEntries.map((entry) => /* @__PURE__ */ jsxs("tr", { style: { borderBottom: "1px solid #f1f5f9" }, children: [
+        /* @__PURE__ */ jsx("td", { style: { padding: "6px 8px", color: "#374151" }, children: new Date(entry.date).toLocaleDateString("fr-FR", { day: "numeric", month: "short" }) }),
+        /* @__PURE__ */ jsxs("td", { style: { padding: "6px 8px", fontWeight: 600, color: "#374151" }, children: [
+          entry.duration,
+          " min"
+        ] }),
+        /* @__PURE__ */ jsx("td", { style: { padding: "6px 8px", color: C.textSecondary }, children: entry.description || "\u2014" })
+      ] }, entry.id)) })
+    ] }) })
+  ] });
+}
+function useTimeTracking(id, fetchAll) {
+  const [duration, setDuration] = useState("");
+  const [timeDescription, setTimeDescription] = useState("");
+  const [addingTime, setAddingTime] = useState(false);
+  const [timeSuccess, setTimeSuccess] = useState("");
+  const [timerRunning, setTimerRunning] = useState(false);
+  const [timerSeconds, setTimerSeconds] = useState(0);
+  const [timerDescription, setTimerDescription] = useState("");
+  const timerIntervalRef = useRef(null);
+  const timerKeepAliveRef = useRef(null);
+  const handleAddTime = async () => {
+    if (!duration || !id) return;
+    setAddingTime(true);
+    setTimeSuccess("");
+    try {
+      const res = await fetch("/api/time-entries", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({
+          ticket: id,
+          duration: parseInt(duration, 10),
+          date: (/* @__PURE__ */ new Date()).toISOString(),
+          description: timeDescription.trim() || void 0
+        })
+      });
+      if (res.ok) {
+        setDuration("");
+        setTimeDescription("");
+        setTimeSuccess(`${duration} min ajout\xE9es`);
+        setTimeout(() => setTimeSuccess(""), 3e3);
+        fetchAll();
+      }
+    } catch {
+    } finally {
+      setAddingTime(false);
+    }
+  };
+  const handleTimerStart = (reset = false) => {
+    setTimerRunning(true);
+    if (reset) setTimerSeconds(0);
+    timerIntervalRef.current = setInterval(() => {
+      setTimerSeconds((prev) => prev + 1);
+    }, 1e3);
+    timerKeepAliveRef.current = setInterval(() => {
+      fetch("/api/users/me", { credentials: "include" }).catch(() => {
+      });
+    }, 5 * 60 * 1e3);
+  };
+  const handleTimerStop = () => {
+    setTimerRunning(false);
+    if (timerIntervalRef.current) {
+      clearInterval(timerIntervalRef.current);
+      timerIntervalRef.current = null;
+    }
+    if (timerKeepAliveRef.current) {
+      clearInterval(timerKeepAliveRef.current);
+      timerKeepAliveRef.current = null;
+    }
+  };
+  const handleTimerSave = async () => {
+    if (!id || timerSeconds < 60) return;
+    const minutes = Math.round(timerSeconds / 60);
+    setAddingTime(true);
+    try {
+      const res = await fetch("/api/time-entries", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({
+          ticket: id,
+          duration: minutes,
+          date: (/* @__PURE__ */ new Date()).toISOString(),
+          description: timerDescription.trim() || "Timer"
+        })
+      });
+      if (res.ok) {
+        setTimeSuccess(`${minutes} min ajout\xE9es (timer)`);
+        setTimeout(() => setTimeSuccess(""), 3e3);
+        setTimerSeconds(0);
+        setTimerDescription("");
+        fetchAll();
+      }
+    } catch {
+    } finally {
+      setAddingTime(false);
+    }
+  };
+  const handleTimerDiscard = () => {
+    setTimerSeconds(0);
+    setTimerDescription("");
+  };
+  useEffect(() => {
+    return () => {
+      if (timerIntervalRef.current) clearInterval(timerIntervalRef.current);
+      if (timerKeepAliveRef.current) clearInterval(timerKeepAliveRef.current);
+    };
+  }, []);
+  return {
+    duration,
+    setDuration,
+    timeDescription,
+    setTimeDescription,
+    addingTime,
+    timeSuccess,
+    timerRunning,
+    timerSeconds,
+    setTimerSeconds,
+    timerDescription,
+    setTimerDescription,
+    handleAddTime,
+    handleTimerStart,
+    handleTimerStop,
+    handleTimerSave,
+    handleTimerDiscard
+  };
+}
+function useMessageActions(id, client, fetchAll) {
+  const [togglingAuthor, setTogglingAuthor] = useState(null);
+  const [editingMsg, setEditingMsg] = useState(null);
+  const [editBody, setEditBody] = useState("");
+  const [editHtml, setEditHtml] = useState("");
+  const [savingEdit, setSavingEdit] = useState(false);
+  const [deletingMsg, setDeletingMsg] = useState(null);
+  const [resendingMsg, setResendingMsg] = useState(null);
+  const [resendSuccess, setResendSuccess] = useState(null);
+  const handleEditStart = (msg) => {
+    setEditingMsg(msg.id);
+    setEditBody(msg.body);
+    setEditHtml(msg.bodyHtml || msg.body.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/\n/g, "<br />"));
+  };
+  const handleEditSave = async (msgId) => {
+    if (!editBody.trim()) return;
+    setSavingEdit(true);
+    try {
+      const res = await fetch(`/api/ticket-messages/${msgId}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({ body: editBody.trim(), ...editHtml ? { bodyHtml: editHtml } : {} })
+      });
+      if (res.ok) {
+        setEditingMsg(null);
+        setEditBody("");
+        fetchAll();
+      }
+    } catch {
+    } finally {
+      setSavingEdit(false);
+    }
+  };
+  const handleEditCancel = () => {
+    setEditingMsg(null);
+    setEditBody("");
+    setEditHtml("");
+  };
+  const handleDelete = async (msgId) => {
+    if (!window.confirm("Supprimer ce message ?")) return;
+    setDeletingMsg(msgId);
+    try {
+      const res = await fetch(`/api/ticket-messages/${msgId}`, {
+        method: "DELETE",
+        credentials: "include"
+      });
+      if (res.ok) fetchAll();
+    } catch {
+    } finally {
+      setDeletingMsg(null);
+    }
+  };
+  const handleResend = async (msgId) => {
+    setResendingMsg(msgId);
+    setResendSuccess(null);
+    try {
+      const res = await fetch("/api/support/resend-notification", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({ messageId: msgId })
+      });
+      if (res.ok) {
+        setResendSuccess(msgId);
+        setTimeout(() => setResendSuccess(null), 3e3);
+      }
+    } catch {
+    } finally {
+      setResendingMsg(null);
+    }
+  };
+  const handleToggleAuthor = async (msgId, currentType) => {
+    const newType = currentType === "admin" ? "client" : "admin";
+    setTogglingAuthor(msgId);
+    try {
+      const patchData = { authorType: newType };
+      if (newType === "client" && client) {
+        patchData.authorClient = client.id;
+      }
+      const res = await fetch(`/api/ticket-messages/${msgId}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify(patchData)
+      });
+      if (res.ok) fetchAll();
+    } catch {
+    } finally {
+      setTogglingAuthor(null);
+    }
+  };
+  const handleSplitMessage = async (msgId, ticketSubject) => {
+    const subject = prompt("Sujet du nouveau ticket :", `Split: ${ticketSubject}`);
+    if (!subject) return;
+    try {
+      const res = await fetch("/api/support/split-ticket", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({ messageId: msgId, subject })
+      });
+      if (res.ok) {
+        const data = await res.json();
+        alert(`Ticket ${data.ticketNumber} cr\xE9\xE9`);
+        fetchAll();
+      }
+    } catch {
+    }
+  };
+  return {
+    togglingAuthor,
+    editingMsg,
+    editBody,
+    editHtml,
+    setEditHtml,
+    savingEdit,
+    handleEditStart,
+    handleEditSave,
+    handleEditCancel,
+    deletingMsg,
+    handleDelete,
+    resendingMsg,
+    resendSuccess,
+    handleResend,
+    handleToggleAuthor,
+    handleSplitMessage,
+    setEditBody
+  };
+}
+function useTicketActions(id, fetchAll) {
+  const [statusUpdating, setStatusUpdating] = useState(false);
+  const [showMerge, setShowMerge] = useState(false);
+  const [mergeTarget, setMergeTarget] = useState("");
+  const [mergeTargetInfo, setMergeTargetInfo] = useState(null);
+  const [merging, setMerging] = useState(false);
+  const [mergeError, setMergeError] = useState("");
+  const [showExtMsg, setShowExtMsg] = useState(false);
+  const [extMsgBody, setExtMsgBody] = useState("");
+  const [extMsgAuthor, setExtMsgAuthor] = useState("client");
+  const [extMsgDate, setExtMsgDate] = useState("");
+  const [extMsgFiles, setExtMsgFiles] = useState([]);
+  const [sendingExtMsg, setSendingExtMsg] = useState(false);
+  const extFileInputRef = useRef(null);
+  const [showSnooze, setShowSnooze] = useState(false);
+  const [snoozeUntil, setSnoozeUntil] = useState(null);
+  const [snoozeSaving, setSnoozeSaving] = useState(false);
+  const [showNextTicket, setShowNextTicket] = useState(false);
+  const [nextTicketId, setNextTicketId] = useState(null);
+  const [nextTicketInfo, setNextTicketInfo] = useState("");
+  const handleStatusChange = async (newStatus) => {
+    if (!id) return;
+    setStatusUpdating(true);
+    try {
+      await fetch(`/api/tickets/${id}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({ status: newStatus })
+      });
+      window.location.reload();
+    } catch {
+    } finally {
+      setStatusUpdating(false);
+    }
+  };
+  const handleMergeLookup = async () => {
+    if (!mergeTarget.trim()) return;
+    setMergeTargetInfo(null);
+    setMergeError("");
+    try {
+      const searchVal = mergeTarget.trim().toUpperCase();
+      const res = await fetch(`/api/tickets?where[ticketNumber][equals]=${encodeURIComponent(searchVal)}&limit=1&depth=0`, { credentials: "include" });
+      if (res.ok) {
+        const d = await res.json();
+        if (d.docs?.length > 0) {
+          const t = d.docs[0];
+          if (String(t.id) === String(id)) {
+            setMergeError("Impossible de fusionner un ticket avec lui-m\xEAme");
+          } else {
+            setMergeTargetInfo({ id: t.id, ticketNumber: t.ticketNumber, subject: t.subject });
+          }
+        } else {
+          setMergeError("Ticket introuvable");
+        }
+      }
+    } catch {
+      setMergeError("Erreur de recherche");
+    }
+  };
+  const handleMerge = async () => {
+    if (!mergeTargetInfo || !id) return;
+    setMerging(true);
+    setMergeError("");
+    try {
+      const res = await fetch("/api/support/merge-tickets", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({ sourceTicketId: id, targetTicketId: mergeTargetInfo.id })
+      });
+      if (res.ok) {
+        window.location.href = `/admin/collections/tickets/${mergeTargetInfo.id}`;
+      } else {
+        const d = await res.json().catch(() => ({}));
+        setMergeError(d.error || "Erreur de fusion");
+      }
+    } catch {
+      setMergeError("Erreur r\xE9seau");
+    } finally {
+      setMerging(false);
+    }
+  };
+  const handleExtFileChange = (e) => {
+    if (e.target.files) {
+      const maxSize = 1 * 1024 * 1024;
+      const newFiles = Array.from(e.target.files);
+      const tooLarge = newFiles.filter((f) => f.size > maxSize);
+      if (tooLarge.length > 0) {
+        alert(`Fichier(s) trop volumineux (max 1 Mo) : ${tooLarge.map((f) => f.name).join(", ")}`);
+      }
+      setExtMsgFiles((prev) => [...prev, ...newFiles.filter((f) => f.size <= maxSize)]);
+    }
+    if (extFileInputRef.current) extFileInputRef.current.value = "";
+  };
+  const handleSendExtMsg = async () => {
+    if (!extMsgBody.trim() || !id) return;
+    setSendingExtMsg(true);
+    try {
+      const uploadedIds = [];
+      for (const file of extMsgFiles) {
+        if (file.size > 1 * 1024 * 1024) continue;
+        const formData = new FormData();
+        formData.append("file", file);
+        formData.append("_payload", JSON.stringify({ alt: file.name }));
+        const uploadRes = await fetch("/api/media", { method: "POST", credentials: "include", body: formData });
+        if (uploadRes.ok) {
+          const d = await uploadRes.json();
+          if (d.doc?.id) uploadedIds.push(d.doc.id);
+        }
+      }
+      const messageData = {
+        ticket: id,
+        body: extMsgBody.trim(),
+        authorType: extMsgAuthor,
+        isInternal: false,
+        skipNotification: true
+      };
+      if (extMsgDate) {
+        messageData.createdAt = new Date(extMsgDate).toISOString();
+      }
+      if (uploadedIds.length > 0) {
+        messageData.attachments = uploadedIds.map((mid) => ({ file: mid }));
+      }
+      const res = await fetch("/api/ticket-messages", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify(messageData)
+      });
+      if (res.ok) {
+        setExtMsgBody("");
+        setExtMsgDate("");
+        setExtMsgFiles([]);
+        setShowExtMsg(false);
+        fetchAll();
+      }
+    } catch {
+    } finally {
+      setSendingExtMsg(false);
+    }
+  };
+  const handleSnooze = async (days, customDate) => {
+    if (!id) return;
+    setSnoozeSaving(true);
+    try {
+      let newSnooze = null;
+      if (days !== null) {
+        const d = /* @__PURE__ */ new Date();
+        d.setDate(d.getDate() + days);
+        newSnooze = d.toISOString();
+      } else if (customDate) {
+        newSnooze = new Date(customDate).toISOString();
+      }
+      await fetch(`/api/tickets/${id}`, {
+        method: "PATCH",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({ snoozeUntil: newSnooze })
+      });
+      setSnoozeUntil(newSnooze);
+      setShowSnooze(false);
+      fetchAll();
+    } catch {
+    } finally {
+      setSnoozeSaving(false);
+    }
+  };
+  const handleNextTicket = async () => {
+    try {
+      const res = await fetch("/api/tickets?where[status][equals]=open&sort=updatedAt&limit=1&depth=0", { credentials: "include" });
+      if (res.ok) {
+        const d = await res.json();
+        if (d.docs?.length > 0 && String(d.docs[0].id) !== String(id)) {
+          setNextTicketId(d.docs[0].id);
+          setNextTicketInfo(`${d.docs[0].ticketNumber} \u2014 ${d.docs[0].subject}`);
+        } else {
+          setNextTicketId(null);
+          setNextTicketInfo("Aucun autre ticket ouvert");
+        }
+        setShowNextTicket(true);
+      }
+    } catch {
+    }
+  };
+  return {
+    statusUpdating,
+    handleStatusChange,
+    showMerge,
+    setShowMerge,
+    mergeTarget,
+    setMergeTarget,
+    mergeTargetInfo,
+    setMergeTargetInfo,
+    mergeError,
+    setMergeError,
+    merging,
+    handleMergeLookup,
+    handleMerge,
+    showExtMsg,
+    setShowExtMsg,
+    extMsgBody,
+    setExtMsgBody,
+    extMsgAuthor,
+    setExtMsgAuthor,
+    extMsgDate,
+    setExtMsgDate,
+    extMsgFiles,
+    setExtMsgFiles,
+    sendingExtMsg,
+    handleExtFileChange,
+    handleSendExtMsg,
+    showSnooze,
+    setShowSnooze,
+    snoozeUntil,
+    setSnoozeUntil,
+    snoozeSaving,
+    handleSnooze,
+    showNextTicket,
+    setShowNextTicket,
+    nextTicketId,
+    nextTicketInfo,
+    handleNextTicket
+  };
+}
+function useReply(id, client, cannedResponses, ticketNumber, ticketSubject, fetchAll, handleNextTicket, replyEditorRef) {
+  const fileInputRef = useRef(null);
+  const [replyBody, setReplyBody] = useState("");
+  const [replyHtml, setReplyHtml] = useState("");
+  const [replyFiles, setReplyFiles] = useState([]);
+  const [isInternal, setIsInternal] = useState(false);
+  const [notifyClient, setNotifyClient] = useState(false);
+  const [sendAsClient, setSendAsClient] = useState(false);
+  const [sending, setSending] = useState(false);
+  const [showSchedule, setShowSchedule] = useState(false);
+  const [scheduleDate, setScheduleDate] = useState("");
+  const handleEditorFileUpload = useCallback(async (file) => {
+    if (file.size > 5 * 1024 * 1024) return null;
+    const formData = new FormData();
+    formData.append("file", file);
+    formData.append("_payload", JSON.stringify({ alt: file.name }));
+    try {
+      const res = await fetch("/api/media", { method: "POST", credentials: "include", body: formData });
+      if (res.ok) {
+        const data = await res.json();
+        return data.doc?.url || null;
+      }
+    } catch {
+    }
+    return null;
+  }, []);
+  const replaceCannedVariables = useCallback((text) => {
+    let result = text;
+    if (client) {
+      result = result.replace(/\{\{client\.firstName\}\}/g, client.firstName || "Client");
+      result = result.replace(/\{\{client\.lastName\}\}/g, client.lastName || "");
+      result = result.replace(/\{\{client\.company\}\}/g, client.company || "");
+      result = result.replace(/\{\{client\.email\}\}/g, client.email || "");
+      result = result.replace(/\{\{clientName\}\}/g, client.firstName || "Client");
+    }
+    result = result.replace(/\{\{ticket\.number\}\}/g, ticketNumber || "");
+    result = result.replace(/\{\{ticket\.subject\}\}/g, ticketSubject || "");
+    result = result.replace(/\{\{agent\.name\}\}/g, "Support");
+    return result;
+  }, [client, ticketNumber, ticketSubject]);
+  const handleCannedSelect = (e) => {
+    const selected = cannedResponses.find((cr) => String(cr.id) === e.target.value);
+    if (selected) {
+      const body = replaceCannedVariables(selected.body);
+      const html = body.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/\n/g, "<br />");
+      setReplyBody(body);
+      setReplyHtml(html);
+      replyEditorRef.current?.setContent(html);
+    }
+    e.target.value = "";
+  };
+  const handleReplyFileChange = (e) => {
+    if (e.target.files) {
+      const maxSize = 1 * 1024 * 1024;
+      const newFiles = Array.from(e.target.files);
+      const tooLarge = newFiles.filter((f) => f.size > maxSize);
+      if (tooLarge.length > 0) {
+        alert(`Fichier(s) trop volumineux (max 1 Mo) : ${tooLarge.map((f) => f.name).join(", ")}`);
+      }
+      setReplyFiles((prev) => [...prev, ...newFiles.filter((f) => f.size <= maxSize)]);
+    }
+    if (fileInputRef.current) fileInputRef.current.value = "";
+  };
+  const uploadFiles = async (files) => {
+    const uploadedIds = [];
+    for (const file of files) {
+      if (file.size > 1 * 1024 * 1024) continue;
+      const formData = new FormData();
+      formData.append("file", file);
+      formData.append("_payload", JSON.stringify({ alt: file.name }));
+      const uploadRes = await fetch("/api/media", { method: "POST", credentials: "include", body: formData });
+      if (uploadRes.ok) {
+        const d = await uploadRes.json();
+        if (d.doc?.id) uploadedIds.push(d.doc.id);
+      }
+    }
+    return uploadedIds;
+  };
+  const resetReply = () => {
+    setReplyBody("");
+    setReplyHtml("");
+    setReplyFiles([]);
+    setIsInternal(false);
+    setNotifyClient(false);
+    setSendAsClient(false);
+    replyEditorRef.current?.clear();
+  };
+  const handleSendReply = async () => {
+    if (!replyBody.trim() || !id) return;
+    setSending(true);
+    try {
+      const uploadedIds = await uploadFiles(replyFiles);
+      const finalBody = replyBody.trim() || (replyHtml ? "[Contenu enrichi]" : "");
+      const messageData = {
+        ticket: id,
+        body: finalBody,
+        ...replyHtml ? { bodyHtml: replyHtml } : {},
+        authorType: sendAsClient ? "client" : "admin",
+        isInternal,
+        skipNotification: isInternal || !notifyClient,
+        ...sendAsClient && client ? { authorClient: client.id } : {}
+      };
+      if (uploadedIds.length > 0) {
+        messageData.attachments = uploadedIds.map((mid) => ({ file: mid }));
+      }
+      const res = await fetch("/api/ticket-messages", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify(messageData)
+      });
+      if (res.ok) {
+        resetReply();
+        fetchAll();
+        if (!isInternal) handleNextTicket();
+      }
+    } catch {
+    } finally {
+      setSending(false);
+    }
+  };
+  const handleScheduleReply = async () => {
+    if (!replyBody.trim() || !id || !scheduleDate) return;
+    setSending(true);
+    try {
+      const uploadedIds = await uploadFiles(replyFiles);
+      const messageData = {
+        ticket: id,
+        body: replyBody.trim(),
+        ...replyHtml ? { bodyHtml: replyHtml } : {},
+        authorType: "admin",
+        isInternal: false,
+        skipNotification: true,
+        scheduledAt: new Date(scheduleDate).toISOString(),
+        scheduledSent: false
+      };
+      if (uploadedIds.length > 0) {
+        messageData.attachments = uploadedIds.map((mid) => ({ file: mid }));
+      }
+      const res = await fetch("/api/ticket-messages", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify(messageData)
+      });
+      if (res.ok) {
+        resetReply();
+        setShowSchedule(false);
+        setScheduleDate("");
+        fetchAll();
+      }
+    } catch {
+    } finally {
+      setSending(false);
+    }
+  };
+  return {
+    fileInputRef,
+    replyBody,
+    setReplyBody,
+    replyHtml,
+    setReplyHtml,
+    replyFiles,
+    setReplyFiles,
+    isInternal,
+    setIsInternal,
+    notifyClient,
+    setNotifyClient,
+    sendAsClient,
+    setSendAsClient,
+    sending,
+    showSchedule,
+    setShowSchedule,
+    scheduleDate,
+    setScheduleDate,
+    handleEditorFileUpload,
+    handleCannedSelect,
+    handleReplyFileChange,
+    handleSendReply,
+    handleScheduleReply
+  };
+}
+function useAI(messages, client, ticketSubject, replyBody, setReplyBody, setReplyHtml, replyEditorRef) {
+  const [clientSentiment, setClientSentiment] = useState(null);
+  const [aiReplying, setAiReplying] = useState(false);
+  const [aiRewriting, setAiRewriting] = useState(false);
+  const [showAiSummary, setShowAiSummary] = useState(false);
+  const [aiSummary, setAiSummary] = useState("");
+  const [aiGenerating, setAiGenerating] = useState(false);
+  const [aiSaving, setAiSaving] = useState(false);
+  const [aiSaved, setAiSaved] = useState(false);
+  useEffect(() => {
+    if (messages.length === 0) return;
+    const lastClientMsg = [...messages].reverse().find((m) => m.authorType === "client" || m.authorType === "email");
+    if (!lastClientMsg) return;
+    const analyze = async () => {
+      try {
+        const res = await fetch("/api/support/ai", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          credentials: "include",
+          body: JSON.stringify({ action: "sentiment", text: lastClientMsg.body.slice(0, 500) })
+        });
+        if (res.ok) {
+          const data = await res.json();
+          const raw = (data.sentiment || "").toLowerCase().trim();
+          const sentimentMap = {
+            "frustr\xE9": { emoji: "\u{1F624}", label: "Frustr\xE9", color: "#dc2626" },
+            "frustre": { emoji: "\u{1F624}", label: "Frustr\xE9", color: "#dc2626" },
+            "m\xE9content": { emoji: "\u{1F620}", label: "M\xE9content", color: "#ea580c" },
+            "mecontent": { emoji: "\u{1F620}", label: "M\xE9content", color: "#ea580c" },
+            "urgent": { emoji: "\u{1F525}", label: "Urgent", color: "#dc2626" },
+            "neutre": { emoji: "\u{1F610}", label: "Neutre", color: "#6b7280" },
+            "satisfait": { emoji: "\u{1F60A}", label: "Satisfait", color: "#16a34a" }
+          };
+          const match = Object.keys(sentimentMap).find((k) => raw.includes(k));
+          if (match) setClientSentiment(sentimentMap[match]);
+          else setClientSentiment({ emoji: "\u{1F610}", label: "Neutre", color: "#6b7280" });
+        }
+      } catch {
+      }
+    };
+    analyze();
+  }, [messages.length]);
+  const handleAiSuggestReply = async () => {
+    if (messages.length === 0) return;
+    setAiReplying(true);
+    try {
+      const res = await fetch("/api/support/ai", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({
+          action: "suggest_reply",
+          messages: messages.slice(-10).map((m) => ({ authorType: m.authorType, body: m.body })),
+          clientName: `${client?.firstName || ""} ${client?.lastName || ""}`.trim(),
+          clientCompany: client?.company
+        })
+      });
+      if (res.ok) {
+        const data = await res.json();
+        const suggestion = data.reply || "";
+        if (suggestion) {
+          setReplyBody(suggestion);
+          setReplyHtml(suggestion.replace(/\n/g, "<br/>"));
+          if (replyEditorRef.current?.setContent) {
+            replyEditorRef.current.setContent(suggestion.replace(/\n/g, "<br/>"));
+          }
+        }
+      }
+    } catch (err) {
+      console.error("AI suggest error:", err);
+    }
+    setAiReplying(false);
+  };
+  const handleAiRewrite = async () => {
+    if (!replyBody.trim()) return;
+    setAiRewriting(true);
+    try {
+      const res = await fetch("/api/support/ai", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({ action: "rewrite", text: replyBody })
+      });
+      if (res.ok) {
+        const data = await res.json();
+        const rewritten = data.rewritten || "";
+        if (rewritten) {
+          setReplyBody(rewritten);
+          setReplyHtml(rewritten.replace(/\n/g, "<br/>"));
+          if (replyEditorRef.current?.setContent) {
+            replyEditorRef.current.setContent(rewritten.replace(/\n/g, "<br/>"));
+          }
+        }
+      }
+    } catch (err) {
+      console.error("AI rewrite error:", err);
+    }
+    setAiRewriting(false);
+  };
+  const handleAiGenerate = async () => {
+    if (messages.length === 0) return;
+    setAiGenerating(true);
+    setAiSummary("");
+    setAiSaved(false);
+    try {
+      const res = await fetch("/api/support/ai", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({
+          action: "synthesis",
+          messages: messages.map((m) => ({ authorType: m.authorType, body: m.body, createdAt: m.createdAt })),
+          ticketSubject,
+          clientName: `${client?.firstName || ""} ${client?.lastName || ""}`.trim(),
+          clientCompany: client?.company
+        })
+      });
+      if (res.ok) {
+        const data = await res.json();
+        setAiSummary(data.synthesis || "Aucune r\xE9ponse g\xE9n\xE9r\xE9e");
+      } else {
+        setAiSummary("Erreur lors de la g\xE9n\xE9ration de la synth\xE8se.");
+      }
+    } catch (err) {
+      setAiSummary(`Erreur de connexion : ${err instanceof Error ? err.message : "erreur inconnue"}`);
+    } finally {
+      setAiGenerating(false);
+    }
+  };
+  const handleAiSave = async (id, fetchAll) => {
+    if (!id || !aiSummary) return;
+    setAiSaving(true);
+    try {
+      const res = await fetch("/api/ticket-messages", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        credentials: "include",
+        body: JSON.stringify({
+          ticket: id,
+          body: `\u{1F4CB} **Synth\xE8se IA (${(/* @__PURE__ */ new Date()).toLocaleDateString("fr-FR")})**
+
+${aiSummary}`,
+          authorType: "admin",
+          isInternal: true
+        })
+      });
+      if (res.ok) {
+        setAiSaved(true);
+        fetchAll();
+      }
+    } catch {
+    } finally {
+      setAiSaving(false);
+    }
+  };
+  return {
+    clientSentiment,
+    aiReplying,
+    handleAiSuggestReply,
+    aiRewriting,
+    handleAiRewrite,
+    showAiSummary,
+    setShowAiSummary,
+    aiSummary,
+    aiGenerating,
+    handleAiGenerate,
+    aiSaving,
+    aiSaved,
+    handleAiSave
+  };
+}
+
+// src/components/TicketConversation/config.ts
+var DEFAULT_FEATURES = {
+  timeTracking: true,
+  ai: true,
+  satisfaction: true,
+  chat: true,
+  emailTracking: true,
+  canned: true,
+  merge: true,
+  snooze: true,
+  externalMessages: true,
+  clientHistory: true,
+  activityLog: true,
+  splitTicket: true,
+  scheduledReplies: true,
+  autoClose: true,
+  autoCloseDays: 7,
+  roundRobin: false
+};
+var STORAGE_KEY = "ticketing_features";
+function getFeatures() {
+  if (typeof window === "undefined") return DEFAULT_FEATURES;
+  try {
+    const stored = localStorage.getItem(STORAGE_KEY);
+    if (stored) {
+      const parsed = JSON.parse(stored);
+      return { ...DEFAULT_FEATURES, ...parsed };
+    }
+  } catch {
+  }
+  return DEFAULT_FEATURES;
+}
+function useDocumentIdFromUrl() {
+  const [id, setId] = useState(void 0);
+  useEffect(() => {
+    const match = window.location.pathname.match(
+      /\/admin\/collections\/[^/]+\/([^/?#]+)/
+    );
+    if (match && match[1] !== "create") {
+      const raw = match[1];
+      const num = Number(raw);
+      setId(Number.isFinite(num) && String(num) === raw ? num : raw);
+    }
+  }, []);
+  return { id };
+}
+function SkeletonText({ lines = 3 }) {
+  return /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "8px", padding: "12px 0" }, children: Array.from({ length: lines }).map((_, i) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: {
+        height: "14px",
+        borderRadius: "4px",
+        backgroundColor: "#e2e8f0",
+        width: i === lines - 1 ? "60%" : "100%",
+        animation: "pulse 1.5s ease-in-out infinite"
+      }
+    },
+    i
+  )) });
+}
+var layoutStyles = {
+  root: { padding: "12px 0" },
+  twoColumns: {
+    display: "grid",
+    gridTemplateColumns: "1fr 320px",
+    gap: "16px",
+    alignItems: "start"
+  },
+  mainColumn: { minWidth: 0 },
+  sideColumn: {
+    display: "flex",
+    flexDirection: "column",
+    gap: "12px",
+    position: "sticky",
+    top: "80px"
+  }
+};
+var TicketConversation = () => {
+  const { id } = useDocumentIdFromUrl();
+  const [features] = useState(() => getFeatures());
+  const [messages, setMessages] = useState([]);
+  const [timeEntries, setTimeEntries] = useState([]);
+  const [client, setClient] = useState(null);
+  const [cannedResponses, setCannedResponses] = useState([]);
+  const [activityLog, setActivityLog] = useState([]);
+  const [satisfaction, setSatisfaction] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [messagesCollapsed, setMessagesCollapsed] = useState(true);
+  const [searchQuery, setSearchQuery] = useState("");
+  const [copiedLink, setCopiedLink] = useState(null);
+  const prevMessageCountRef = useRef(0);
+  const [clientTyping, setClientTyping] = useState(false);
+  const [clientTypingName, setClientTypingName] = useState("");
+  const typingLastSent = useRef(0);
+  const [currentStatus, setCurrentStatus] = useState("");
+  const [ticketNumber, setTicketNumber] = useState("");
+  const [ticketSubject, setTicketSubject] = useState("");
+  const [ticketSource, setTicketSource] = useState("");
+  const [chatSession, setChatSession] = useState("");
+  const [clientTickets, setClientTickets] = useState([]);
+  const [clientProjects, setClientProjects] = useState([]);
+  const [clientNotes, setClientNotes] = useState("");
+  const [savingNotes, setSavingNotes] = useState(false);
+  const [notesSaved, setNotesSaved] = useState(false);
+  const [lastClientReadAt, setLastClientReadAt] = useState(null);
+  const fetchAll = useCallback(async () => {
+    if (!id) return;
+    try {
+      const [msgRes, timeRes, ticketRes, cannedRes, activityRes, csatRes] = await Promise.all([
+        fetch(`/api/ticket-messages?where[ticket][equals]=${id}&sort=createdAt&limit=200&depth=1`, { credentials: "include" }),
+        fetch(`/api/time-entries?where[ticket][equals]=${id}&sort=-date&limit=50&depth=0`, { credentials: "include" }),
+        fetch(`/api/tickets/${id}?depth=1`, { credentials: "include" }),
+        fetch(`/api/canned-responses?sort=sortOrder&limit=50&depth=0`, { credentials: "include" }),
+        fetch(`/api/ticket-activity-log?where[ticket][equals]=${id}&sort=-createdAt&limit=50&depth=0`, { credentials: "include" }),
+        fetch(`/api/satisfaction-surveys?where[ticket][equals]=${id}&limit=1&depth=0`, { credentials: "include" })
+      ]);
+      if (msgRes.ok) {
+        const d = await msgRes.json();
+        setMessages(d.docs || []);
+      }
+      if (timeRes.ok) {
+        const d = await timeRes.json();
+        setTimeEntries(d.docs || []);
+      }
+      let resolvedChatSession = "";
+      if (ticketRes.ok) {
+        const d = await ticketRes.json();
+        if (d.client && typeof d.client === "object") {
+          setClient(d.client);
+        }
+        setSnoozeUntil(d.snoozeUntil || null);
+        setLastClientReadAt(d.lastClientReadAt || null);
+        setCurrentStatus(d.status || "");
+        setTicketNumber(d.ticketNumber || "");
+        setTicketSubject(d.subject || "");
+        setTicketSource(d.source || "");
+        setChatSession(d.chatSession || "");
+        resolvedChatSession = d.chatSession || "";
+        const clientId = typeof d.client === "object" ? d.client?.id : d.client;
+        if (clientId) {
+          const [clientTicketsRes, projectsRes, clientDetailRes] = await Promise.all([
+            fetch(`/api/tickets?where[client][equals]=${clientId}&where[id][not_equals]=${id}&sort=-createdAt&limit=5&depth=0`, { credentials: "include" }),
+            fetch(`/api/projects?where[client][contains]=${clientId}&depth=0`, { credentials: "include" }),
+            fetch(`/api/support-clients/${clientId}?depth=0`, { credentials: "include" })
+          ]);
+          if (clientTicketsRes.ok) {
+            const ctData = await clientTicketsRes.json();
+            setClientTickets((ctData.docs || []).map((t) => ({
+              id: t.id,
+              ticketNumber: t.ticketNumber,
+              subject: t.subject,
+              status: t.status,
+              createdAt: t.createdAt
+            })));
+          }
+          if (projectsRes.ok) {
+            const pData = await projectsRes.json();
+            setClientProjects((pData.docs || []).map((p) => ({
+              id: p.id,
+              name: p.name,
+              status: p.status
+            })));
+          }
+          if (clientDetailRes.ok) {
+            const cdData = await clientDetailRes.json();
+            setClientNotes(cdData.notes || "");
+          }
+        }
+      }
+      if (cannedRes.ok) {
+        const d = await cannedRes.json();
+        setCannedResponses(d.docs || []);
+      }
+      if (activityRes.ok) {
+        const d = await activityRes.json();
+        setActivityLog(d.docs || []);
+      }
+      if (csatRes.ok) {
+        const d = await csatRes.json();
+        setSatisfaction(d.docs?.[0] || null);
+      }
+      if (resolvedChatSession) {
+        try {
+          const chatRes = await fetch(`/api/support/admin-chat?session=${encodeURIComponent(resolvedChatSession)}`, { credentials: "include" });
+          if (chatRes.ok) {
+            const chatData = await chatRes.json();
+            const chatMsgs = (chatData.messages || []).filter((cm) => cm.senderType !== "system").map((cm) => ({
+              id: `chat-${cm.id}`,
+              body: cm.message,
+              authorType: cm.senderType === "agent" ? "admin" : "client",
+              isInternal: false,
+              createdAt: cm.createdAt,
+              fromChat: true
+            }));
+            setMessages((prev) => {
+              const ticketMsgs = prev;
+              const merged = [...ticketMsgs];
+              for (const chatMsg of chatMsgs) {
+                const isDuplicate = ticketMsgs.some((tm) => {
+                  if (tm.body !== chatMsg.body) return false;
+                  const timeDiff = Math.abs(new Date(tm.createdAt).getTime() - new Date(chatMsg.createdAt).getTime());
+                  return timeDiff < 5e3;
+                });
+                if (!isDuplicate) {
+                  merged.push(chatMsg);
+                }
+              }
+              return merged.sort((a, b) => new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime());
+            });
+          }
+        } catch (err) {
+          console.warn("[TicketConversation] Chat fetch error:", err);
+        }
+      }
+    } catch (err) {
+      console.warn("[TicketConversation] Fetch error:", err);
+    } finally {
+      setLoading(false);
+    }
+  }, [id]);
+  useEffect(() => {
+    fetchAll();
+  }, [fetchAll]);
+  useEffect(() => {
+    if (!id) return;
+    fetch(`/api/tickets/${id}`, {
+      method: "PATCH",
+      headers: { "Content-Type": "application/json" },
+      credentials: "include",
+      body: JSON.stringify({ lastAdminReadAt: (/* @__PURE__ */ new Date()).toISOString() })
+    }).catch(() => {
+    });
+  }, [id, messages.length]);
+  const typingFailCount = useRef(0);
+  useEffect(() => {
+    if (!id) return;
+    typingFailCount.current = 0;
+    const poll = async () => {
+      if (typingFailCount.current >= 3) return;
+      try {
+        const res = await fetch(`/api/support/typing?ticketId=${id}`, { credentials: "include" });
+        if (res.ok) {
+          typingFailCount.current = 0;
+          const data = await res.json();
+          setClientTyping(data.typing);
+          setClientTypingName(data.name || "");
+        } else {
+          typingFailCount.current++;
+        }
+      } catch {
+        typingFailCount.current++;
+      }
+    };
+    poll();
+    const interval = setInterval(poll, 3e3);
+    return () => clearInterval(interval);
+  }, [id]);
+  const sendAdminTyping = useCallback(() => {
+    if (!id) return;
+    const now = Date.now();
+    if (now - typingLastSent.current < 3e3) return;
+    typingLastSent.current = now;
+    fetch("/api/support/typing", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      credentials: "include",
+      body: JSON.stringify({ ticketId: id })
+    }).catch(() => {
+    });
+  }, [id]);
+  const tt = useTimeTracking(id, fetchAll);
+  const { duration, setDuration, timeDescription, setTimeDescription, addingTime, timeSuccess, timerRunning, timerSeconds, setTimerSeconds, timerDescription, setTimerDescription, handleAddTime, handleTimerStart, handleTimerStop, handleTimerSave, handleTimerDiscard } = tt;
+  const ma = useMessageActions(id, client, fetchAll);
+  const { togglingAuthor, editingMsg, editBody, editHtml, setEditHtml, savingEdit, handleEditStart, handleEditSave, handleEditCancel, deletingMsg, handleDelete, resendingMsg, resendSuccess, handleResend, handleToggleAuthor, handleSplitMessage, setEditBody } = ma;
+  const ta = useTicketActions(id, fetchAll);
+  const { statusUpdating, handleStatusChange, showMerge, setShowMerge, mergeTarget, setMergeTarget, mergeTargetInfo, setMergeTargetInfo, mergeError, setMergeError, merging, handleMergeLookup, handleMerge, showExtMsg, setShowExtMsg, extMsgBody, setExtMsgBody, extMsgAuthor, setExtMsgAuthor, extMsgDate, setExtMsgDate, extMsgFiles, setExtMsgFiles, sendingExtMsg, handleExtFileChange, handleSendExtMsg, showSnooze, setShowSnooze, snoozeUntil, setSnoozeUntil, snoozeSaving, handleSnooze, showNextTicket, setShowNextTicket, nextTicketId, nextTicketInfo, handleNextTicket } = ta;
+  const replyEditorRef = useRef(null);
+  const rp = useReply(id, client, cannedResponses, ticketNumber, ticketSubject, fetchAll, handleNextTicket, replyEditorRef);
+  const { fileInputRef, replyBody, setReplyBody, replyHtml, setReplyHtml, replyFiles, setReplyFiles, isInternal, setIsInternal, notifyClient, setNotifyClient, sendAsClient, setSendAsClient, sending, showSchedule, setShowSchedule, scheduleDate, setScheduleDate, handleCannedSelect, handleReplyFileChange, handleSendReply, handleScheduleReply } = rp;
+  const ai = useAI(messages, client, ticketSubject, replyBody, setReplyBody, setReplyHtml, replyEditorRef);
+  const { clientSentiment, aiReplying, handleAiSuggestReply, aiRewriting, handleAiRewrite, showAiSummary, setShowAiSummary, aiSummary, aiGenerating, handleAiGenerate, aiSaving, aiSaved, handleAiSave: aiSaveRaw } = ai;
+  const handleAiSave = () => aiSaveRaw(id, fetchAll);
+  const [pollExpired, setPollExpired] = useState(false);
+  useEffect(() => {
+    if (!id || loading || pollExpired) return;
+    const poll = async () => {
+      try {
+        const [msgRes, ticketRes, activityRes] = await Promise.all([
+          fetch(`/api/ticket-messages?where[ticket][equals]=${id}&sort=createdAt&limit=200&depth=1`, { credentials: "include" }),
+          fetch(`/api/tickets/${id}?depth=0`, { credentials: "include" }),
+          fetch(`/api/ticket-activity-log?where[ticket][equals]=${id}&sort=-createdAt&limit=50&depth=0`, { credentials: "include" })
+        ]);
+        if (msgRes.status === 401 || msgRes.status === 403) {
+          setPollExpired(true);
+          return;
+        }
+        if (msgRes.ok) {
+          const d = await msgRes.json();
+          setMessages(d.docs || []);
+        }
+        if (ticketRes.ok) {
+          const d = await ticketRes.json();
+          setCurrentStatus(d.status || "");
+          setSnoozeUntil(d.snoozeUntil || null);
+          setLastClientReadAt(d.lastClientReadAt || null);
+        }
+        if (activityRes.ok) {
+          const d = await activityRes.json();
+          setActivityLog(d.docs || []);
+        }
+      } catch {
+      }
+    };
+    const interval = setInterval(poll, 15e3);
+    return () => clearInterval(interval);
+  }, [id, loading, pollExpired]);
+  useEffect(() => {
+    const handleKeyDown = (e) => {
+      if ((e.ctrlKey || e.metaKey) && e.key === "Enter" && !e.shiftKey) {
+        e.preventDefault();
+        const sendBtn = document.querySelector('[data-action="send-reply"]');
+        if (sendBtn && !sendBtn.disabled) sendBtn.click();
+      }
+      if ((e.ctrlKey || e.metaKey) && e.shiftKey && (e.key === "N" || e.key === "n")) {
+        e.preventDefault();
+        setIsInternal((prev) => !prev);
+      }
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
+  }, []);
+  const playNotificationSound = useCallback(() => {
+    try {
+      const ctx = new (window.AudioContext || window.webkitAudioContext)();
+      const osc = ctx.createOscillator();
+      const gain = ctx.createGain();
+      osc.connect(gain);
+      gain.connect(ctx.destination);
+      osc.frequency.value = 800;
+      osc.type = "sine";
+      gain.gain.value = 0.1;
+      osc.start();
+      gain.gain.exponentialRampToValueAtTime(1e-3, ctx.currentTime + 0.3);
+      osc.stop(ctx.currentTime + 0.3);
+    } catch {
+    }
+  }, []);
+  useEffect(() => {
+    const currentCount = messages.length;
+    if (prevMessageCountRef.current > 0 && currentCount > prevMessageCountRef.current) {
+      const lastMsg = messages[messages.length - 1];
+      if (lastMsg && lastMsg.authorType !== "admin") {
+        playNotificationSound();
+      }
+    }
+    prevMessageCountRef.current = currentCount;
+  }, [messages, playNotificationSound]);
+  const handleCopyLink = (type) => {
+    const url = type === "admin" ? `${window.location.origin}/admin/collections/tickets/${id}` : `${window.location.origin}/support/tickets/${id}`;
+    navigator.clipboard.writeText(url);
+    setCopiedLink(type);
+    setTimeout(() => setCopiedLink(null), 2e3);
+  };
+  if (!id) {
+    return /* @__PURE__ */ jsx("div", { style: { padding: "16px", color: "#666", fontStyle: "italic" }, children: "Enregistrez le ticket pour voir le tableau de bord." });
+  }
+  const totalMinutes = timeEntries.reduce((sum, e) => sum + (e.duration || 0), 0);
+  const statusTransitions = (() => {
+    switch (currentStatus) {
+      case "open":
+        return [
+          { status: "waiting_client", label: "Attente client", color: C.statusWaiting },
+          { status: "resolved", label: "R\xE9solu", color: C.statusResolved }
+        ];
+      case "waiting_client":
+        return [
+          { status: "open", label: "Ouvrir", color: C.statusOpen },
+          { status: "resolved", label: "R\xE9solu", color: C.statusResolved }
+        ];
+      case "resolved":
+        return [
+          { status: "open", label: "Rouvrir", color: C.statusOpen }
+        ];
+      default:
+        return [
+          { status: "open", label: "Ouvrir", color: C.statusOpen },
+          { status: "waiting_client", label: "Attente client", color: C.statusWaiting },
+          { status: "resolved", label: "R\xE9solu", color: C.statusResolved }
+        ];
+    }
+  })();
+  return /* @__PURE__ */ jsxs("div", { style: layoutStyles.root, children: [
+    /* @__PURE__ */ jsx(
+      TicketHeader,
+      {
+        ticketNumber,
+        currentStatus,
+        clientSentiment,
+        ticketSource,
+        chatSession,
+        snoozeUntil,
+        satisfaction,
+        copiedLink,
+        onCopyLink: handleCopyLink
+      }
+    ),
+    client && /* @__PURE__ */ jsx(ClientBar, { client }),
+    /* @__PURE__ */ jsxs("div", { style: layoutStyles.twoColumns, children: [
+      /* @__PURE__ */ jsxs("div", { style: layoutStyles.mainColumn, children: [
+        /* @__PURE__ */ jsxs("div", { style: { marginBottom: "4px", display: "flex", alignItems: "center", gap: "10px" }, children: [
+          /* @__PURE__ */ jsxs("h3", { style: { fontSize: "14px", fontWeight: 600, margin: 0, display: "flex", alignItems: "center", gap: "8px" }, children: [
+            "Conversation ",
+            /* @__PURE__ */ jsx("span", { style: s.badge("#f1f5f9", "#475569"), children: messages.length })
+          ] }),
+          /* @__PURE__ */ jsx("div", { style: { flex: 1 }, children: /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: "text",
+              value: searchQuery,
+              onChange: (e) => setSearchQuery(e.target.value),
+              placeholder: "Rechercher...",
+              style: { ...s.input, width: "100%", fontSize: "12px", padding: "6px 10px" }
+            }
+          ) })
+        ] }),
+        loading ? /* @__PURE__ */ jsx(SkeletonText, { lines: 4 }) : messages.length === 0 ? /* @__PURE__ */ jsx("p", { style: { color: "#999", fontStyle: "italic", padding: "12px 0" }, children: "Aucun message." }) : /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "10px", marginBottom: "16px", paddingRight: "4px" }, children: (() => {
+          const filtered = messages.filter((msg) => !searchQuery.trim() || msg.body.toLowerCase().includes(searchQuery.toLowerCase()));
+          const isSearching = searchQuery.trim().length > 0;
+          const VISIBLE_COUNT = 3;
+          const showCollapse = !isSearching && messagesCollapsed && filtered.length > VISIBLE_COUNT;
+          const visibleMessages = showCollapse ? filtered.slice(-VISIBLE_COUNT) : filtered;
+          const hiddenCount = filtered.length - VISIBLE_COUNT;
+          return /* @__PURE__ */ jsxs(Fragment, { children: [
+            showCollapse && hiddenCount > 0 && /* @__PURE__ */ jsxs(
+              "button",
+              {
+                onClick: () => setMessagesCollapsed(false),
+                style: {
+                  background: "none",
+                  border: `1px dashed ${C.border}`,
+                  borderRadius: "6px",
+                  padding: "8px",
+                  cursor: "pointer",
+                  color: C.textMuted,
+                  fontSize: "12px",
+                  fontWeight: 600,
+                  textAlign: "center"
+                },
+                children: [
+                  "Voir les ",
+                  hiddenCount,
+                  " message",
+                  hiddenCount > 1 ? "s" : "",
+                  " pr\xE9c\xE9dent",
+                  hiddenCount > 1 ? "s" : ""
+                ]
+              }
+            ),
+            !messagesCollapsed && filtered.length > 1 && !isSearching && /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: () => setMessagesCollapsed(true),
+                style: {
+                  background: "none",
+                  border: `1px dashed ${C.border}`,
+                  borderRadius: "6px",
+                  padding: "8px",
+                  cursor: "pointer",
+                  color: C.textMuted,
+                  fontSize: "12px",
+                  fontWeight: 600,
+                  textAlign: "center"
+                },
+                children: "Masquer les anciens messages"
+              }
+            ),
+            visibleMessages.map((msg, msgIdx) => {
+              const borderColor = msg.isInternal ? C.internalBorder : msg.fromChat ? "#bae6fd" : msg.authorType === "admin" ? "#bfdbfe" : msg.authorType === "email" ? "#fed7aa" : C.clientBorder;
+              const bgColor = msg.isInternal ? C.internalBg : msg.fromChat ? "#f0f9ff" : msg.authorType === "admin" ? C.adminBg : msg.authorType === "email" ? C.emailBg : C.clientBg;
+              const prevVisMsg = msgIdx > 0 ? visibleMessages[msgIdx - 1] : null;
+              const showDateSep = msg.createdAt && (!prevVisMsg?.createdAt || new Date(msg.createdAt).toDateString() !== new Date(prevVisMsg.createdAt).toDateString());
+              return /* @__PURE__ */ jsxs(React6.Fragment, { children: [
+                showDateSep && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "12px", padding: "4px 0" }, children: [
+                  /* @__PURE__ */ jsx("div", { style: { flex: 1, borderTop: `1px solid ${C.border}` } }),
+                  /* @__PURE__ */ jsx("span", { style: { fontSize: "11px", fontWeight: 600, color: C.textMuted, whiteSpace: "nowrap" }, children: getDateLabel(msg.createdAt) }),
+                  /* @__PURE__ */ jsx("div", { style: { flex: 1, borderTop: `1px solid ${C.border}` } })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", alignItems: "flex-start" }, children: [
+                  /* @__PURE__ */ jsx("div", { style: {
+                    flexShrink: 0,
+                    width: "28px",
+                    height: "28px",
+                    borderRadius: "50%",
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    fontSize: "10px",
+                    fontWeight: 700,
+                    color: "#fff",
+                    marginTop: "2px",
+                    backgroundColor: msg.authorType === "admin" ? C.blue : msg.authorType === "email" ? C.orange : "#94a3b8"
+                  }, children: msg.authorType === "admin" ? "CW" : client ? `${(client.firstName?.[0] || "").toUpperCase()}${(client.lastName?.[0] || "").toUpperCase()}` || "?" : "?" }),
+                  /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      style: {
+                        flex: 1,
+                        padding: "10px 14px",
+                        borderRadius: "8px",
+                        border: msg.isInternal ? `1px dashed ${C.internalBorder}` : `1px solid ${borderColor}`,
+                        backgroundColor: bgColor
+                      },
+                      children: [
+                        /* @__PURE__ */ jsxs("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: "4px", fontSize: "12px", alignItems: "center" }, children: [
+                          /* @__PURE__ */ jsxs("span", { style: { fontWeight: 600, display: "inline-flex", alignItems: "center", gap: "6px" }, children: [
+                            msg.authorType === "email" ? /* @__PURE__ */ jsx("span", { style: s.badge(C.emailBg, C.orange), children: "Email" }) : /* @__PURE__ */ jsxs(
+                              "select",
+                              {
+                                value: msg.authorType,
+                                onChange: (e) => handleToggleAuthor(msg.id, e.target.value === "admin" ? "client" : "admin"),
+                                disabled: togglingAuthor === msg.id,
+                                style: {
+                                  fontSize: "12px",
+                                  fontWeight: 600,
+                                  padding: "2px 6px",
+                                  borderRadius: "4px",
+                                  border: `1px solid ${C.border}`,
+                                  cursor: "pointer",
+                                  backgroundColor: msg.authorType === "admin" ? "#eff6ff" : "#f9fafb",
+                                  color: "#374151",
+                                  opacity: togglingAuthor === msg.id ? 0.5 : 1
+                                },
+                                children: [
+                                  /* @__PURE__ */ jsx("option", { value: "admin", children: "Support" }),
+                                  /* @__PURE__ */ jsx("option", { value: "client", children: "Client" })
+                                ]
+                              }
+                            ),
+                            msg.fromChat && /* @__PURE__ */ jsx("span", { style: s.badge("#e0f2fe", "#0284c7"), children: "Chat" }),
+                            msg.isInternal && /* @__PURE__ */ jsx("span", { style: s.badge("#fef3c7", "#92400e"), children: "Interne" }),
+                            msg.scheduledAt && (() => {
+                              const sched = msg;
+                              const scheduledDate = new Date(sched.scheduledAt).toLocaleString("fr-FR", { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" });
+                              const createdDate = new Date(msg.createdAt).toLocaleString("fr-FR", { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" });
+                              return sched.scheduledSent ? /* @__PURE__ */ jsxs("span", { style: s.badge("#f0fdf4", "#16a34a"), children: [
+                                "\u2713",
+                                " Programm\xE9 le ",
+                                createdDate,
+                                " \u2014 r\xE9dig\xE9 le ",
+                                scheduledDate !== createdDate ? scheduledDate : createdDate
+                              ] }) : /* @__PURE__ */ jsxs("span", { style: s.badge("#f3e8ff", "#7c3aed"), children: [
+                                "\u23F0",
+                                " R\xE9dig\xE9 le ",
+                                createdDate,
+                                " \u2014 envoi programm\xE9 le ",
+                                scheduledDate
+                              ] });
+                            })()
+                          ] }),
+                          /* @__PURE__ */ jsxs("span", { style: { color: C.textMuted, fontWeight: 500, fontSize: "11px", display: "inline-flex", alignItems: "center", gap: "6px" }, children: [
+                            formatMessageDate(msg.createdAt),
+                            msg.editedAt && /* @__PURE__ */ jsx("span", { style: { fontSize: "10px", color: "#6b7280", fontStyle: "italic" }, children: "(modifi\xE9)" }),
+                            !msg.isInternal && !msg.deletedAt && /* @__PURE__ */ jsxs(
+                              "button",
+                              {
+                                onClick: () => handleSplitMessage(msg.id, ticketSubject),
+                                style: { background: "none", border: "none", cursor: "pointer", fontSize: "10px", color: "#6b7280", padding: 0 },
+                                title: "Extraire en nouveau ticket",
+                                children: [
+                                  "\u2197",
+                                  " Extraire"
+                                ]
+                              }
+                            ),
+                            msg.authorType === "admin" && !msg.isInternal && (() => {
+                              const msgExt = msg;
+                              const isRead = lastClientReadAt && msg.createdAt && new Date(msg.createdAt) < new Date(lastClientReadAt);
+                              const sentAt = msgExt.emailSentAt;
+                              const openedAt = msgExt.emailOpenedAt;
+                              const sentTo = msgExt.emailSentTo;
+                              if (openedAt) {
+                                const openDate = new Date(openedAt).toLocaleString("fr-FR", { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit", timeZone: "Europe/Paris" });
+                                return /* @__PURE__ */ jsxs("span", { title: `Envoy\xE9 \xE0 ${sentTo || "?"} \u2014 Ouvert le ${openDate}`, style: { fontSize: "10px", color: "#16a34a", fontWeight: 600, cursor: "help" }, children: [
+                                  "\u2709 Ouvert ",
+                                  openDate
+                                ] });
+                              }
+                              if (sentAt) {
+                                const sentDate = new Date(sentAt).toLocaleString("fr-FR", { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit", timeZone: "Europe/Paris" });
+                                return /* @__PURE__ */ jsxs("span", { title: `Envoy\xE9 \xE0 ${sentTo || "?"} le ${sentDate}`, style: { fontSize: "10px", color: "#2563eb", fontWeight: 600, cursor: "help" }, children: [
+                                  "\u2709 Envoy\xE9 \xE0 ",
+                                  sentTo,
+                                  " \u2014 ",
+                                  sentDate
+                                ] });
+                              }
+                              return /* @__PURE__ */ jsx("span", { style: { fontSize: "10px", color: isRead ? "#16a34a" : "#94a3b8", fontWeight: 600 }, children: isRead ? "\u2713\u2713 Lu" : "\u2713 Envoy\xE9" });
+                            })()
+                          ] })
+                        ] }),
+                        editingMsg === msg.id ? /* @__PURE__ */ jsxs("div", { style: { marginTop: "6px" }, children: [
+                          /* @__PURE__ */ jsx(
+                            "textarea",
+                            {
+                              value: editBody,
+                              onChange: (e) => {
+                                setEditBody(e.target.value);
+                                setEditHtml(e.target.value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/\n/g, "<br />"));
+                              },
+                              rows: 4,
+                              style: { ...s.input, width: "100%", resize: "vertical", fontSize: "13px" }
+                            }
+                          ),
+                          /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", marginTop: "8px" }, children: [
+                            /* @__PURE__ */ jsx("button", { onClick: () => handleEditSave(msg.id), disabled: savingEdit || !editBody.trim() && !editHtml, style: { ...s.btn(C.blue, savingEdit), fontSize: "11px", padding: "5px 12px" }, children: savingEdit ? "..." : "Enregistrer" }),
+                            /* @__PURE__ */ jsx("button", { onClick: handleEditCancel, style: { ...s.ghostBtn("#6b7280"), fontSize: "11px", padding: "5px 12px" }, children: "Annuler" })
+                          ] })
+                        ] }) : msg.deletedAt ? /* @__PURE__ */ jsx("div", { style: { fontSize: "13px", color: "#94a3b8", fontStyle: "italic" }, children: "Ce message a \xE9t\xE9 supprim\xE9." }) : msg.bodyHtml ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                          /* @__PURE__ */ jsx(
+                            "div",
+                            {
+                              className: "rte-display",
+                              style: { fontSize: "13px", color: "#374151", lineHeight: 1.5 },
+                              dangerouslySetInnerHTML: { __html: msg.bodyHtml }
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(CodeBlockRendererHtml, { html: msg.bodyHtml })
+                        ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                          /* @__PURE__ */ jsx("div", { style: { whiteSpace: "pre-wrap", fontSize: "13px", color: "#374151", lineHeight: 1.5 }, children: searchQuery.trim() ? msg.body.split(new RegExp(`(${searchQuery.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")})`, "gi")).map(
+                            (part, i) => part.toLowerCase() === searchQuery.toLowerCase() ? /* @__PURE__ */ jsx("mark", { style: { backgroundColor: "#fde68a", borderRadius: "2px", padding: "0 2px", fontWeight: 600 }, children: part }, i) : part
+                          ) : msg.body }),
+                          /* @__PURE__ */ jsx(CodeBlockRenderer, { text: msg.body })
+                        ] }),
+                        Array.isArray(msg.attachments) && msg.attachments.length > 0 && /* @__PURE__ */ jsx("div", { style: { marginTop: "8px", display: "flex", gap: "8px", flexWrap: "wrap" }, children: msg.attachments.map((att, i) => {
+                          const file = typeof att.file === "object" ? att.file : null;
+                          if (!file) return null;
+                          const mime = (file.mimeType || file.filename || "").toLowerCase();
+                          const isImage = mime.includes("image/") || /\.(png|jpg|jpeg|webp|gif|svg)$/i.test(file.filename || "");
+                          const isGif = mime.includes("image/gif") || /\.gif$/i.test(file.filename || "");
+                          const isVideo = mime.includes("video/") || /\.(mp4|webm|mov|avi)$/i.test(file.filename || "");
+                          if (isImage) {
+                            return /* @__PURE__ */ jsx("a", { href: file.url || "#", target: "_blank", rel: "noopener noreferrer", style: { display: "block" }, children: /* @__PURE__ */ jsx(
+                              "img",
+                              {
+                                src: file.url || "",
+                                alt: file.filename || "Image",
+                                style: {
+                                  maxWidth: isGif ? 300 : 240,
+                                  maxHeight: 200,
+                                  borderRadius: "6px",
+                                  border: `1px solid ${C.border}`,
+                                  objectFit: "cover",
+                                  cursor: "pointer"
+                                }
+                              }
+                            ) }, i);
+                          }
+                          if (isVideo) {
+                            return /* @__PURE__ */ jsx(
+                              "video",
+                              {
+                                src: file.url || "",
+                                controls: true,
+                                preload: "metadata",
+                                style: {
+                                  maxWidth: 360,
+                                  maxHeight: 240,
+                                  borderRadius: "6px",
+                                  border: `1px solid ${C.border}`,
+                                  backgroundColor: "#000"
+                                }
+                              },
+                              i
+                            );
+                          }
+                          return /* @__PURE__ */ jsxs(
+                            "a",
+                            {
+                              href: file.url || "#",
+                              target: "_blank",
+                              rel: "noopener noreferrer",
+                              style: {
+                                display: "inline-flex",
+                                alignItems: "center",
+                                gap: "4px",
+                                padding: "4px 10px",
+                                borderRadius: "4px",
+                                border: `1px solid ${C.border}`,
+                                fontSize: "11px",
+                                fontWeight: 600,
+                                color: "#374151",
+                                textDecoration: "none",
+                                backgroundColor: C.white
+                              },
+                              children: [
+                                "\u{1F4CE}",
+                                " ",
+                                file.filename || "Fichier"
+                              ]
+                            },
+                            i
+                          );
+                        }) }),
+                        editingMsg !== msg.id && !msg.fromChat && /* @__PURE__ */ jsxs("div", { style: { marginTop: "6px", display: "flex", gap: "12px", alignItems: "center" }, children: [
+                          /* @__PURE__ */ jsx(
+                            "button",
+                            {
+                              type: "button",
+                              onClick: () => handleEditStart(msg),
+                              style: { border: "none", background: "none", cursor: "pointer", fontSize: "11px", color: C.textSecondary, padding: 0, fontWeight: 600, textDecoration: "underline" },
+                              children: "Modifier"
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(
+                            "button",
+                            {
+                              type: "button",
+                              onClick: () => handleDelete(msg.id),
+                              disabled: deletingMsg === msg.id,
+                              style: { border: "none", background: "none", cursor: "pointer", fontSize: "11px", color: "#ef4444", padding: 0, fontWeight: 600, textDecoration: "underline", opacity: deletingMsg === msg.id ? 0.3 : 1 },
+                              children: "Supprimer"
+                            }
+                          ),
+                          msg.authorType === "admin" && !msg.isInternal && /* @__PURE__ */ jsx(
+                            "button",
+                            {
+                              type: "button",
+                              onClick: () => handleResend(msg.id),
+                              disabled: resendingMsg === msg.id,
+                              style: { border: "none", background: "none", cursor: "pointer", fontSize: "11px", color: "#2563eb", padding: 0, fontWeight: 600, textDecoration: "underline", opacity: resendingMsg === msg.id ? 0.3 : 1 },
+                              children: resendingMsg === msg.id ? "Envoi..." : resendSuccess === msg.id ? "Envoy\xE9 !" : "Renvoyer email"
+                            }
+                          )
+                        ] })
+                      ]
+                    }
+                  )
+                ] })
+              ] }, msg.id);
+            })
+          ] });
+        })() }),
+        clientTyping && /* @__PURE__ */ jsxs("div", { style: {
+          display: "flex",
+          alignItems: "center",
+          gap: 8,
+          padding: "8px 12px",
+          fontSize: 12,
+          color: "#7c3aed",
+          fontWeight: 500
+        }, children: [
+          /* @__PURE__ */ jsxs("span", { style: { display: "flex", gap: 2 }, children: [
+            /* @__PURE__ */ jsx("span", { style: { width: 5, height: 5, borderRadius: "50%", backgroundColor: "#7c3aed", animation: "bounce 1s infinite", animationDelay: "0ms" } }),
+            /* @__PURE__ */ jsx("span", { style: { width: 5, height: 5, borderRadius: "50%", backgroundColor: "#7c3aed", animation: "bounce 1s infinite", animationDelay: "150ms" } }),
+            /* @__PURE__ */ jsx("span", { style: { width: 5, height: 5, borderRadius: "50%", backgroundColor: "#7c3aed", animation: "bounce 1s infinite", animationDelay: "300ms" } })
+          ] }),
+          clientTypingName || "Client",
+          " est en train d'\xE9crire..."
+        ] }),
+        /* @__PURE__ */ jsxs("div", { style: { marginBottom: "16px" }, children: [
+          /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "6px", alignItems: "center", overflowX: "auto", paddingBottom: "8px", marginBottom: "6px", flexWrap: "wrap" }, children: [
+            [
+              "Bien re\xE7u, je regarde \xE7a !",
+              "C'est corrig\xE9 !",
+              "Pouvez-vous pr\xE9ciser ?",
+              "Je reviens vers vous rapidement",
+              "Pouvez-vous m'envoyer une capture d'\xE9cran ?"
+            ].map((text) => /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  setReplyBody(text);
+                  const html = text.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+                  setReplyHtml(html);
+                  if (replyEditorRef.current?.setContent) {
+                    replyEditorRef.current.setContent(html);
+                  }
+                },
+                onMouseEnter: (e) => {
+                  e.currentTarget.style.backgroundColor = "#f1f5f9";
+                },
+                onMouseLeave: (e) => {
+                  e.currentTarget.style.backgroundColor = "white";
+                },
+                style: {
+                  padding: "3px 10px",
+                  borderRadius: "14px",
+                  border: `1px solid ${C.border}`,
+                  backgroundColor: "white",
+                  fontSize: "11px",
+                  fontWeight: 500,
+                  color: "#475569",
+                  cursor: "pointer",
+                  whiteSpace: "nowrap"
+                },
+                children: text
+              },
+              text
+            )),
+            features.ai && /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: handleAiSuggestReply,
+                disabled: aiReplying || messages.length === 0,
+                style: { ...s.outlineBtn("#7c3aed", aiReplying || messages.length === 0), fontSize: "11px", padding: "3px 10px", borderRadius: "14px" },
+                children: aiReplying ? "G\xE9n\xE9ration..." : "Suggestion IA"
+              }
+            ),
+            features.ai && /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: handleAiRewrite,
+                disabled: aiRewriting || !replyBody.trim(),
+                style: { ...s.outlineBtn("#0891b2", aiRewriting || !replyBody.trim()), fontSize: "11px", padding: "3px 10px", borderRadius: "14px" },
+                children: aiRewriting ? "Reformulation..." : "Reformuler"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              CodeBlockInserter,
+              {
+                style: { ...s.outlineBtn("#059669", false), fontSize: "11px", padding: "3px 10px", borderRadius: "14px" },
+                onInsert: (block) => {
+                  const nb = replyBody ? replyBody + block : block;
+                  setReplyBody(nb);
+                  setReplyHtml(nb.replace(/\n/g, "<br/>"));
+                  replyEditorRef.current?.setContent(nb.replace(/\n/g, "<br/>"));
+                }
+              }
+            ),
+            features.canned && cannedResponses.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsxs("select", { onChange: handleCannedSelect, style: { ...s.input, fontSize: "11px", padding: "3px 8px", fontWeight: 600 }, children: [
+                /* @__PURE__ */ jsx("option", { value: "", children: "R\xE9ponse rapide..." }),
+                cannedResponses.map((cr) => /* @__PURE__ */ jsx("option", { value: String(cr.id), children: cr.title }, cr.id))
+              ] }),
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  title: "Variables disponibles : {{client.firstName}}, {{client.lastName}}, {{client.company}}, {{client.email}}, {{ticket.number}}, {{ticket.subject}}, {{agent.name}}",
+                  style: { cursor: "help", fontSize: "13px", color: C.textMuted },
+                  children: "\u24D8"
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx("div", { style: { border: `1px solid ${C.border}`, borderRadius: "8px", overflow: "hidden" }, children: /* @__PURE__ */ jsx(
+            "textarea",
+            {
+              value: replyBody,
+              onChange: (e) => {
+                const text = e.target.value;
+                setReplyBody(text);
+                setReplyHtml(text.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/\n/g, "<br />"));
+                sendAdminTyping();
+              },
+              placeholder: "\xC9crire une r\xE9ponse au client...",
+              style: {
+                width: "100%",
+                minHeight: "120px",
+                padding: "12px",
+                border: "none",
+                outline: "none",
+                fontSize: "14px",
+                lineHeight: 1.5,
+                resize: "vertical",
+                fontFamily: "inherit",
+                color: "#374151",
+                backgroundColor: "transparent",
+                boxSizing: "border-box"
+              }
+            }
+          ) }),
+          /* @__PURE__ */ jsxs("div", { style: { marginTop: "8px", display: "flex", gap: "8px", alignItems: "center", flexWrap: "wrap" }, children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                ref: fileInputRef,
+                type: "file",
+                multiple: true,
+                onChange: handleReplyFileChange,
+                style: { display: "none" },
+                accept: "image/*,.pdf,.doc,.docx,.txt,.zip"
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => fileInputRef.current?.click(),
+                style: { ...s.ghostBtn("#6b7280"), fontSize: "12px", padding: "5px 10px" },
+                children: "+ Pi\xE8ce jointe"
+              }
+            ),
+            replyFiles.length > 0 && /* @__PURE__ */ jsx(Fragment, { children: replyFiles.map((file, i) => /* @__PURE__ */ jsxs("span", { style: { ...s.badge("#f1f5f9", "#374151"), display: "inline-flex", alignItems: "center", gap: "4px" }, children: [
+              "\u{1F4CE}",
+              " ",
+              file.name,
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => setReplyFiles((prev) => prev.filter((_, idx) => idx !== i)),
+                  style: { border: "none", background: "none", color: "#ef4444", fontWeight: 700, cursor: "pointer", fontSize: "14px", lineHeight: 1 },
+                  children: "\xD7"
+                }
+              )
+            ] }, i)) })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "10px", flexWrap: "wrap", marginTop: "8px" }, children: [
+            /* @__PURE__ */ jsxs(
+              "select",
+              {
+                value: sendAsClient ? "client" : "admin",
+                onChange: (e) => setSendAsClient(e.target.value === "client"),
+                style: { ...s.input, fontSize: "12px", padding: "6px 8px", fontWeight: 600 },
+                children: [
+                  /* @__PURE__ */ jsx("option", { value: "admin", children: "En tant que : Support" }),
+                  /* @__PURE__ */ jsx("option", { value: "client", children: "En tant que : Client" })
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs("label", { style: { display: "flex", alignItems: "center", gap: "5px", fontSize: "12px", cursor: "pointer", fontWeight: 600 }, children: [
+              /* @__PURE__ */ jsx("input", { type: "checkbox", checked: isInternal, onChange: (e) => {
+                setIsInternal(e.target.checked);
+                if (e.target.checked) setNotifyClient(false);
+              }, style: { width: "14px", height: "14px", accentColor: C.amber } }),
+              "Note interne"
+            ] }),
+            !isInternal && /* @__PURE__ */ jsxs("label", { style: { display: "flex", alignItems: "center", gap: "5px", fontSize: "12px", cursor: "pointer", fontWeight: 600 }, children: [
+              /* @__PURE__ */ jsx("input", { type: "checkbox", checked: notifyClient, onChange: (e) => setNotifyClient(e.target.checked), style: { width: "14px", height: "14px", accentColor: "#16a34a" } }),
+              "Envoyer au client"
+            ] }),
+            /* @__PURE__ */ jsx("button", { "data-action": "send-reply", onClick: handleSendReply, disabled: sending || !replyBody.trim() && !replyHtml, style: { ...s.btn(isInternal ? C.amber : notifyClient ? "#16a34a" : C.blue, sending || !replyBody.trim() && !replyHtml), fontSize: "13px", padding: "8px 20px", marginLeft: "auto" }, children: sending ? "Envoi..." : isInternal ? "Ajouter note" : notifyClient ? "Envoyer + Notifier" : "Sauvegarder" }),
+            !isInternal && /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: () => setShowSchedule(!showSchedule),
+                disabled: !replyBody.trim() && !replyHtml,
+                style: { ...s.outlineBtn("#7c3aed", !replyBody.trim() && !replyHtml), fontSize: "12px", padding: "8px 12px" },
+                title: "Programmer l'envoi \xE0 une date/heure pr\xE9cise",
+                children: "\u23F0"
+              }
+            )
+          ] }),
+          showSchedule && /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "8px", alignItems: "center", marginTop: "8px", padding: "10px 14px", borderRadius: "8px", backgroundColor: "#faf5ff", border: "1px solid #e9d5ff" }, children: [
+            /* @__PURE__ */ jsx("span", { style: { fontSize: "12px", fontWeight: 600, color: "#7c3aed" }, children: "Programmer pour :" }),
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                type: "datetime-local",
+                value: scheduleDate,
+                onChange: (e) => setScheduleDate(e.target.value),
+                min: (/* @__PURE__ */ new Date()).toISOString().slice(0, 16),
+                style: { ...s.input, fontSize: "12px", width: "auto" }
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: handleScheduleReply,
+                disabled: sending || !scheduleDate || !replyBody.trim() && !replyHtml,
+                style: { ...s.btn("#7c3aed", sending || !scheduleDate || !replyBody.trim() && !replyHtml), fontSize: "12px", padding: "6px 14px" },
+                children: sending ? "..." : "\u23F0 Programmer"
+              }
+            ),
+            /* @__PURE__ */ jsx("button", { onClick: () => setShowSchedule(false), style: { background: "none", border: "none", cursor: "pointer", color: "#94a3b8", fontSize: "14px" }, children: "\u2715" })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { style: { fontSize: "11px", color: C.textMuted, marginTop: "4px", textAlign: "right" }, children: [
+            "\u2318",
+            "Enter pour envoyer \xB7 ",
+            "\u2318",
+            "\u21E7",
+            "N note interne"
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("div", { style: { borderTop: `1px solid ${C.border}`, marginBottom: "16px" } }),
+        /* @__PURE__ */ jsx(
+          QuickActions,
+          {
+            statusTransitions,
+            statusUpdating,
+            onStatusChange: handleStatusChange,
+            snoozeUntil,
+            snoozeSaving,
+            onCancelSnooze: () => handleSnooze(null),
+            showMerge,
+            showExtMsg,
+            showSnooze,
+            onToggleMerge: () => {
+              setShowMerge(!showMerge);
+              setShowExtMsg(false);
+              setShowSnooze(false);
+            },
+            onToggleExtMsg: () => {
+              setShowExtMsg(!showExtMsg);
+              setShowMerge(false);
+              setShowSnooze(false);
+            },
+            onToggleSnooze: () => {
+              setShowSnooze(!showSnooze);
+              setShowMerge(false);
+              setShowExtMsg(false);
+            },
+            onNextTicket: handleNextTicket,
+            showNextTicket,
+            nextTicketId,
+            nextTicketInfo,
+            onCloseNextTicket: () => setShowNextTicket(false)
+          }
+        ),
+        features.ai && /* @__PURE__ */ jsx(
+          AISummaryPanel,
+          {
+            showAiSummary,
+            setShowAiSummary,
+            aiSummary,
+            aiGenerating,
+            aiSaving,
+            aiSaved,
+            handleAiGenerate,
+            handleAiSave
+          }
+        ),
+        features.merge && showMerge && /* @__PURE__ */ jsx(
+          MergePanel,
+          {
+            mergeTarget,
+            setMergeTarget,
+            mergeTargetInfo,
+            setMergeTargetInfo,
+            mergeError,
+            setMergeError,
+            merging,
+            handleMergeLookup,
+            handleMerge
+          }
+        ),
+        features.externalMessages && showExtMsg && /* @__PURE__ */ jsx(
+          ExtMessagePanel,
+          {
+            extMsgBody,
+            setExtMsgBody,
+            extMsgAuthor,
+            setExtMsgAuthor,
+            extMsgDate,
+            setExtMsgDate,
+            extMsgFiles,
+            setExtMsgFiles,
+            sendingExtMsg,
+            handleSendExtMsg,
+            handleExtFileChange
+          }
+        ),
+        features.snooze && showSnooze && /* @__PURE__ */ jsx(SnoozePanel, { snoozeSaving, handleSnooze })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { style: layoutStyles.sideColumn, children: [
+        /* @__PURE__ */ jsx(
+          TimeTrackingPanel,
+          {
+            timeEntries,
+            totalMinutes,
+            timerRunning,
+            timerSeconds,
+            setTimerSeconds,
+            timerDescription,
+            setTimerDescription,
+            handleTimerStart,
+            handleTimerStop,
+            handleTimerSave,
+            handleTimerDiscard,
+            duration,
+            setDuration,
+            timeDescription,
+            setTimeDescription,
+            handleAddTime,
+            addingTime,
+            timeSuccess
+          }
+        ),
+        features.clientHistory && client && /* @__PURE__ */ jsx(
+          ClientHistory,
+          {
+            client,
+            clientTickets,
+            clientProjects,
+            clientNotes,
+            onNotesChange: (v) => {
+              setClientNotes(v);
+              setNotesSaved(false);
+            },
+            onNotesSave: async () => {
+              if (!client) return;
+              setSavingNotes(true);
+              try {
+                const res = await fetch(`/api/support-clients/${client.id}`, {
+                  method: "PATCH",
+                  headers: { "Content-Type": "application/json" },
+                  credentials: "include",
+                  body: JSON.stringify({ notes: clientNotes })
+                });
+                if (res.ok) {
+                  setNotesSaved(true);
+                  setTimeout(() => setNotesSaved(false), 3e3);
+                }
+              } catch {
+              } finally {
+                setSavingNotes(false);
+              }
+            },
+            savingNotes,
+            notesSaved
+          }
+        ),
+        features.activityLog && /* @__PURE__ */ jsx(ActivityLog, { activityLog }),
+        /* @__PURE__ */ jsx("div", { style: s.section, children: /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: "/api/support/export-csv",
+            target: "_blank",
+            rel: "noopener noreferrer",
+            style: { ...s.ghostBtn("#6b7280"), fontSize: "12px", textDecoration: "none", display: "inline-block" },
+            children: "Exporter tous les tickets (CSV)"
+          }
+        ) })
+      ] })
+    ] })
+  ] });
+};
+var TicketConversation_default = TicketConversation;
+
+export { TicketConversation_default as default };