@consilioweb/payload-support 0.16.0 → 1.0.0

package/src/utils/sanitizeHtml.ts

@@ -0,0 +1,57 @@
+import sanitizeHtml from 'sanitize-html'
+
+/**
+ * Allow-list sanitizer for user/agent-submitted rich message content (`bodyHtml`).
+ *
+ * `bodyHtml` is rendered with `dangerouslySetInnerHTML` in BOTH the portal and the
+ * admin views, so unsanitized HTML is a stored-XSS vector: a client could inject
+ * a payload that runs in an agent's session → session theft → cross-client access.
+ *
+ * Applied server-side on write (TicketMessages `beforeChange`). Strips <script>,
+ * <iframe>/<embed>/<object>, inline event handlers (`on*`) and `javascript:` URIs,
+ * and restricts inline styles to a safe property/value allow-list (no `url()` /
+ * `expression()`).
+ */
+const OPTIONS: sanitizeHtml.IOptions = {
+  allowedTags: [
+    'p', 'br', 'b', 'strong', 'i', 'em', 'u', 's', 'strike', 'del', 'ins', 'mark',
+    'a', 'ul', 'ol', 'li', 'blockquote', 'code', 'pre', 'kbd', 'span', 'div',
+    'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'hr', 'img',
+    'table', 'thead', 'tbody', 'tr', 'th', 'td',
+  ],
+  allowedAttributes: {
+    a: ['href', 'title', 'target', 'rel'],
+    img: ['src', 'alt', 'title', 'width', 'height'],
+    code: ['class'],
+    pre: ['class'],
+    span: ['class'],
+    '*': ['style'],
+  },
+  allowedSchemes: ['http', 'https', 'mailto', 'tel'],
+  allowedSchemesByTag: { img: ['http', 'https', 'data'] },
+  allowProtocolRelative: false,
+  disallowedTagsMode: 'discard',
+  // Force safe rel on links opening a new tab (defense against tabnabbing).
+  transformTags: {
+    a: sanitizeHtml.simpleTransform('a', { rel: 'noopener noreferrer nofollow' }, true),
+  },
+  // Only allow CSS that cannot carry a script payload.
+  allowedStyles: {
+    '*': {
+      color: [/^#(0x)?[0-9a-f]+$/i, /^rgb\(\s*(\d{1,3}\s*,\s*){2}\d{1,3}\s*\)$/i, /^[a-z-]+$/i],
+      'background-color': [/^#(0x)?[0-9a-f]+$/i, /^rgb\(\s*(\d{1,3}\s*,\s*){2}\d{1,3}\s*\)$/i, /^[a-z-]+$/i],
+      'text-align': [/^(left|right|center|justify)$/],
+      'font-weight': [/^(normal|bold|[1-9]00)$/],
+      'font-style': [/^(normal|italic)$/],
+      'text-decoration': [/^(underline|line-through|none)$/],
+    },
+  },
+}
+
+/**
+ * Sanitize a rich-HTML message body. Returns the input unchanged when empty.
+ */
+export function sanitizeMessageHtml(html: string): string {
+  if (!html) return html
+  return sanitizeHtml(html, OPTIONS)
+}

package/src/utils/slugs.ts

@@ -20,6 +20,9 @@ export interface CollectionSlugs {
   macros: string
   ticketStatuses: string
   ticketFeedback: string
+  notificationQueue: string
+  automationRules: string
+  supportTeams: string
   users: string
   media: string
 }
@@ -42,6 +45,9 @@ export const DEFAULT_SLUGS: CollectionSlugs = {
   macros: 'macros',
   ticketStatuses: 'ticket-statuses',
   ticketFeedback: 'ticket-feedback',
+  notificationQueue: 'notification-queue',
+  automationRules: 'automation-rules',
+  supportTeams: 'support-teams',
   users: 'users',
   media: 'media',
 }

package/src/utils/teamAccess.ts

@@ -0,0 +1,27 @@
+import type { Payload } from 'payload'
+import type { CollectionSlugs } from './slugs'
+import { dbFind } from './db'
+
+/** Team scoping is opt-in — off by default so existing installs are unaffected. */
+export function isTeamScopingEnabled(): boolean {
+  return process.env.SUPPORT_TEAM_SCOPING === '1' || process.env.SUPPORT_TEAM_SCOPING === 'true'
+}
+
+/** Resolve the team IDs an agent belongs to. */
+export async function resolveAgentTeamIds(
+  payload: Payload,
+  slugs: CollectionSlugs,
+  userId: number | string,
+): Promise<Array<number | string>> {
+  try {
+    const teams = await dbFind(payload, slugs.supportTeams, {
+      where: { members: { in: [userId] } },
+      limit: 200,
+      depth: 0,
+      overrideAccess: true,
+    })
+    return teams.docs.map((t) => (t as { id: number | string }).id)
+  } catch {
+    return []
+  }
+}

package/src/utils/ticketAccess.ts

@@ -0,0 +1,53 @@
+import type { Payload } from 'payload'
+import type { CollectionSlugs } from './slugs'
+import { dbFind } from './db'
+
+/**
+ * Resolve the set of ticket IDs a support-client may access: tickets they own
+ * (`client = id`) plus tickets they collaborate on (`ticket-collaborators` table).
+ *
+ * Used as a SECURITY BOUNDARY for child collections (messages, activity log):
+ * callers constrain `ticket IN (...)` instead of relying on a nested relationship
+ * filter (`'ticket.client'`), whose behaviour through the SQLite/Drizzle adapter
+ * is not guaranteed. Mirrors the owner/collaborator resolution in `Tickets.ts`.
+ *
+ * Returns an empty array when the client has no accessible tickets — callers MUST
+ * treat that as "deny" (e.g. filter on a sentinel id) rather than "allow all".
+ */
+export async function resolveAccessibleTicketIds(
+  payload: Payload,
+  slugs: CollectionSlugs,
+  clientId: number | string,
+): Promise<Array<number | string>> {
+  const ids = new Set<number | string>()
+
+  try {
+    const owned = await dbFind(payload, slugs.tickets, {
+      where: { client: { equals: clientId } },
+      limit: 5000,
+      depth: 0,
+      overrideAccess: true,
+    })
+    for (const t of owned.docs) ids.add(t.id as number | string)
+  } catch {
+    // ignore — fall through with whatever we resolved
+  }
+
+  try {
+    const collab = await dbFind(payload, 'ticket-collaborators', {
+      where: { client: { equals: clientId } },
+      limit: 1000,
+      depth: 0,
+      overrideAccess: true,
+    })
+    for (const r of collab.docs) {
+      const row = r as { ticket?: number | string | { id?: number | string } }
+      const tid = typeof row.ticket === 'object' ? row.ticket?.id : row.ticket
+      if (tid !== undefined && tid !== null) ids.add(tid)
+    }
+  } catch {
+    // ticket-collaborators may not exist on older deployments — owner-only fallback
+  }
+
+  return Array.from(ids)
+}

package/src/utils/webhookDispatcher.ts

@@ -1,6 +1,7 @@
 import crypto from 'crypto'
 import type { BasePayload } from 'payload'
 import type { CollectionSlugs } from './slugs'
+import { dbFind, dbUpdate } from './db'
 
 type WebhookEvent = 'ticket_created' | 'ticket_resolved' | 'ticket_replied' | 'sla_breached'
 
@@ -32,8 +33,7 @@ async function _dispatch(
   slugs: CollectionSlugs,
 ): Promise<void> {
   try {
-    const { docs: endpoints } = await payload.find({
-      collection: slugs.webhookEndpoints as any,
+    const { docs: endpoints } = await dbFind(payload, slugs.webhookEndpoints, {
       where: {
         and: [
           { active: { equals: true } },
@@ -86,8 +86,7 @@ async function _sendToEndpoint(
     })
 
     // Update last triggered info on the endpoint
-    await payload.update({
-      collection: slugs.webhookEndpoints as any,
+    await dbUpdate(payload, slugs.webhookEndpoints, {
       id: endpoint.id,
       data: {
         lastTriggeredAt: new Date().toISOString(),
@@ -104,8 +103,7 @@ async function _sendToEndpoint(
 
     // Still update with error status
     try {
-      await payload.update({
-        collection: slugs.webhookEndpoints as any,
+      await dbUpdate(payload, slugs.webhookEndpoints, {
         id: endpoint.id,
         data: {
           lastTriggeredAt: new Date().toISOString(),

package/src/views/BillingView/client.tsx

@@ -2,6 +2,7 @@
 
 import React, { useState, useCallback } from 'react'
 import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation'
+import { DATE_LOCALE } from '../shared/dateLocale'
 import styles from '../../styles/BillingView.module.scss'
 
 interface BillingEntry {
@@ -215,28 +216,30 @@ export const BillingClient: React.FC = () => {
   const copyRecap = useCallback(() => {
     if (!data) return
     const lines: string[] = []
-    lines.push(`PRE-FACTURATION — Du ${from} au ${to}`)
-    lines.push(`Taux horaire : ${rate} EUR/h`)
+    lines.push(t('billing.recap.header', { from, to }))
+    lines.push(t('billing.recap.hourlyRate', { rate: String(rate) }))
     lines.push('='.repeat(50))
 
     for (const group of visibleGroups) {
       lines.push('')
-      lines.push(`PROJET : ${group.project?.name || 'Sans projet'}`)
-      if (group.client?.company) lines.push(`Client : ${group.client.company}`)
+      lines.push(group.project?.name
+        ? t('billing.recap.project', { name: group.project.name })
+        : t('billing.recap.project', { name: t('billing.recap.noProject') }))
+      if (group.client?.company) lines.push(t('billing.recap.client', { company: group.client.company }))
       lines.push('-'.repeat(40))
 
       for (const ticket of group.tickets) {
-        const flag = ticket.hasNoTimeEntries ? ' [AUCUN TEMPS SAISI]' : ''
+        const flag = ticket.hasNoTimeEntries ? t('billing.recap.noTime') : ''
         lines.push(`  ${ticket.ticketNumber} — ${ticket.subject}${flag}`)
         for (const entry of ticket.entries) {
           lines.push(`    ${entry.date} | ${formatDuration(entry.duration)} | ${entry.description || '-'}`)
         }
         if (ticket.entries.length > 0) {
           const ticketAmount = ticket.billedAmount || Number(formatAmount(ticket.totalMinutes, rate))
-          lines.push(`    Sous-total : ${formatDuration(ticket.totalMinutes)} = ${ticketAmount.toFixed(2)} EUR${ticket.billedAmount ? ' (forfait)' : ''}`)
+          lines.push(`    ${t('billing.recap.subtotal')} : ${formatDuration(ticket.totalMinutes)} = ${ticketAmount.toFixed(2)}${t('billing.recap.eur')}${ticket.billedAmount ? t('billing.recap.forfait') : ''}`)
         }
         if (ticket.aiSummary) {
-          lines.push('    Detail des actions :')
+          lines.push(`    ${t('billing.recap.actionDetails')} :`)
           for (const detailLine of ticket.aiSummary.split('\n')) {
             lines.push(`    ${detailLine}`)
           }
@@ -245,17 +248,17 @@ export const BillingClient: React.FC = () => {
       const groupAmount = group.totalBilledAmount > 0
         ? group.totalBilledAmount
         : Number(formatAmount(group.totalMinutes, rate))
-      lines.push(`  Total projet : ${formatDuration(group.totalMinutes)} = ${groupAmount.toFixed(2)} EUR`)
+      lines.push(`  ${t('billing.recap.projectTotal')} : ${formatDuration(group.totalMinutes)} = ${groupAmount.toFixed(2)}${t('billing.recap.eur')}`)
     }
 
     lines.push('')
     lines.push('='.repeat(50))
-    lines.push(`TOTAL GENERAL : ${formatDuration(data.grandTotalMinutes)} = ${formatAmount(data.grandTotalMinutes, rate)} EUR`)
+    lines.push(`${t('billing.recap.grandTotal')} : ${formatDuration(data.grandTotalMinutes)} = ${formatAmount(data.grandTotalMinutes, rate)}${t('billing.recap.eur')}`)
 
     navigator.clipboard.writeText(lines.join('\n'))
     setCopied(true)
     setTimeout(() => setCopied(false), 2000)
-  }, [data, visibleGroups, from, to, rate])
+  }, [data, visibleGroups, from, to, rate, t])
 
   const copyTicketSummary = useCallback((ticket: BillingTicket) => {
     const lines = [`${ticket.ticketNumber} — ${ticket.subject}`]
@@ -324,11 +327,13 @@ export const BillingClient: React.FC = () => {
           {data.ticketsWithoutTime > 0 && (
             <div className={styles.warningBanner}>
               <span>
-                <strong>{data.ticketsWithoutTime}</strong> ticket{data.ticketsWithoutTime > 1 ? 's' : ''} actif{data.ticketsWithoutTime > 1 ? 's' : ''} sans temps saisi sur la periode.
+                {data.ticketsWithoutTime > 1
+                  ? t('billing.warningTicketsPlural', { count: String(data.ticketsWithoutTime) })
+                  : t('billing.warningTickets', { count: String(data.ticketsWithoutTime) })}
               </span>
               <label className={styles.toggleLabel}>
                 <input type="checkbox" checked={hideEmpty} onChange={(e) => setHideEmpty(e.target.checked)} />
-                <span>Masquer ces tickets</span>
+                <span>{t('billing.hideEmpty')}</span>
               </label>
             </div>
           )}
@@ -341,7 +346,7 @@ export const BillingClient: React.FC = () => {
                 <div key={gi} className={styles.groupCard}>
                   <div className={styles.groupHeader}>
                     <div>
-                      <span className={styles.groupName}>{group.project?.name || 'Sans projet'}</span>
+                      <span className={styles.groupName}>{group.project?.name || t('billing.noProject')}</span>
                       {group.client?.company && (
                         <span className={styles.groupClient}>— {group.client.company}</span>
                       )}
@@ -350,7 +355,7 @@ export const BillingClient: React.FC = () => {
                       <div className={styles.groupDuration}>{formatDuration(group.totalMinutes)}</div>
                       {group.totalBilledAmount > 0 ? (
                         <>
-                          <div className={styles.groupAmountBilled}>{group.totalBilledAmount.toFixed(2)} EUR facture</div>
+                          <div className={styles.groupAmountBilled}>{group.totalBilledAmount.toFixed(2)} EUR {t('billing.groupAmountBilled')}</div>
                           <div className={styles.groupAmountStrike}>{formatAmount(group.totalMinutes, rate)} EUR (temps)</div>
                         </>
                       ) : (
@@ -377,16 +382,16 @@ export const BillingClient: React.FC = () => {
                               })
                             }}
                             className={styles.checkbox}
-                            title="Tout cocher/decocher"
+                            title={t('billing.tableCheckboxTitle')}
                           />
                         </th>
-                        <th className={styles.th}>N° Ticket</th>
-                        <th className={styles.thLeft}>Sujet</th>
-                        <th className={styles.th}>Date</th>
-                        <th className={styles.th}>Duree</th>
-                        <th className={styles.thLeft}>Description</th>
-                        <th className={styles.th}>Montant</th>
-                        <th className={styles.th}>Facture</th>
+                        <th className={styles.th}>{t('billing.tableHeaders.number')}</th>
+                        <th className={styles.thLeft}>{t('billing.tableHeaders.subject')}</th>
+                        <th className={styles.th}>{t('billing.tableHeaders.date')}</th>
+                        <th className={styles.th}>{t('billing.tableHeaders.duration')}</th>
+                        <th className={styles.thLeft}>{t('billing.tableHeaders.description')}</th>
+                        <th className={styles.th}>{t('billing.tableHeaders.amount')}</th>
+                        <th className={styles.th}>{t('billing.tableHeaders.billed')}</th>
                       </tr>
                     </thead>
                     <tbody>
@@ -403,7 +408,7 @@ export const BillingClient: React.FC = () => {
                                 checked={isBilled}
                                 onChange={() => toggleBilled(ticket.id)}
                                 className={styles.checkbox}
-                                title={isBilled ? 'Marquer comme non facture' : 'Marquer comme facture'}
+                                title={isBilled ? t('billing.markUnbilledTitle') : t('billing.markBilledTitle')}
                               />
                             </td>
                             <td className={`${styles.td} ${styles.bold} ${isBilled ? styles.strikethrough : ''}`} rowSpan={rowSpan}>
@@ -413,7 +418,7 @@ export const BillingClient: React.FC = () => {
                               <button
                                 className={styles.summaryBtn}
                                 onClick={() => toggleSummary(ticket.id)}
-                                title={isExpanded ? 'Masquer le detail' : 'Afficher le detail IA'}
+                                title={isExpanded ? t('billing.summaryToggleHide') : t('billing.summaryToggleShow')}
                               >
                                 {isExpanded ? '▼' : '▶'} IA
                               </button>
@@ -421,8 +426,8 @@ export const BillingClient: React.FC = () => {
                             <td className={`${styles.tdLeft} ${isBilled ? styles.strikethrough : ''}`} rowSpan={rowSpan}>
                               {ticket.subject}
                               {ticket.hasNoTimeEntries && (
-                                <span className={styles.noTimeBadge} title="Aucun temps saisi sur la periode">
-                                  ⚠ Aucun temps saisi
+                                <span className={styles.noTimeBadge} title={t('billing.noTimeBadgeTitle')}>
+                                  {t('billing.noTimeBadge')}
                                 </span>
                               )}
                             </td>
@@ -439,7 +444,7 @@ export const BillingClient: React.FC = () => {
                             >
                               {renderTicketHeaderCells()}
                               <td className={`${styles.td} ${styles.secondary}`} colSpan={5}>
-                                <em>Pas de saisie de temps. Verifier si du temps a ete oublie.</em>
+                                <em>{t('billing.noTimeRow')}</em>
                               </td>
                             </tr>,
                           )
@@ -477,11 +482,11 @@ export const BillingClient: React.FC = () => {
                             <tr key={`${ticket.id}-summary`} className={styles.summaryRow}>
                               <td colSpan={8} className={styles.summaryCell}>
                                 <div className={styles.summaryHeader}>
-                                  <strong>Synthese IA des actions</strong>
+                                  <strong>{t('billing.summaryTitle')}</strong>
                                   <div className={styles.summaryActions}>
                                     {ticket.aiSummaryGeneratedAt && (
                                       <span className={styles.summaryMeta}>
-                                        Genere le {new Date(ticket.aiSummaryGeneratedAt).toLocaleString('fr-FR')}
+                                        {t('billing.summaryGeneratedAt', { date: new Date(ticket.aiSummaryGeneratedAt).toLocaleString(DATE_LOCALE) })}
                                       </span>
                                     )}
                                     {ticket.aiSummary && (
@@ -489,7 +494,7 @@ export const BillingClient: React.FC = () => {
                                         className={styles.summaryAction}
                                         onClick={() => copyTicketSummary(ticket)}
                                       >
-                                        Copier
+                                        {t('billing.summaryCopy')}
                                       </button>
                                     )}
                                     <button
@@ -498,20 +503,20 @@ export const BillingClient: React.FC = () => {
                                       disabled={isRegenerating}
                                     >
                                       {isRegenerating
-                                        ? 'Generation...'
-                                        : ticket.aiSummary ? 'Regenerer' : 'Generer'}
+                                        ? t('billing.summaryGenerating')
+                                        : ticket.aiSummary ? t('billing.summaryRegenerate') : t('billing.summaryGenerate')}
                                     </button>
                                   </div>
                                 </div>
                                 {ticket.aiSummaryStatus === 'pending' && !ticket.aiSummary ? (
                                   <div className={styles.summaryEmpty}>
-                                    Generation en cours en arriere-plan. Cliquer sur "Generer" pour forcer.
+                                    {t('billing.summaryPending')}
                                   </div>
                                 ) : ticket.aiSummary ? (
                                   <pre className={styles.summaryText}>{ticket.aiSummary}</pre>
                                 ) : (
                                   <div className={styles.summaryEmpty}>
-                                    Pas de synthese disponible. La synthese est generee automatiquement quand le ticket passe en "resolu", ou manuellement via le bouton "Generer".
+                                    {t('billing.summaryEmpty')}
                                   </div>
                                 )}
                               </td>
@@ -529,15 +534,22 @@ export const BillingClient: React.FC = () => {
               <div className={styles.grandTotal}>
                 <div>
                   <div className={styles.totalMeta}>
-                    {totalTickets} ticket{totalTickets > 1 ? 's' : ''} affiche{totalTickets > 1 ? 's' : ''}
+                    {totalTickets > 1
+                      ? t('billing.ticketsDisplayedPlural', { count: String(totalTickets) })
+                      : t('billing.ticketsDisplayed', { count: String(totalTickets) })}
                     {billedTickets.size > 0 && (
                       <span className={styles.totalChecked}>
-                        ({allTicketIds.filter((id) => billedTickets.has(id)).length} coche{allTicketIds.filter((id) => billedTickets.has(id)).length > 1 ? 's' : ''})
+                        {(() => {
+                          const checkedCount = allTicketIds.filter((id) => billedTickets.has(id)).length
+                          return checkedCount > 1
+                            ? `(${t('billing.ticketsCheckedPlural', { count: String(checkedCount) })})`
+                            : `(${t('billing.ticketsChecked', { count: String(checkedCount) })})`
+                        })()}
                       </span>
                     )}
                   </div>
                   <div className={styles.totalAmount}>
-                    Total : {formatDuration(data.grandTotalMinutes)} ={' '}
+                    {t('billing.totalLabel')} : {formatDuration(data.grandTotalMinutes)} ={' '}
                     {data.grandTotalBilledAmount > 0
                       ? `${data.grandTotalBilledAmount.toFixed(2)} EUR`
                       : `${formatAmount(data.grandTotalMinutes, rate)} EUR`

package/src/views/ChatView/client.tsx

@@ -2,6 +2,7 @@
 
 import React, { useState, useEffect, useRef, useCallback } from 'react'
 import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation'
+import { DATE_LOCALE } from '../shared/dateLocale'
 import styles from '../../styles/ChatView.module.scss'
 
 interface ChatSession {
@@ -255,7 +256,7 @@ export const ChatViewClient: React.FC = () => {
                   ) : s.lastMessage}
                 </div>
                 <div className={styles.sessionMeta}>
-                  {new Date(s.lastMessageAt).toLocaleString('fr-FR', { day: '2-digit', month: '2-digit', hour: '2-digit', minute: '2-digit' })}
+                  {new Date(s.lastMessageAt).toLocaleString(DATE_LOCALE, { day: '2-digit', month: '2-digit', hour: '2-digit', minute: '2-digit' })}
                   {' · '}{s.messageCount} {t('chat.msg')}
                 </div>
               </button>
@@ -306,7 +307,7 @@ export const ChatViewClient: React.FC = () => {
                               : msg.message.replace(/Note:\s*[★☆]+\s*\(\d\/5\)\s*/, '').replace('Commentaire: ', '')}
                           </div>
                           <div className={styles.ratingMeta}>
-                            {t('chat.clientReview')} · {new Date(msg.createdAt).toLocaleString('fr-FR', { day: '2-digit', month: '2-digit', hour: '2-digit', minute: '2-digit' })}
+                            {t('chat.clientReview')} · {new Date(msg.createdAt).toLocaleString(DATE_LOCALE, { day: '2-digit', month: '2-digit', hour: '2-digit', minute: '2-digit' })}
                           </div>
                         </div>
                       ) : (
@@ -325,7 +326,7 @@ export const ChatViewClient: React.FC = () => {
                           {msg.message}
                         </div>
                         <div className={styles.bubbleTime}>
-                          {new Date(msg.createdAt).toLocaleTimeString('fr-FR', { hour: '2-digit', minute: '2-digit' })}
+                          {new Date(msg.createdAt).toLocaleTimeString(DATE_LOCALE, { hour: '2-digit', minute: '2-digit' })}
                         </div>
                       </div>
                     )}

package/src/views/CrmView/client.tsx

@@ -71,14 +71,14 @@ function formatDuration(minutes: number): string {
   return `${h}h${m}m`
 }
 
-function timeAgo(dateStr: string): string {
+function timeAgo(dateStr: string, tFn: (k: string, vars?: Record<string, string | number>) => string): string {
   const diff = Date.now() - new Date(dateStr).getTime()
   const days = Math.floor(diff / 86400000)
-  if (days === 0) return "Aujourd'hui"
-  if (days === 1) return 'Hier'
-  if (days < 30) return `Il y a ${days}j`
+  if (days === 0) return tFn('crm.timeAgo.today')
+  if (days === 1) return tFn('crm.timeAgo.yesterday')
+  if (days < 30) return tFn('crm.timeAgo.daysAgo', { count: days })
   const months = Math.floor(days / 30)
-  return `Il y a ${months} mois`
+  return tFn('crm.timeAgo.monthsAgo', { count: months })
 }
 
 function getStatColorClass(key: string, detail: ClientDetail['stats']): string {
@@ -416,7 +416,7 @@ export const CrmClient: React.FC = () => {
                   { key: 'open', label: t('crm.stats.openTickets'), value: String(detail.stats.openTickets) },
                   { key: 'resolved', label: t('crm.stats.resolvedTickets'), value: String(detail.stats.resolvedTickets) },
                   { key: 'time', label: t('crm.stats.timeSpent'), value: formatDuration(detail.stats.totalTimeMinutes) },
-                  { key: 'activity', label: t('crm.stats.lastActivity'), value: detail.stats.lastActivity ? timeAgo(detail.stats.lastActivity) : '-' },
+                  { key: 'activity', label: t('crm.stats.lastActivity'), value: detail.stats.lastActivity ? timeAgo(detail.stats.lastActivity, t) : '-' },
                 ].map((stat) => (
                   <div key={stat.key} className={styles.statCard}>
                     <div className={styles.statLabel}>{stat.label}</div>
@@ -554,7 +554,7 @@ export const CrmClient: React.FC = () => {
                             </span>
                           </td>
                           <td className={styles.ticketDate}>
-                            {timeAgo(tk.createdAt)}
+                            {timeAgo(tk.createdAt, t)}
                           </td>
                         </tr>
                       ))}

package/src/views/EmailTrackingView/client.tsx

@@ -2,6 +2,7 @@
 
 import React, { useState, useEffect, useCallback } from 'react'
 import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation'
+import { DATE_LOCALE } from '../shared/dateLocale'
 import s from '../../styles/EmailTracking.module.scss'
 
 interface EmailLog {
@@ -30,14 +31,14 @@ interface Stats {
 type StatusTab = 'all' | 'success' | 'error' | 'ignored'
 type DateRange = 7 | 30 | 90
 
-const STATUS_CFG: Record<string, { label: string; bg: string; color: string }> = {
-  success: { label: 'Succès', bg: '#dcfce7', color: '#16a34a' },
-  error: { label: 'Erreur', bg: '#fef2f2', color: '#dc2626' },
-  ignored: { label: 'Ignoré', bg: '#f3f4f6', color: '#6b7280' },
+const STATUS_CFG: Record<string, { labelKey: string; bg: string; color: string }> = {
+  success: { labelKey: 'logs.statusSuccess', bg: '#dcfce7', color: '#16a34a' },
+  error: { labelKey: 'emailTracking.errorLabel', bg: '#fef2f2', color: '#dc2626' },
+  ignored: { labelKey: 'logs.statusIgnored', bg: '#f3f4f6', color: '#6b7280' },
 }
 
 function fmtDate(d: string): string {
-  return new Date(d).toLocaleDateString('fr-FR', { day: '2-digit', month: '2-digit', year: '2-digit', hour: '2-digit', minute: '2-digit' })
+  return new Date(d).toLocaleDateString(DATE_LOCALE, { day: '2-digit', month: '2-digit', year: '2-digit', hour: '2-digit', minute: '2-digit' })
 }
 
 export const EmailTrackingClient: React.FC = () => {
@@ -129,7 +130,7 @@ export const EmailTrackingClient: React.FC = () => {
                   <td style={{ maxWidth: 200, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }} title={log.recipientEmail}>{log.recipientEmail || '—'}</td>
                   <td style={{ maxWidth: 250, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }} title={log.subject}>{log.subject || '—'}</td>
                   <td>{log.ticketNumber ? <span className={s.ticketLink}>{log.ticketNumber}</span> : '—'}</td>
-                  <td><span className={s.statusBadge} style={{ background: STATUS_CFG[log.status]?.bg, color: STATUS_CFG[log.status]?.color }}>{STATUS_CFG[log.status]?.label || log.status}</span></td>
+                  <td><span className={s.statusBadge} style={{ background: STATUS_CFG[log.status]?.bg, color: STATUS_CFG[log.status]?.color }}>{STATUS_CFG[log.status]?.labelKey ? t(STATUS_CFG[log.status].labelKey) : log.status}</span></td>
                   <td style={{ fontSize: 12 }}>{log.action || '—'}</td>
                   <td style={{ textAlign: 'right' }}>
                     {log.processingTimeMs != null ? (

package/src/views/ImportConversationView/client.tsx

@@ -96,13 +96,13 @@ export function ImportConversationClient() {
 
       const data = await res.json()
       if (!res.ok) {
-        setError(data.error || 'Erreur lors de l\'analyse')
+        setError(data.error || t('import.analyzeError'))
         return
       }
 
       setPreview(data)
     } catch {
-      setError('Erreur reseau')
+      setError(t('import.networkError'))
     } finally {
       setLoading(false)
     }
@@ -122,14 +122,14 @@ export function ImportConversationClient() {
 
       const data = await res.json()
       if (!res.ok) {
-        setError(data.error || 'Erreur lors de l\'import')
+        setError(data.error || t('import.importError'))
         return
       }
 
       setResult(data)
       setPreview(null)
     } catch {
-      setError('Erreur reseau')
+      setError(t('import.networkError'))
     } finally {
       setLoading(false)
     }

package/src/views/LogsView/client.tsx

@@ -3,6 +3,7 @@
 import React, { useState, useEffect, useCallback } from 'react'
 import { useSearchParams } from 'next/navigation'
 import { useTranslation } from '../../components/TicketConversation/hooks/useTranslation'
+import { DATE_LOCALE } from '../shared/dateLocale'
 import s from '../../styles/Logs.module.scss'
 
 type LogType = 'email' | 'auth'
@@ -26,7 +27,7 @@ interface LogEntry {
 }
 
 function fmtDate(d: string): string {
-  return new Date(d).toLocaleDateString('fr-FR', { day: '2-digit', month: '2-digit', year: '2-digit', hour: '2-digit', minute: '2-digit' })
+  return new Date(d).toLocaleDateString(DATE_LOCALE, { day: '2-digit', month: '2-digit', year: '2-digit', hour: '2-digit', minute: '2-digit' })
 }
 
 export const LogsClient: React.FC = () => {
@@ -83,7 +84,7 @@ export const LogsClient: React.FC = () => {
         <div className={s.headerActions}>
           <button className={s.purgeBtn} onClick={() => handlePurge(7)}>{t('logs.purge7')}</button>
           <button className={s.purgeBtn} onClick={() => handlePurge(30)}>{t('logs.purge30')}</button>
-          <button className={s.purgeBtn} onClick={() => handlePurge(90)}>Purger +90j</button>
+          <button className={s.purgeBtn} onClick={() => handlePurge(90)}>{t('logs.purge90')}</button>
           <button className={`${s.purgeBtn} ${s.purgeBtnDanger}`} onClick={() => handlePurge(0)}>{t('logs.purgeAll')}</button>
         </div>
       </div>

package/src/views/NewTicketView/client.tsx

@@ -190,7 +190,7 @@ export const NewTicketClient: React.FC = () => {
           <div className={s.fieldGroup}>
             <label className={s.label}>{t('newTicket.projectLabel')}</label>
             <select className={s.select} value={projectId || ''} onChange={(e) => setProjectId(e.target.value ? Number(e.target.value) : null)}>
-              <option value="">— Aucun —</option>
+              <option value="">{t('newTicket.noProject')}</option>
               {projects.map((p) => <option key={p.id} value={p.id}>{p.name}</option>)}
             </select>
           </div>