fix(errors) : humanize backend error messages for end users

Add centralized error translation layer (humanizeError) that converts
raw Symfony/Doctrine/API Platform messages into user-friendly French.
Fix useApi to extract errors from all backend response formats
(violations, error, message, hydra:description, detail).
Add toast deduplication to prevent double display. Replace error toast
icon (X → CircleX) to distinguish from the dismiss button.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

app/composables/useApi.ts

@@ -1,4 +1,5 @@
 import { useToast } from './useToast'
+import { humanizeError, extractApiErrorMessage } from '~/shared/utils/errorMessages'
 
 export interface ApiResponse<T = any> {
   success: boolean
@@ -59,23 +60,26 @@ export function useApi() {
       } else {
         const contentType = response.headers.get('content-type') || ''
         let errorData: Record<string, unknown> = {}
-        if (contentType.includes('application/json')) {
+        if (contentType.includes('json')) {
           errorData = await response.json().catch(() => ({}))
         } else {
           const text = await response.text().catch(() => '')
           errorData = text ? { message: text } : {}
         }
-        const errorMessage = response.status === 403
+        const rawMessage = response.status === 403
           ? 'Permissions insuffisantes pour cette action.'
-          : (errorData.message as string) || `Erreur ${response.status}: ${response.statusText}`
+          : extractApiErrorMessage(errorData) || `Erreur ${response.status}: ${response.statusText}`
+        const errorMessage = humanizeError(rawMessage)
         showError(errorMessage)
         return { success: false, error: errorMessage, status: response.status }
       }
     } catch (error) {
       clearTimeout(timeoutId)
       const err = error as Error & { name?: string }
-      const errorMessage = err.name === 'AbortError' ? 'Timeout de la requête' : err.message || 'Erreur réseau'
-      showError(`Erreur réseau: ${errorMessage}`)
+      const errorMessage = err.name === 'AbortError'
+        ? 'La requête a pris trop de temps. Veuillez réessayer.'
+        : 'Impossible de contacter le serveur. Vérifiez votre connexion.'
+      showError(errorMessage)
       return { success: false, error: errorMessage }
     }
   }

app/composables/useEntityTypes.ts

@@ -7,6 +7,7 @@
 
 import { ref, type Ref } from 'vue'
 import { useToast } from './useToast'
