@consilioweb/payload-support 0.15.0 → 1.0.0

package/src/endpoints/transfer-ticket.ts

@@ -3,6 +3,8 @@ import type { CollectionSlugs } from '../utils/slugs'
 import { handleAuthError, AuthError } from '../utils/auth'
 import { escapeHtml, emailWrapper, emailButton, emailParagraph } from '../utils/emailTemplate'
 import { readSupportSettings } from '../utils/readSettings'
+import { RateLimiter } from '../utils/rateLimiter'
+import { dbFindByID, dbFind, dbCreate, dbCount } from '../utils/db'
 
 // Simple RFC-5322 style sanity check — same level of strictness as the
 // portal forms used elsewhere in the plugin. Server-side validation only;
@@ -11,6 +13,11 @@ const EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/
 
 const MAX_TRANSFERS_PER_DAY = 5
 
+// In-memory fail-closed rate limiter — enforced even when the persistent
+// emailLogs-based check is unavailable (collection disabled). Prevents the
+// endpoint from becoming an unbounded outbound mailer.
+const transferLimiter = new RateLimiter(24 * 60 * 60 * 1000, MAX_TRANSFERS_PER_DAY)
+
 /**
  * POST /api/support/tickets/:id/transfer
  *
@@ -56,12 +63,11 @@ export function createTransferTicketEndpoint(slugs: CollectionSlugs): Endpoint {
         const payload = req.payload
 
         // Load ticket (ownership check happens here too)
-        const ticket = await payload.findByID({
-          collection: slugs.tickets as any,
+        const ticket = await dbFindByID(payload, slugs.tickets, {
           id: ticketId,
           depth: 1,
           overrideAccess: true,
-        }) as any
+        })
         if (!ticket) return Response.json({ error: 'Ticket introuvable' }, { status: 404 })
 
         const isAdmin = req.user.collection === slugs.users
@@ -74,11 +80,19 @@ export function createTransferTicketEndpoint(slugs: CollectionSlugs): Endpoint {
           return Response.json({ error: 'Forbidden' }, { status: 403 })
         }
 
+        // Fail-closed in-memory rate limit (per user + ticket): enforced even
+        // when the persistent emailLogs check below cannot run.
+        if (transferLimiter.check(`${req.user.id}:${ticketId}`)) {
+          return Response.json(
+            { error: `Limite atteinte (${MAX_TRANSFERS_PER_DAY} transferts par 24h sur ce ticket)` },
+            { status: 429 },
+          )
+        }
+
         // Rate limit: count transfers in last 24h for this ticket
         try {
           const since = new Date(Date.now() - 24 * 60 * 60 * 1000).toISOString()
-          const existing = await payload.count({
-            collection: slugs.emailLogs as any,
+          const existing = await dbCount(payload, slugs.emailLogs, {
             where: {
               and: [
                 { action: { equals: 'transfer' } },
@@ -99,8 +113,7 @@ export function createTransferTicketEndpoint(slugs: CollectionSlugs): Endpoint {
         }
 
         // Fetch non-internal messages, ordered chronologically
-        const messages = await payload.find({
-          collection: slugs.ticketMessages as any,
+        const messages = await dbFind(payload, slugs.ticketMessages, {
           where: {
             and: [
               { ticket: { equals: ticketId } },
@@ -206,8 +219,7 @@ export function createTransferTicketEndpoint(slugs: CollectionSlugs): Endpoint {
 
         // Log the transfer (best-effort)
         try {
-          await payload.create({
-            collection: slugs.emailLogs as any,
+          await dbCreate(payload, slugs.emailLogs, {
             data: {
               status: 'success',
               action: 'transfer',

package/src/endpoints/user-prefs.ts

@@ -1,6 +1,7 @@
 import type { Endpoint } from 'payload'
 import type { CollectionSlugs } from '../utils/slugs'
 import { requireAdmin, handleAuthError } from '../utils/auth'
+import { dbFind } from '../utils/db'
 
 const PREF_KEY_PREFIX = 'support-user-prefs'
 
@@ -29,8 +30,7 @@ export function createUserPrefsGetEndpoint(slugs: CollectionSlugs): Endpoint {
 
         const key = `${PREF_KEY_PREFIX}-${req.user!.id}`
 
-        const prefs = await payload.find({
-          collection: 'payload-preferences' as any,
+        const prefs = await dbFind(payload, 'payload-preferences', {
           where: { key: { equals: key } },
           limit: 1,
           depth: 0,
@@ -74,8 +74,7 @@ export function createUserPrefsPostEndpoint(slugs: CollectionSlugs): Endpoint {
         const key = `${PREF_KEY_PREFIX}-${req.user!.id}`
 
         // Read existing prefs to merge
-        const existing = await payload.find({
-          collection: 'payload-preferences' as any,
+        const existing = await dbFind(payload, 'payload-preferences', {
           where: { key: { equals: key } },
           limit: 1,
           depth: 0,

package/src/hooks/automationRules.ts

@@ -0,0 +1,84 @@
+import type { CollectionAfterChangeHook } from 'payload'
+import type { CollectionSlugs } from '../utils/slugs'
+import { dbFind } from '../utils/db'
+
+interface Condition { field?: string; operator?: string; value?: string }
+interface Action { type?: string; value?: string }
+interface Rule { matchType?: string; conditions?: Condition[]; actions?: Action[] }
+
+function evaluateConditions(doc: Record<string, unknown>, rule: Rule): boolean {
+  const conds = Array.isArray(rule.conditions) ? rule.conditions : []
+  if (conds.length === 0) return true
+  const results = conds.map((c) => {
+    const fieldVal = String(doc[c.field as string] ?? '')
+    const v = String(c.value ?? '')
+    switch (c.operator) {
+      case 'equals': return fieldVal === v
+      case 'not_equals': return fieldVal !== v
+      case 'contains': return fieldVal.toLowerCase().includes(v.toLowerCase())
+      default: return false
+    }
+  })
+  return rule.matchType === 'any' ? results.some(Boolean) : results.every(Boolean)
+}
+
+/**
+ * Evaluate enabled automation rules against a ticket and apply their actions.
+ * Runs as afterChange on the Tickets collection. All matched actions are applied
+ * in a SINGLE update flagged `skipAutomation` to avoid re-triggering (no loop).
+ */
+export function createApplyAutomationRules(slugs: CollectionSlugs): CollectionAfterChangeHook {
+  return async ({ doc, previousDoc, operation, req }) => {
+    if (req.context?.skipAutomation) return doc
+
+    const events: string[] = []
+    if (operation === 'create') events.push('ticket_created')
+    if (operation === 'update') {
+      events.push('ticket_updated')
+      if (previousDoc && previousDoc.status !== doc.status) events.push('ticket_status_changed')
+    }
+    if (events.length === 0) return doc
+
+    try {
+      const rules = await dbFind<Rule & { actions?: Action[] }>(req.payload, slugs.automationRules, {
+        where: { and: [{ enabled: { equals: true } }, { event: { in: events } }] },
+        sort: 'order',
+        limit: 200,
+        depth: 0,
+        overrideAccess: true,
+      })
+
+      const changes: Record<string, unknown> = {}
+      const tags: string[] = Array.isArray(doc.tags) ? [...(doc.tags as string[])] : []
+      let tagsTouched = false
+
+      for (const rule of rules.docs) {
+        if (!evaluateConditions(doc as Record<string, unknown>, rule)) continue
+        for (const a of Array.isArray(rule.actions) ? rule.actions : []) {
+          if (!a.value) continue
+          switch (a.type) {
+            case 'set_status': changes.status = a.value; break
+            case 'set_priority': changes.priority = a.value; break
+            case 'set_category': changes.category = a.value; break
+            case 'assign': changes.assignedTo = a.value; break
+            case 'add_tag': if (!tags.includes(a.value)) { tags.push(a.value); tagsTouched = true } break
+          }
+        }
+      }
+
+      if (tagsTouched) changes.tags = tags
+      if (Object.keys(changes).length > 0) {
+        await req.payload.update({
+          collection: slugs.tickets,
+          id: doc.id,
+          data: changes,
+          overrideAccess: true,
+          context: { skipAutomation: true },
+        })
+      }
+    } catch (err) {
+      console.error('[support] Failed to apply automation rules:', err)
+    }
+    return doc
+  }
+}