+import { humanizeError } from '~/shared/utils/errorMessages'
 import {
   listModelTypes,
   createModelType,
@@ -102,8 +103,8 @@ export function useEntityTypes(config: EntityTypeConfig) {
       return { success: true, data: state.types.value }
     } catch (error) {
       const err = error as Error & { message?: string }
-      const message = err?.message || 'Erreur inconnue'
-      showError(`Impossible de charger les types de ${label}: ${message}`)
+      const message = humanizeError(err?.message)
+      showError(`Impossible de charger les types de ${label}.`)
       return { success: false, error: message }
     } finally {
       state.loading.value = false
@@ -127,8 +128,9 @@ export function useEntityTypes(config: EntityTypeConfig) {
       return { success: true, data: normalized }
     } catch (error) {
       const err = error as Error & { data?: { message?: string }; message?: string }
-      const message = err?.data?.message || err?.message || 'Erreur inconnue'
-      showError(`Erreur lors de la création du type de ${label}: ${message}`)
+      const raw = err?.data?.message || err?.message
+      const message = humanizeError(raw)
+      showError(`Impossible de créer le type de ${label} : ${message}`)
       return { success: false, error: message }
     } finally {
       state.loading.value = false
@@ -152,8 +154,9 @@ export function useEntityTypes(config: EntityTypeConfig) {
       return { success: true, data: normalized }
     } catch (error) {
       const err = error as Error & { data?: { message?: string }; message?: string }
-      const message = err?.data?.message || err?.message || 'Erreur inconnue'
-      showError(`Erreur lors de la mise à jour du type de ${label}: ${message}`)
+      const raw = err?.data?.message || err?.message
+      const message = humanizeError(raw)
+      showError(`Impossible de mettre à jour le type de ${label} : ${message}`)
       return { success: false, error: message }
     } finally {
       state.loading.value = false
@@ -169,8 +172,9 @@ export function useEntityTypes(config: EntityTypeConfig) {
       return { success: true }
     } catch (error) {
       const err = error as Error & { data?: { message?: string }; message?: string }
-      const message = err?.data?.message || err?.message || 'Erreur inconnue'
-      showError(`Erreur lors de la suppression du type de ${label}: ${message}`)
+      const raw = err?.data?.message || err?.message
+      const message = humanizeError(raw)
+      showError(`Impossible de supprimer le type de ${label} : ${message}`)
       return { success: false, error: message }
     } finally {
       state.loading.value = false

app/composables/useMachineCreatePage.ts

@@ -15,6 +15,7 @@ import { usePieces } from '~/composables/usePieces'
 import { useProducts } from '~/composables/useProducts'
 import { useApi } from '~/composables/useApi'
 import { useToast } from '~/composables/useToast'
+import { humanizeError } from '~/shared/utils/errorMessages'
 import { useMachineCreateSelections } from '~/composables/useMachineCreateSelections'
 import {
   useMachineCreatePreview,
@@ -365,10 +366,10 @@ export function useMachineCreatePage() {
         clearRequirementSelections()
         await navigateTo('/machines')
       } else if (result.error) {
-        toast.showError(`Impossible de créer la machine: ${result.error}`)
+        toast.showError(`Impossible de créer la machine : ${humanizeError(result.error)}`)
       }
     } catch (error: any) {
-      toast.showError(`Erreur lors de la création: ${error.message}`)
+      toast.showError(`Impossible de créer la machine : ${humanizeError(error.message)}`)
     } finally {
       submitting.value = false
     }

app/composables/useProducts.ts

@@ -1,6 +1,7 @@
 import { ref } from 'vue'
 import { useToast } from './useToast'
 import { useApi } from './useApi'
+import { humanizeError } from '~/shared/utils/errorMessages'
 import { buildConstructeurRequestPayload, uniqueConstructeurIds } from '~/shared/constructeurUtils'
 import { useConstructeurs, type Constructeur } from './useConstructeurs'
 import { extractRelationId, normalizeRelationIds } from '~/shared/apiRelations'
@@ -168,9 +169,9 @@ export function useProducts() {
       return result as ProductListResult
     } catch (err) {
       console.error('Erreur lors du chargement des produits:', err)
-      const message = (err as Error)?.message ?? 'Erreur inconnue'
+      const message = humanizeError((err as Error)?.message)
       error.value = message
-      showError(`Impossible de charger les produits: ${message}`)
+      showError(`Impossible de charger les produits.`)
       return { success: false, error: message }
     } finally {
       loading.value = false
@@ -197,9 +198,9 @@ export function useProducts() {
       return { success: false, error: result.error }
     } catch (err) {
       console.error('Erreur lors de la création du produit:', err)
-      const message = (err as Error)?.message ?? 'Erreur inconnue'
+      const message = humanizeError((err as Error)?.message)
       error.value = message
-      showError(message)
+      showError('Impossible de créer le produit.')
       return { success: false, error: message }
     } finally {
       loading.value = false
@@ -223,9 +224,9 @@ export function useProducts() {
       return { success: false, error: result.error }
     } catch (err) {
       console.error('Erreur lors de la mise à jour du produit:', err)
-      const message = (err as Error)?.message ?? 'Erreur inconnue'
+      const message = humanizeError((err as Error)?.message)
       error.value = message
-      showError(message)
+      showError('Impossible de mettre à jour le produit.')
       return { success: false, error: message }
     } finally {
       loading.value = false
@@ -248,9 +249,9 @@ export function useProducts() {
       return { success: false, error: result.error }
     } catch (err) {
       console.error('Erreur lors de la suppression du produit:', err)
-      const message = (err as Error)?.message ?? 'Erreur inconnue'
+      const message = humanizeError((err as Error)?.message)
       error.value = message
-      showError(message)
+      showError('Impossible de supprimer le produit.')
       return { success: false, error: message }
     } finally {
       loading.value = false

app/composables/useSiteManagement.ts

@@ -2,6 +2,7 @@ import { computed, onMounted, reactive, ref, watch } from 'vue'
 import { navigateTo, useRoute } from '#imports'
 import { useSites } from '~/composables/useSites'
 import { useToast } from '~/composables/useToast'
+import { humanizeError } from '~/shared/utils/errorMessages'
 import { useDocuments } from '~/composables/useDocuments'
 import { useConfirm } from '~/composables/useConfirm'
 import { getFileIcon } from '~/utils/fileIcons'
@@ -274,10 +275,10 @@ export function useSiteManagement() {
       if (result.success) {
         showSuccess(`Site "${site.name}" supprimé avec succès`)
       } else {
-        showError(`Erreur lors de la suppression: ${result.error}`)
+        showError(`Impossible de supprimer le site : ${humanizeError(result.error)}`)
       }
     } catch (error: any) {
-      showError(`Erreur lors de la suppression: ${error.message}`)
+      showError(`Impossible de supprimer le site : ${humanizeError(error.message)}`)
     }
   }
 

app/composables/useToast.ts

@@ -13,8 +13,19 @@ const toasts = ref<Toast[]>([])
 const MAX_TOASTS = 3
 let nextId = 1
 
+// Anti-doublon : ignore un toast identique affiché dans les 2 dernières secondes
+const recentMessages = new Map<string, number>()
+const DEDUP_WINDOW = 2000
+
 export function useToast() {
   const showToast = (message: string, type: ToastType = 'info', duration = 3500): number => {
+    const dedupKey = `${type}::${message}`
+    const lastShown = recentMessages.get(dedupKey)
+    if (lastShown && Date.now() - lastShown < DEDUP_WINDOW) {
+      return -1
+    }
+    recentMessages.set(dedupKey, Date.now())
+
     const id = nextId++
     const toast: Toast = {
       id,