package/src/hooks/checkSLA.ts

@@ -3,6 +3,7 @@ import type { CollectionSlugs } from '../utils/slugs'
 import { createAdminNotification } from '../utils/adminNotification'
 import { emailWrapper, emailButton, emailParagraph } from '../utils/emailTemplate'
 import { readSupportSettings } from '../utils/readSettings'
+import { dbFindByID, dbFind, dbUpdate } from '../utils/db'
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 type AnyDoc = any
@@ -145,8 +146,7 @@ async function resolveSlaPolicy(
         if (typeof policyRef === 'object' && (policyRef as AnyDoc).firstResponseTime) {
           return policyRef
         }
-        return await payload.findByID({
-          collection: slugs.slaPolicies as any,
+        return await dbFindByID(payload, slugs.slaPolicies, {
           id: policyId as number,
           depth: 0,
           overrideAccess: true,
@@ -160,8 +160,7 @@ async function resolveSlaPolicy(
   // Look for a default policy matching this ticket's priority
   const priority = field(ticket, 'priority') || 'normal'
   try {
-    const defaults = await payload.find({
-      collection: slugs.slaPolicies as any,
+    const defaults = await dbFind(payload, slugs.slaPolicies, {
       where: {
         and: [
           { isDefault: { equals: true } },
@@ -218,8 +217,7 @@ async function handleSlaBreach(
     if (typeof policyRef === 'object' && (policyRef as AnyDoc).escalateOnBreach !== undefined) {
       policy = policyRef
     } else {
-      policy = await payload.findByID({
-        collection: slugs.slaPolicies as any,
+      policy = await dbFindByID(payload, slugs.slaPolicies, {
         id: policyId as number,
         depth: 0,
         overrideAccess: true,
@@ -240,8 +238,7 @@ async function handleSlaBreach(
 
     const escalateUser = typeof policy.escalateTo === 'object' && (policy.escalateTo as AnyDoc).email
       ? policy.escalateTo
-      : await payload.findByID({
-          collection: slugs.users as any,
+      : await dbFindByID(payload, slugs.users, {
           id: escalateToId as number,
           depth: 0,
           overrideAccess: true,
@@ -312,8 +309,7 @@ export function createAssignSlaDeadlines(slugs: CollectionSlugs, notificationSlu
         updateData.slaPolicy = policy.id
       }
 
-      await payload.update({
-        collection: slugs.tickets as any,
+      await dbUpdate(payload, slugs.tickets, {
         id: doc.id,
         data: updateData,
         overrideAccess: true,
@@ -346,8 +342,7 @@ export function createCheckSlaOnResolve(slugs: CollectionSlugs, notificationSlug
       const deadline = new Date(doc.slaResolutionDue as string)
       const breached = now > deadline
 
-      await payload.update({
-        collection: slugs.tickets as any,
+      await dbUpdate(payload, slugs.tickets, {
         id: doc.id,
         data: { slaResolutionBreached: breached },
         overrideAccess: true,
@@ -364,6 +359,45 @@ export function createCheckSlaOnResolve(slugs: CollectionSlugs, notificationSlug
   }
 }
 
+/**
+ * SLA pause-on-hold: time spent in `waiting_client` should not count against the
+ * resolution SLA (the agent is waiting on the customer). Entering hold stamps
+ * `slaPausedAt`; leaving it pushes `slaResolutionDue` forward by the paused span.
+ */
+export function createPauseSlaOnHold(slugs: CollectionSlugs): CollectionAfterChangeHook {
+  return async ({ doc, previousDoc, operation, req }) => {
+    if (operation !== 'update' || !previousDoc) return doc
+    if (previousDoc.status === doc.status) return doc
+    if (!doc.slaResolutionDue) return doc
+
+    const wasWaiting = previousDoc.status === 'waiting_client'
+    const isWaiting = doc.status === 'waiting_client'
+
+    try {
+      if (!wasWaiting && isWaiting && !doc.slaPausedAt && doc.status !== 'resolved') {
+        // Entering hold — stop the resolution clock.
+        await req.payload.update({
+          collection: slugs.tickets,
+          id: doc.id,
+          data: { slaPausedAt: new Date().toISOString() },
+          overrideAccess: true,
+        })
+      } else if (wasWaiting && !isWaiting && doc.slaPausedAt) {
+        // Leaving hold — extend the deadline by however long we were paused.
+        const pausedMs = Date.now() - new Date(doc.slaPausedAt as string).getTime()
+        const data: Record<string, unknown> = { slaPausedAt: null }
+        if (pausedMs > 0) {
+          data.slaResolutionDue = new Date(new Date(doc.slaResolutionDue as string).getTime() + pausedMs).toISOString()
+        }
+        await req.payload.update({ collection: slugs.tickets, id: doc.id, data, overrideAccess: true })
+      }
+    } catch (err) {
+      console.error('[sla] Failed to pause/resume SLA on hold:', err)
+    }
+    return doc
+  }
+}
+
 /**
  * Factory: Check SLA breach on first admin response.
  * Runs as afterChange on ticket-messages collection.
@@ -377,8 +411,7 @@ export function createCheckSlaOnReply(slugs: CollectionSlugs, notificationSlug =
       const { payload } = req
       const ticketId = typeof doc.ticket === 'object' ? (doc.ticket as AnyDoc).id : doc.ticket
 
-      const ticket = await payload.findByID({
-        collection: slugs.tickets as any,
+      const ticket = await dbFindByID(payload, slugs.tickets, {
         id: ticketId as number,
         depth: 1,
         overrideAccess: true,
@@ -394,8 +427,7 @@ export function createCheckSlaOnReply(slugs: CollectionSlugs, notificationSlug =
       const deadline = new Date(ticket.slaFirstResponseDue as string)
       const breached = now > deadline
 
-      await payload.update({
-        collection: slugs.tickets as any,
+      await dbUpdate(payload, slugs.tickets, {
         id: ticketId as number,
         data: { slaFirstResponseBreached: breached },
         overrideAccess: true,

package/src/plugin.ts

@@ -23,6 +23,9 @@ import {
   createClientSummariesCollection,
   createTicketFeedbackCollection,
   createTicketCollaboratorsCollection,
+  createNotificationQueueCollection,
+  createAutomationRulesCollection,
+  createSupportTeamCollection,
 } from './collections'
 
 function viewConfig(component: string, path: string): AdminViewConfig {
@@ -90,6 +93,9 @@ export function supportPlugin(config?: SupportPluginConfig): Plugin {
       createKnowledgeBaseCollection(slugs),
       createTicketFeedbackCollection(slugs, { notificationSlug: config?.notificationSlug }),
       createTicketCollaboratorsCollection(slugs),
+      createNotificationQueueCollection(slugs),
+      createAutomationRulesCollection(slugs),
+      createSupportTeamCollection(slugs),
     ]
 
     // Auth logs (conditional)

package/src/portal/LiveChat.tsx

@@ -2,69 +2,8 @@
 
 import React, { useState, useEffect, useRef, useCallback } from 'react'
 import { MessageCircle, Send, X, Minimize2, ArrowLeft } from 'lucide-react'
-
-// ─── Types ───────────────────────────────────────────────────
-
-interface ChatMessage {
-  id: number | string
-  body: string
-  senderType: 'client' | 'agent' | 'system'
-  createdAt: string
-}
-
-interface LiveChatSession {
-  clientToken: string
-  email: string
-  name: string
-  sessionId?: string
-}
-
-type Screen = 'closed' | 'identify' | 'chat' | 'rating'
-
-// ─── LocalStorage keys ──────────────────────────────────────
-
-const LS_KEY = 'support-livechat'
-
-function loadSession(): LiveChatSession | null {
-  if (typeof window === 'undefined') return null
-  try {
-    const raw = localStorage.getItem(LS_KEY)
-    if (!raw) return null
-    const session = JSON.parse(raw) as LiveChatSession
-
-    // Validate token expiry (24h) — extract timestamp from token
-    if (session.clientToken) {
-      const parts = session.clientToken.split('_')
-      if (parts.length === 4) {
-        const timestamp = parseInt(parts[2], 10)
-        if (!isNaN(timestamp) && Date.now() - timestamp > 24 * 60 * 60 * 1000) {
-          localStorage.removeItem(LS_KEY)
-          return null
-        }
-      }
-    }
-
-    return session
-  } catch {
-    return null
-  }
-}
-
-function saveSession(session: LiveChatSession): void {
-  try {
-    localStorage.setItem(LS_KEY, JSON.stringify(session))
-  } catch {
-    // localStorage full or disabled
-  }
-}
-
-function clearSession(): void {
-  try {
-    localStorage.removeItem(LS_KEY)
-  } catch {
-    // Ignore
-  }
-}
+import type { ChatMessage, LiveChatSession, Screen } from './types'
+import { loadSession, saveSession, clearSession } from './helpers'
 
 // ─── Component ───────────────────────────────────────────────
 

package/src/portal/auth/tickets/detail/CloseTicketButton.tsx

@@ -7,6 +7,7 @@ export function CloseTicketButton({ ticketId }: { ticketId: number | string }) {
   const router = useRouter()
   const [loading, setLoading] = useState(false)
   const [confirming, setConfirming] = useState(false)
+  const [error, setError] = useState('')
 
   const handleClose = async () => {
     if (!confirming) {
@@ -15,6 +16,7 @@ export function CloseTicketButton({ ticketId }: { ticketId: number | string }) {
     }
 
     setLoading(true)
+    setError('')
     try {
       const res = await fetch(`/api/tickets/${ticketId}`, {
         method: 'PATCH',
@@ -25,9 +27,12 @@ export function CloseTicketButton({ ticketId }: { ticketId: number | string }) {
 
       if (res.ok) {
         router.refresh()
+      } else {
+        setError('Impossible de fermer le ticket. Veuillez réessayer.')
       }
     } catch (err) {
       console.warn('[CloseTicketButton] Failed to close ticket:', err)
+      setError('Erreur de connexion. Veuillez réessayer.')
     } finally {
       setLoading(false)
       setConfirming(false)
@@ -35,6 +40,10 @@ export function CloseTicketButton({ ticketId }: { ticketId: number | string }) {
   }
 
   return (
+    <div className="flex flex-col items-end gap-1">
+      {error && (
+        <p className="text-xs font-medium text-red-600 dark:text-red-400">{error}</p>
+      )}
     <button
       onClick={handleClose}
       disabled={loading}
@@ -70,5 +79,6 @@ export function CloseTicketButton({ ticketId }: { ticketId: number | string }) {
         </>
       )}
     </button>
+    </div>
   )
 }

package/src/portal/auth/tickets/detail/MarkSolutionButton.tsx

@@ -12,25 +12,33 @@ export function MarkSolutionButton({
 }) {
   const router = useRouter()
   const [loading, setLoading] = useState(false)
+  const [error, setError] = useState('')
 
   const handleToggle = async () => {
     setLoading(true)
+    setError('')
     try {
-      await fetch(`/api/ticket-messages/${messageId}`, {
+      const res = await fetch(`/api/ticket-messages/${messageId}`, {
         method: 'PATCH',
         headers: { 'Content-Type': 'application/json' },
         credentials: 'include',
         body: JSON.stringify({ isSolution: !isSolution }),
       })
-      router.refresh()
+      if (res.ok) {
+        router.refresh()
+      } else {
+        setError('Échec. Veuillez réessayer.')
+      }
     } catch (err) {
       console.warn('[MarkSolutionButton] Failed to toggle solution:', err)
+      setError('Erreur de connexion.')
     } finally {
       setLoading(false)
     }
   }
 
   return (
+    <div className="flex flex-col items-start gap-0.5">
     <button
       onClick={handleToggle}
       disabled={loading}
@@ -46,5 +54,9 @@ export function MarkSolutionButton({
       </svg>
       {isSolution ? 'Solution' : 'Marquer comme solution'}
     </button>
+    {error && (
+      <p className="text-[10px] font-medium text-red-500 dark:text-red-400">{error}</p>
+    )}
+    </div>
   )
 }

package/src/portal/auth/tickets/detail/MessageActions.tsx

@@ -19,6 +19,7 @@ export function MessageActions({
   const [editText, setEditText] = useState(body)
   const [saving, setSaving] = useState(false)
   const [confirmDelete, setConfirmDelete] = useState(false)
+  const [error, setError] = useState('')
 
   const elapsed = Date.now() - new Date(createdAt).getTime()
   const canEdit = elapsed < EDIT_WINDOW_MS
@@ -33,6 +34,7 @@ export function MessageActions({
       return
     }
     setSaving(true)
+    setError('')
     try {
       const res = await fetch(`/api/ticket-messages/${messageId}`, {
         method: 'PATCH',
@@ -46,13 +48,18 @@ export function MessageActions({
       if (res.ok) {
         setEditing(false)
         router.refresh()
+      } else {
+        setError('Impossible de sauvegarder. Veuillez réessayer.')
       }
-    } catch { /* ignore */ }
+    } catch {
+      setError('Erreur de connexion. Veuillez réessayer.')
+    }
     setSaving(false)
   }
 
   const handleDelete = async () => {
     setSaving(true)
+    setError('')
     try {
       const res = await fetch(`/api/ticket-messages/${messageId}`, {
         method: 'PATCH',
@@ -67,8 +74,12 @@ export function MessageActions({
       if (res.ok) {
         setConfirmDelete(false)
         router.refresh()
+      } else {
+        setError('Impossible de supprimer. Veuillez réessayer.')
       }
-    } catch { /* ignore */ }
+    } catch {
+      setError('Erreur de connexion. Veuillez réessayer.')
+    }
     setSaving(false)
   }
 
@@ -90,33 +101,41 @@ export function MessageActions({
             {saving ? 'Enregistrement...' : 'Enregistrer'}
           </button>
           <button
-            onClick={() => { setEditing(false); setEditText(body) }}
+            onClick={() => { setEditing(false); setEditText(body); setError('') }}
             className="rounded-md border border-slate-300 dark:border-slate-600 px-3 py-1 text-xs font-semibold text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-800"
           >
             Annuler
           </button>
         </div>
+        {error && (
+          <p className="text-xs font-medium text-red-600 dark:text-red-400">{error}</p>
+        )}
       </div>
     )
   }
 
   if (confirmDelete) {
     return (
-      <div className="mt-2 flex items-center gap-2">
-        <span className="text-xs text-red-500">Supprimer ce message ?</span>
-        <button
-          onClick={handleDelete}
-          disabled={saving}
-          className="rounded-md bg-red-600 px-2.5 py-1 text-xs font-semibold text-white hover:bg-red-700 disabled:opacity-50"
-        >
-          {saving ? '...' : 'Confirmer'}
-        </button>
-        <button
-          onClick={() => setConfirmDelete(false)}
-          className="rounded-md border border-slate-300 dark:border-slate-600 px-2.5 py-1 text-xs text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-800"
-        >
-          Annuler
-        </button>
+      <div className="mt-2 space-y-1.5">
+        <div className="flex items-center gap-2">
+          <span className="text-xs text-red-500">Supprimer ce message ?</span>
+          <button
+            onClick={handleDelete}
+            disabled={saving}
+            className="rounded-md bg-red-600 px-2.5 py-1 text-xs font-semibold text-white hover:bg-red-700 disabled:opacity-50"
+          >
+            {saving ? '...' : 'Confirmer'}
+          </button>
+          <button
+            onClick={() => { setConfirmDelete(false); setError('') }}
+            className="rounded-md border border-slate-300 dark:border-slate-600 px-2.5 py-1 text-xs text-slate-600 dark:text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-800"
+          >
+            Annuler
+          </button>
+        </div>
+        {error && (
+          <p className="text-xs font-medium text-red-600 dark:text-red-400">{error}</p>
+        )}
       </div>
     )
   }

package/src/portal/auth/tickets/detail/ReopenTicketButton.tsx

@@ -7,6 +7,7 @@ export function ReopenTicketButton({ ticketId }: { ticketId: number | string })
   const router = useRouter()
   const [loading, setLoading] = useState(false)
   const [confirming, setConfirming] = useState(false)
+  const [error, setError] = useState('')
 
   const handleReopen = async () => {
     if (!confirming) {
@@ -15,6 +16,7 @@ export function ReopenTicketButton({ ticketId }: { ticketId: number | string })
     }
 
     setLoading(true)
+    setError('')
     try {
       const res = await fetch(`/api/tickets/${ticketId}`, {
         method: 'PATCH',
@@ -25,9 +27,12 @@ export function ReopenTicketButton({ ticketId }: { ticketId: number | string })
 
       if (res.ok) {
         router.refresh()
+      } else {
+        setError('Impossible de rouvrir le ticket. Veuillez réessayer.')
       }
     } catch (err) {
       console.warn('[ReopenTicketButton] Failed to reopen ticket:', err)
+      setError('Erreur de connexion. Veuillez réessayer.')
     } finally {
       setLoading(false)
       setConfirming(false)
@@ -35,6 +40,10 @@ export function ReopenTicketButton({ ticketId }: { ticketId: number | string })
   }
 
   return (
+    <div className="flex flex-col items-end gap-1">
+      {error && (
+        <p className="text-xs font-medium text-red-600 dark:text-red-400">{error}</p>
+      )}
     <button
       onClick={handleReopen}
       disabled={loading}
@@ -70,5 +79,6 @@ export function ReopenTicketButton({ ticketId }: { ticketId: number | string })
         </>
       )}
     </button>
+    </div>
   )
 }