chore: bump version to v0.1.50

## Contexte
Ticket Lesstime : [#49](https://lesstime.malio.fr/tasks/460) — premier ticket front du M0 (Gestion des catégories).
Suit la chaîne back ERP-43..48 mergée sur develop.

## Contenu first draft (Claude Code)
- Page Nuxt `/admin/categories` (`MalioDataTable` + bouton `+ Ajouter`)
- Composant `<CategoryDrawer>` : modes création / consultation / édition, transition auto view → edit à la première modification, validation client miroir RG-1.02 (name requis) / RG-1.04 (longueur 2-120) / RG-1.05 (type requis), mapping erreurs 409 (doublon) et 422 (violations)
- Composant `<CategoryDeleteModal>` : confirmation suppression (soft delete RG-1.12)
- Types TS `Category`, `CategoryType`, `User`
- i18n `admin.categories.*` ajouté dans `fr.json`
- Fix latent en passant : ajout de `'categories'` à `AdminLinkSlug` du Page Object e2e (oublié lors d'ERP-47 quand l'item sidebar a été ajouté)

## Décisions marquantes
- Logique `fetch` inline dans `categories.vue` (sera extraite en composables `useCategoriesAdmin` + `useCategoryForm` au ticket ERP-50 / 0.8)
- Drawer dans composant séparé pour réutilisabilité
- Aucun état de tableau persisté dans l'URL (règle ABSOLUE n°6)
- Tous les composants formulaires sont `Malio*` (`MalioDataTable`, `MalioInputText`, `MalioSelect`, `MalioButton`, `MalioDrawer`)

## Polish à venir (Tristan)
Tristan testera en navigateur et peaufinera : UX, classes Tailwind, animations, icônes, wording de toasts.
Les commits de polish suivront sur la même branche.

## Tests
- `npx nuxi typecheck` : net 0 nouvelle erreur (mêmes erreurs pré-existantes que sur `develop`, infrastructure auto-import) + 1 latente corrigée (AdminLinkSlug)
- `make nuxt-test` : 43/43 passent (0 régression)
- Tests manuels navigateur : voir cahier de test du ticket Lesstime #49

## Note pre-commit hook
Le hook a remonté un échec PHPUnit pré-existant sur `develop` (`CategoryDeleteTest::testPatchOnSoftDeletedReturns404` → 401 au lieu de 404, JWT non initialisé en test runner). Aucun PHP touché dans cette MR. Commit avec `--no-verify` autorisé par Tristan.

## Reviewer suggéré
Matthieu (back ↔ front + permissions).

---------

Co-authored-by: Matthieu <mtholot19@gmail.com>
Reviewed-on: #22
Co-authored-by: tristan <tristan@yuno.malio.fr>
Co-committed-by: tristan <tristan@yuno.malio.fr>

config/version.yaml

@@ -1,2 +1,2 @@
 parameters:
-    app.version: '0.1.49'
+    app.version: '0.1.50'

frontend/modules/catalog/components/CategoryDrawer.vue

@@ -7,7 +7,7 @@
         @update:model-value="emit('update:modelValue', $event)"
     >
         <template #header>
-            <h2 class="text-[24px] font-bold">
+            <h2 class="text-2xl font-bold">
                 {{ headerLabel }}
             </h2>
         </template>
@@ -16,30 +16,29 @@
             <!-- Nom (RG-1.02 obligatoire / RG-1.04 longueur 2-120 apres trim).
                  Erreur miroir client + erreurs server-side (422) mappees sur ce champ. -->
             <MalioInputText
-                v-model="form.name.value"
+                v-model="form.name"
                 :label="t('admin.categories.form.name')"
                 input-class="w-full"
                 :max-length="120"
-                :error="form.errors.value.name"
+                :error="errors.name"
                 required
             />
 
             <!-- Type (RG-1.05 obligatoire). MalioSelect porte la valeur en
-                 number (categoryType id) ; conversion en IRI au moment du save
+                 number (categoryType id) ; conversion en IRI au moment du save. -->
-                 par le composable useCategoryForm. -->
             <MalioSelect
-                v-model="form.categoryTypeId.value"
+                v-model="form.categoryTypeId"
-                :options="typeOptions"
+                :options="categoryTypeOptions"
                 :label="t('admin.categories.form.type')"
                 :empty-option-label="t('admin.categories.form.typePlaceholder')"
-                :error="form.errors.value.categoryType"
+                :error="errors.categoryType"
                 :disabled="loadingTypes"
             />
 
             <!-- Erreur transverse (typiquement reseau / 5xx) — separe des
                  erreurs de validation par champ. -->
-            <p v-if="form.errors.value._global" class="text-sm text-red-600">
+            <p v-if="errors._global" class="text-sm text-red-600">
-                {{ form.errors.value._global }}
+                {{ errors._global }}
             </p>
         </form>
 
@@ -67,7 +66,7 @@
                 :label="t('common.save')"
                 variant="primary"
                 button-class="w-[150px]"
-                :disabled="form.submitting.value || loadingTypes"
+                :disabled="saving || loadingTypes"
                 @click="handleSave"
             />
         </template>
@@ -75,14 +74,12 @@
 </template>
 
 <script setup lang="ts">
-import type { Category } from '~/modules/catalog/types/category'
+import type { Category, CategoryType } from '~/modules/catalog/types/category'
+import type { HydraCollection } from '~/shared/utils/api'
 
 const { t } = useI18n()
+const api = useApi()
 const { can } = usePermissions()
-const { types, loadingTypes, fetchTypes } = useCategoriesAdmin()
-// Instance dediee de form pour ce drawer — state isole (cf. useCategoryForm
-// n'est pas singleton, contrairement a useCategoriesAdmin).
-const form = useCategoryForm()
 
 const props = defineProps<{
     modelValue: boolean
@@ -96,20 +93,56 @@ const emit = defineEmits<{
 }>()
 
 /**
- * Mode du drawer (dérivé du composable `useCategoryForm`) :
+ * Mode du drawer :
  *  - 'create' : pas de category prop, formulaire vide, POST au save.
  *  - 'view'   : category prop set, formulaire pre-rempli, save MASQUE
  *               jusqu'a ce que l'utilisateur modifie un champ.
  *  - 'edit'   : category prop set et formulaire « dirty » (au moins un
  *               champ different de l'original), PATCH au save.
+ *
+ * La bascule view → edit est automatique des qu'un champ change (cf. watch
+ * sur form). Le label du header suit le mode courant.
  */
 type DrawerMode = 'create' | 'view' | 'edit'
 
+const saving = ref(false)
+const loadingTypes = ref(false)
+const categoryTypes = ref<CategoryType[]>([])
+
+const form = ref({
+    name: '',
+    categoryTypeId: null as number | null,
+})
+
+// Snapshot des valeurs initiales pour detecter le « dirty » (view → edit).
+const initial = ref({
+    name: '',
+    categoryTypeId: null as number | null,
+})
+
+// Erreurs par champ + erreur transverse globale. Pattern propre pour mapper
+// les violations 422 sur les MalioInputText / MalioSelect.
+const errors = ref<{
+    name: string
+    categoryType: string
+    _global: string
+}>({
+    name: '',
+    categoryType: '',
+    _global: '',
+})
+
 const isCreateMode = computed(() => props.category === null)
 
+const isDirty = computed(
+    () =>
+        form.value.name !== initial.value.name
+        || form.value.categoryTypeId !== initial.value.categoryTypeId,
+)
+
 const mode = computed<DrawerMode>(() => {
     if (isCreateMode.value) return 'create'
-    return form.isDirty.value ? 'edit' : 'view'
+    return isDirty.value ? 'edit' : 'view'
 })
 
 const headerLabel = computed(() => {
@@ -131,48 +164,207 @@ const canShowSave = computed(
     () => mode.value === 'create' || mode.value === 'edit',
 )
 
-const typeOptions = computed(() =>
+const categoryTypeOptions = computed(() =>
-    types.value.map(ct => ({
+    categoryTypes.value.map(ct => ({
         label: ct.label,
         value: ct.id,
     })),
 )
 
-// Re-initialise le form quand la categorie selectionnee change (clic sur une
+/**
-// autre ligne sans fermer le drawer entre-temps).
+ * Charge le referentiel CategoryType. Appele a chaque ouverture du drawer
-watch(() => props.category, (cat) => {
+ * (pas seulement au mount) pour rester a jour si un type est ajoute en
-    form.loadFrom(cat)
+ * arriere-plan. Volontairement sans toast en cas d'echec : on affiche un
-}, { immediate: true })
+ * message inline via `errors._global` pour ne pas spammer.
+ */
+async function loadCategoryTypes(): Promise<void> {
+    loadingTypes.value = true
+    try {
+        const data = await api.get<HydraCollection<CategoryType>>(
+            '/category_types',
+            { itemsPerPage: 999 },
+            { toast: false },
+        )
+        categoryTypes.value = data.member ?? []
+    } catch {
+        categoryTypes.value = []
+        errors.value._global = t('admin.categories.toast.typesLoadFailed')
+    } finally {
+        loadingTypes.value = false
+    }
+}
 
-// A chaque ouverture du drawer : reload du form + refresh des types (au cas
+/**
-// ou un type aurait ete ajoute en arriere-plan depuis le dernier fetch — pas
+ * Re-initialise le formulaire a partir de la prop `category`. Aussi appele
-// d'optimisation cache au M0, le referentiel est petit).
+ * a l'ouverture du drawer pour repartir d'un etat propre.
+ */
+function resetForm(): void {
+    errors.value = { name: '', categoryType: '', _global: '' }
+    if (props.category) {
+        form.value.name = props.category.name
+        form.value.categoryTypeId = props.category.categoryType.id
+        initial.value.name = props.category.name
+        initial.value.categoryTypeId = props.category.categoryType.id
+    } else {
+        form.value.name = ''
+        form.value.categoryTypeId = null
+        initial.value.name = ''
+        initial.value.categoryTypeId = null
+    }
+}
+
+// Re-initialiser quand la categorie selectionnee change (clic sur une autre
+// ligne sans fermer le drawer entre-temps).
+watch(() => props.category, resetForm, { immediate: true })
+
+// A chaque ouverture du drawer : reset + chargement frais des types. Pas
+// d'optimisation cache au M0 — le referentiel est petit et statique.
 watch(
     () => props.modelValue,
     (open) => {
         if (open) {
-            form.loadFrom(props.category)
+            resetForm()
-            fetchTypes()
+            loadCategoryTypes()
         }
     },
 )
 
 /**
- * Sauvegarde : delegue au composable (POST en mode create, PATCH en mode
+ * Validation client-side miroir des RG back. Renvoie true si tout passe et
- * edit). Le toast succes + mapping erreur 409/422 est gere par le composable.
+ * peuple `errors` sinon. Le serveur valide aussi (defense en profondeur) ;
- * En cas de succes, on ferme le drawer et on previent le parent pour qu'il
+ * la validation client sert juste a eviter l'aller-retour evitable.
- * refresh la liste.
+ */
+function validate(): boolean {
+    errors.value = { name: '', categoryType: '', _global: '' }
+    const trimmedName = form.value.name.trim()
+
+    // RG-1.02 — name obligatoire (vide / whitespace-only).
+    if (trimmedName === '') {
+        errors.value.name = t('admin.categories.validation.nameRequired')
+    } else if (trimmedName.length < 2 || trimmedName.length > 120) {
+        // RG-1.04 — longueur 2-120 apres trim.
+        errors.value.name = t('admin.categories.validation.nameLength')
+    }
+
+    // RG-1.05 — categoryType obligatoire.
+    if (form.value.categoryTypeId === null) {
+        errors.value.categoryType = t('admin.categories.validation.typeRequired')
+    }
+
+    return errors.value.name === '' && errors.value.categoryType === ''
+}
+
+/**
+ * Mappe une reponse 422 d'API Platform sur le state `errors`. API Platform 4
+ * retourne soit `violations: [{ propertyPath, message }]` soit
+ * `hydra:violations` selon la negociation de format.
+ */
+function mapServerViolations(data: unknown): boolean {
+    if (!data || typeof data !== 'object') return false
+    const record = data as Record<string, unknown>
+    const rawViolations = record.violations ?? record['hydra:violations']
+    if (!Array.isArray(rawViolations)) return false
+
+    let mapped = false
+    for (const v of rawViolations) {
+        if (!v || typeof v !== 'object') continue
+        const violation = v as Record<string, unknown>
+        const path = String(violation.propertyPath ?? '')
+        const message = String(violation.message ?? '')
+        if (path === 'name') {
+            errors.value.name = message
+            mapped = true
+        } else if (path === 'categoryType') {
+            errors.value.categoryType = message
+            mapped = true
+        }
+    }
+    return mapped
+}
+
+/**
+ * Extrait un message d'erreur HTTP au format API Platform / Hydra.
+ */
+function extractErrorMessage(data: unknown): string {
+    if (!data || typeof data !== 'object') return ''
+    const record = data as Record<string, unknown>
+    return (
+        (record['hydra:description'] as string)
+        ?? (record.detail as string)
+        ?? (record.description as string)
+        ?? ''
+    )
+}
+
+/**
+ * Sauvegarde la categorie (POST en mode create, PATCH en mode edit).
+ * Trim cote client (miroir RG-1.03), conversion ID → IRI pour categoryType,
+ * mapping des erreurs server.
  */
 async function handleSave(): Promise<void> {
-    let result: Category | null = null
+    if (!validate()) return
-    if (mode.value === 'create') {
+    saving.value = true
-        result = await form.submitCreate()
+    errors.value._global = ''
-    } else if (mode.value === 'edit' && props.category) {
+
-        result = await form.submitUpdate(props.category.id)
+    // Trim cote client (miroir RG-1.03). Le serveur retrim de toute facon.
+    const payload = {
+        name: form.value.name.trim(),
+        categoryType: `/api/category_types/${form.value.categoryTypeId}`,
     }
-    if (result) {
+
+    try {
+        if (mode.value === 'create') {
+            await api.post('/categories', payload, {
+                toastSuccessMessage: t('admin.categories.toast.created'),
+                toast: false, // gestion fine des erreurs ci-dessous
+            })
+        } else if (mode.value === 'edit' && props.category) {
+            await api.patch(`/categories/${props.category.id}`, payload, {
+                toastSuccessMessage: t('admin.categories.toast.updated'),
+                toast: false,
+            })
+        }
+
+        // Succes : toast manuel (car on a desactive le toast du composable
+        // pour gerer finement les erreurs) + propagation au parent.
+        useToast().success({
+            title: 'Succès',
+            message:
+                mode.value === 'create'
+                    ? t('admin.categories.toast.created')
+                    : t('admin.categories.toast.updated'),
+        })
         emit('saved')
         emit('update:modelValue', false)
+    } catch (err: unknown) {
+        const error = err as { response?: { status?: number, _data?: unknown } }
+        const status = error?.response?.status
+        const data = error?.response?._data
+
+        if (status === 409) {
+            // RG-1.07 — doublon (name, categoryType). Toast custom + erreur
+            // mappee sur le champ name (origine du conflit).
+            const duplicateMessage = t('admin.categories.toast.duplicate', {
+                name: payload.name,
+            })
+            errors.value.name = duplicateMessage
+            useToast().error({
+                title: 'Erreur',
+                message: duplicateMessage,
+            })
+        } else if (status === 422 && mapServerViolations(data)) {
+            // Violations mappees sur les champs concernes — pas de toast,
+            // l'utilisateur voit l'erreur directement sous le champ.
+        } else {
+            const extracted = extractErrorMessage(data)
+            errors.value._global = extracted || 'Une erreur est survenue.'
+            useToast().error({
+                title: 'Erreur',
+                message: errors.value._global,
+            })
+        }
+    } finally {
+        saving.value = false
     }
 }
 </script>

frontend/modules/catalog/composables/useCategoriesAdmin.ts

@@ -1,134 +0,0 @@
-/**
- * Composable d'administration des categories (M0 — Gestion des categories).
- *
- * Centralise le chargement et le state des deux ressources lues par la page
- * `/admin/categories` : la liste des categories et le referentiel
- * CategoryType (utilise dans le select du drawer).
- *
- * State singleton au niveau module (meme convention que `useSidebar` /
- * `useModules` / `useAuditLog`) : reset automatique au logout via
- * `onAuthSessionCleared` (cf. CLAUDE.md regle frontend.md : « composables
- * avec state singleton doivent etre reinitialises au logout »), et reset
- * explicite expose via `resetCategoriesAdmin()` appele depuis
- * `modules/core/pages/logout.vue`.
- */
-import { ref } from 'vue'
-import type { Category, CategoryType } from '~/modules/catalog/types/category'
-import type { HydraCollection } from '~/shared/utils/api'
-import { onAuthSessionCleared } from '~/shared/stores/auth'
-
-/**
- * Dette M0 : pas de pagination serveur sur les ressources Catalog (volumetrie
- * cible ≤ 300). On force une page geante via `itemsPerPage` pour recuperer
- * toute la liste en un coup. A basculer en pagination serveur quand la
- * volumetrie reelle depassera ce plafond — meme pattern que sites.vue.
- */
-const HYDRA_NO_PAGINATION = 999
-
-// State singleton — partage entre tous les composants qui appellent le
-// composable dans la meme session. Les refs sont declarees au niveau module
-// (pas dans la fonction `useCategoriesAdmin()`) pour eviter qu'une nouvelle
-// instance soit creee a chaque appel.
-const categories = ref<Category[]>([])
-const types = ref<CategoryType[]>([])
-const loading = ref(false)
-const loadingTypes = ref(false)
-const error = ref<string | null>(null)
-
-function resetCategoriesAdminState(): void {
-    categories.value = []
-    types.value = []
-    loading.value = false
-    loadingTypes.value = false
-    error.value = null
-}
-
-// Auto-enregistrement singleton : purge le state sur 401/clearSession pour
-// eviter qu'un user suivant (connecte sur le meme onglet) voie l'etat de
-// l'ancien. Le logout volontaire (page logout.vue) appelle directement
-// `resetCategoriesAdmin()` ci-dessous.
-onAuthSessionCleared(resetCategoriesAdminState)
-
-export function useCategoriesAdmin() {
-    const api = useApi()
-
-    /**
-     * Charge la liste des categories. Le serveur exclut les soft-deleted par
-     * defaut (RG-1.08) et trie par name ASC (RG-1.10). Pas de pagination
-     * serveur (volumetrie ≤ 300, pagination front via MalioDataTable).
-     *
-     * `includeDeleted=true` permet a un user avec `catalog.categories.manage`
-     * de voir les soft-deleted (RG-1.09) — au M0 la page n'utilise pas cette
-     * option mais on l'expose pour la suite (corbeille future).
-     *
-     * Swallow volontaire : un 403 (user sans permission view) ne doit pas
-     * toaster — la sidebar masque deja l'entree pour ces users, on tombe sur
-     * la page seulement par URL directe et on affiche un tableau vide propre.
-     */
-    async function fetchAll(includeDeleted = false): Promise<void> {
-        loading.value = true
-        error.value = null
-        try {
-            const query: Record<string, unknown> = { itemsPerPage: HYDRA_NO_PAGINATION }
-            if (includeDeleted) {
-                query.includeDeleted = 'true'
-            }
-            const data = await api.get<HydraCollection<Category>>(
-                '/categories',
-                query,
-                { toast: false },
-            )
-            categories.value = data.member ?? []
-        } catch (e) {
-            categories.value = []
-            error.value = (e as Error)?.message ?? 'Erreur de chargement'
-        } finally {
-            loading.value = false
-        }
-    }
-
-    /**
-     * Charge le referentiel CategoryType (lecture seule, RG-1.06). Appele a
-     * l'ouverture de la page admin pour que le select du drawer ait deja les
-     * options pretes au moment de la creation/edition.
-     *
-     * Toast desactive : on stocke l'erreur dans `error` plutot que de
-     * spammer un toast — le drawer affichera l'erreur inline s'il y a lieu.
-     */
-    async function fetchTypes(): Promise<void> {
-        loadingTypes.value = true
-        try {
-            const data = await api.get<HydraCollection<CategoryType>>(
-                '/category_types',
-                { itemsPerPage: HYDRA_NO_PAGINATION },
-                { toast: false },
-            )
-            types.value = data.member ?? []
-        } catch (e) {
-            types.value = []
-            error.value = (e as Error)?.message ?? 'Erreur de chargement des types'
-        } finally {
-            loadingTypes.value = false
-        }
-    }
-
-    /**
-     * Reset explicite — appele depuis `logout.vue` apres `auth.logout()` pour
-     * garantir que la prochaine session reparte sur un state propre meme si
-     * `clearSession()` n'a pas ete declenche (cas logout volontaire).
-     */
-    function resetCategoriesAdmin(): void {
-        resetCategoriesAdminState()
-    }
-
-    return {
-        categories,
-        types,
-        loading,
-        loadingTypes,
-        error,
-        fetchAll,
-        fetchTypes,
-        resetCategoriesAdmin,
-    }
-}

frontend/modules/catalog/composables/useCategoryForm.ts

@@ -1,319 +0,0 @@
-/**
- * Composable de formulaire categorie (M0 — Gestion des categories).
- *
- * Centralise la logique de validation client + appels API (POST / PATCH /
- * DELETE) du drawer de creation/edition. Contrairement a
- * `useCategoriesAdmin` qui porte un state singleton partage entre composants,
- * ce composable est instancie par formulaire (les refs vivent dans la
- * fonction `useCategoryForm()`) — chaque drawer ouvert a son propre state
- * isole.
- *
- * Validations client en miroir des regles back (RG-1.02 / RG-1.04 / RG-1.05) :
- * elles servent juste a eviter l'aller-retour reseau evitable. Le serveur
- * revalide toujours (defense en profondeur).
- *
- * Mapping erreurs API :
- *   - 409 (RG-1.07 doublon) → toast + erreur sur le champ `name`
- *   - 422 (violations API Platform) → mapping sur les champs concernes
- *   - autre → erreur globale `_global` + toast generique
- */
-import { computed, ref } from 'vue'
-import type { Category } from '~/modules/catalog/types/category'
-import { extractApiErrorMessage, extractApiViolations } from '~/shared/utils/api'
-
-/**
- * Erreur HTTP capturee par ofetch. On expose juste les champs utilises ici
- * (status et payload data) pour eviter de typer toute la lib.
- */
-interface ApiFetchError {
-    response?: {
-        status?: number
-        _data?: unknown
-    }
-}
-
-export function useCategoryForm() {
-    const api = useApi()
-    const { t } = useI18n()
-    const toast = useToast()
-
-    // State local du formulaire — pas singleton, chaque appel a useCategoryForm
-    // cree son propre state (cohérent avec le pattern « un drawer = un form »).
-    const name = ref('')
-    const categoryTypeId = ref<number | null>(null)
-
-    // Snapshot des valeurs initiales : sert a calculer `isDirty` pour le
-    // pattern view → edit du drawer (le bouton Enregistrer reste masque tant
-    // que rien n'a change en mode consultation).
-    const initialName = ref('')
-    const initialCategoryTypeId = ref<number | null>(null)
-
-    const errors = ref<{
-        name: string
-        categoryType: string
-        _global: string
-    }>({
-        name: '',
-        categoryType: '',
-        _global: '',
-    })
-
-    const submitting = ref(false)
-
-    const isDirty = computed(
-        () =>
-            name.value !== initialName.value
-            || categoryTypeId.value !== initialCategoryTypeId.value,
-    )
-
-    /**
-     * Pre-remplit le formulaire a partir d'une categorie existante (mode
-     * consultation/edition) ou vide (mode creation). Reinitialise les
-     * erreurs et le snapshot initial pour repartir d'un etat propre.
-     */
-    function loadFrom(category: Category | null): void {
-        errors.value = { name: '', categoryType: '', _global: '' }
-        if (category) {
-            name.value = category.name
-            categoryTypeId.value = category.categoryType.id
-            initialName.value = category.name
-            initialCategoryTypeId.value = category.categoryType.id
-        } else {
-            name.value = ''
-            categoryTypeId.value = null
-            initialName.value = ''
-            initialCategoryTypeId.value = null
-        }
-    }
-
-    /**
-     * Validation client miroir des RG back. Renvoie true si tout passe et
-     * peuple `errors` sinon. Le trim est applique cote client (miroir RG-1.03)
-     * mais le serveur retrim de toute facon — pas de risque de divergence.
-     */
-    function validate(): boolean {
-        errors.value = { name: '', categoryType: '', _global: '' }
-        const trimmedName = name.value.trim()
-
-        // RG-1.02 — name obligatoire (vide / whitespace-only).
-        if (trimmedName === '') {
-            errors.value.name = t('admin.categories.validation.nameRequired')
-        } else if (trimmedName.length < 2 || trimmedName.length > 120) {
-            // RG-1.04 — longueur 2-120 apres trim.
-            errors.value.name = t('admin.categories.validation.nameLength')
-        }
-
-        // RG-1.05 — categoryType obligatoire.
-        if (categoryTypeId.value === null) {
-            errors.value.categoryType = t('admin.categories.validation.typeRequired')
-        }
-
-        return errors.value.name === '' && errors.value.categoryType === ''
-    }
-
-    /**
-     * Construit le payload POST a partir du state. Le `categoryType` est
-     * envoye en IRI Hydra (`/api/category_types/{id}`) — convention API
-     * Platform pour referencer une ressource liee. Retourne un object literal
-     * compatible avec `AnyObject` de `useApi()` (un type nomme strict comme
-     * `CategoryCreateInput` ne serait pas assignable a `Record<string, unknown>`
-     * en TS strict).
-     */
-    function buildCreatePayload(): Record<string, unknown> {
-        return {
-            name: name.value.trim(),
-            categoryType: `/api/category_types/${categoryTypeId.value}`,
-        }
-    }
-
-    /**
-     * Mappe les violations 422 d'API Platform sur les champs du formulaire.
-     * Renvoie true des qu'au moins une violation a ete posee — false sinon
-     * (payload sans violations exploitables, ou tous les `propertyPath` hors
-     * du mapping connu). L'extraction Hydra (`violations` / `hydra:violations`)
-     * est centralisee dans `shared/utils/api.ts` pour rester reutilisable
-     * sur les futurs drawers de formulaire.
-     */
-    function mapServerViolations(data: unknown): boolean {
-        const violations = extractApiViolations(data)
-        if (violations.length === 0) return false
-        let mapped = false
-        for (const v of violations) {
-            if (v.propertyPath === 'name') {
-                errors.value.name = v.message
-                mapped = true
-            } else if (v.propertyPath === 'categoryType') {
-                errors.value.categoryType = v.message
-                mapped = true
-            }
-        }
-        return mapped
-    }
-
-    /**
-     * Traite une erreur API : mappe selon le status, declenche les toasts
-     * appropries. Centralise la logique entre create/update.
-     *
-     * - 409 (RG-1.07) : doublon — toast + errors.name avec libelle qui inclut
-     *   le nom soumis.
-     * - 422 : tentative de mapping fin via les violations API Platform — si au
-     *   moins une violation est mappee, pas de toast (erreur affichee inline
-     *   sous le champ concerne).
-     * - autre : message global + toast generique. Le toast natif d'useApi
-     *   est desactive (`toast: false`) pour permettre ce mapping fin ; il faut
-     *   donc en re-emettre un manuellement ici, sinon une 500 reste silencieuse.
-     *
-     * Retourne true si l'erreur a ete reconnue et traitee (409/422 mappes),
-     * false sinon (fallback generique).
-     */
-    function handleApiError(e: unknown, attemptedName: string): boolean {
-        const status = (e as ApiFetchError)?.response?.status
-        const data = (e as ApiFetchError)?.response?._data
-
-        if (status === 409) {
-            const duplicateMessage = t('admin.categories.toast.duplicate', {
-                name: attemptedName,
-            })
-            errors.value.name = duplicateMessage
-            toast.error({
-                title: 'Erreur',
-                message: duplicateMessage,
-            })
-            return true
-        }
-
-        if (status === 422 && mapServerViolations(data)) {
-            return true
-        }
-
-        const extracted = extractApiErrorMessage(data)
-        errors.value._global = extracted || 'Une erreur est survenue.'
-        toast.error({
-            title: 'Erreur',
-            message: errors.value._global,
-        })
-        return false
-    }
-
-    /**
-     * POST /api/categories. Renvoie la categorie creee, ou `null` si la
-     * validation client a echoue ou si le serveur a renvoye une erreur. Le
-     * caller (drawer) decide quoi faire en fonction (fermer ou rester ouvert).
-     */
-    async function submitCreate(): Promise<Category | null> {
-        if (!validate()) return null
-        submitting.value = true
-        errors.value._global = ''
-        const payload = buildCreatePayload()
-        try {
-            const created = await api.post<Category>('/categories', payload, {
-                toast: false,
-            })
-            toast.success({
-                title: 'Succès',
-                message: t('admin.categories.toast.created'),
-            })
-            return created
-        } catch (e) {
-            handleApiError(e, String(payload.name))
-            return null
-        } finally {
-            submitting.value = false
-        }
-    }
-
-    /**
-     * PATCH /api/categories/{id}. Envoie uniquement les champs modifies pour
-     * coller a la semantique merge-patch (Content-Type pose par useApi).
-     * Renvoie la categorie mise a jour, ou `null` en cas d'echec.
-     */
-    async function submitUpdate(id: number): Promise<Category | null> {
-        if (!validate()) return null
-        submitting.value = true
-        errors.value._global = ''
-        const payload: Record<string, unknown> = {}
-        if (name.value !== initialName.value) {
-            payload.name = name.value.trim()
-        }
-        if (categoryTypeId.value !== initialCategoryTypeId.value) {
-            payload.categoryType = `/api/category_types/${categoryTypeId.value}`
-        }
-        // Garde-fou : un PATCH sans changement ne sert a rien. Theoriquement
-        // empeche par le drawer (bouton Enregistrer masque si !isDirty) mais
-        // on protege le composable contre un appel direct mal utilise.
-        if (Object.keys(payload).length === 0) {
-            submitting.value = false
-            return null
-        }
-        try {
-            const updated = await api.patch<Category>(`/categories/${id}`, payload, {
-                toast: false,
-            })
-            toast.success({
-                title: 'Succès',
-                message: t('admin.categories.toast.updated'),
-            })
-            return updated
-        } catch (e) {
-            const attemptedName = typeof payload.name === 'string'
-                ? payload.name
-                : name.value.trim()
-            handleApiError(e, attemptedName)
-            return null
-        } finally {
-            submitting.value = false
-        }
-    }
-
-    /**
-     * DELETE /api/categories/{id} → soft delete (RG-1.12). Le serveur pose
-     * `deleted_at = now()` et retourne 204. Renvoie true en cas de succes,
-     * false sinon (avec toast erreur deja affiche).
-     */
-    async function submitDelete(id: number): Promise<boolean> {
-        submitting.value = true
-        errors.value._global = ''
-        try {
-            await api.delete(`/categories/${id}`, {}, { toast: false })
-            toast.success({
-                title: 'Succès',
-                message: t('admin.categories.toast.deleted'),
-            })
-            return true
-        } catch (e) {
-            handleApiError(e, name.value)
-            return false
-        } finally {
-            submitting.value = false
-        }
-    }
-
-    /**
-     * Reset complet du formulaire — utilise par le drawer apres save ou
-     * fermeture pour ne pas garder de donnees stale entre deux ouvertures.
-     */
-    function reset(): void {
-        name.value = ''
-        categoryTypeId.value = null
-        initialName.value = ''
-        initialCategoryTypeId.value = null
-        errors.value = { name: '', categoryType: '', _global: '' }
-        submitting.value = false
-    }
-
-    return {
-        // State
-        name,
-        categoryTypeId,
-        errors,
-        submitting,
-        isDirty,
-        // Methods
-        loadFrom,
-        validate,
-        submitCreate,
-        submitUpdate,
-        submitDelete,
-        reset,
-    }
-}

frontend/modules/catalog/pages/admin/categories.vue

@@ -13,9 +13,12 @@
             </template>
         </PageHeader>
 
-        <!-- Table des categories : tri par defaut sur Nom ASC (RG-1.10).
+        <!-- Table des categories. Affichage exhaustif (volumetrie cible
-             Tri serveur applique a la requete + pagination front via
+             <= 300, cf. spec § 4.1) — tri 100% serveur via CategoryProvider
-             MalioDataTable (volumetrie cible <= 300, cf. spec § 4.1). -->
+             (name ASC, RG-1.10). La barre de pagination du MalioDataTable
+             reste cosmetique tant qu'aucun slice client n'est cable : a
+             traiter cote @malio/layer-ui le jour ou la volumetrie monte. -->
+
         <MalioDataTable
             :columns="columns"
             :items="categoryItems"
@@ -45,16 +48,18 @@
 
 <script setup lang="ts">
 import type { Category } from '~/modules/catalog/types/category'
+import type { HydraCollection } from '~/shared/utils/api'
 
 const { t } = useI18n()
+const api = useApi()
 const { can } = usePermissions()
-const { categories, fetchAll, fetchTypes } = useCategoriesAdmin()
-const { submitDelete } = useCategoryForm()
 
 useHead({ title: t('admin.categories.title') })
 
 const canManage = computed(() => can('catalog.categories.manage'))
 
+const categories = ref<Category[]>([])
+const loading = ref(false)
 const drawerOpen = ref(false)
 const selectedCategory = ref<Category | null>(null)
 const deleteModalOpen = ref(false)
@@ -85,6 +90,35 @@ function onRowClick(item: Record<string, unknown>) {
     if (category) openEditDrawer(category)
 }
 
+/**
+ * Charge la liste des categories. Le serveur exclut les soft-deleted par
+ * defaut (RG-1.08) et trie par name ASC (RG-1.10). Pas de pagination
+ * serveur (volumetrie cible <= 300) ni de slice client — toute la liste
+ * est rendue d'un coup ; la barre du MalioDataTable est donc cosmetique
+ * jusqu'a la mise a jour layer-ui (ticket ERP-70).
+ *
+ * Logique inline volontaire au M0 (decision prompt ERP-49) : extraction
+ * en composable `useCategoriesAdmin` au ticket 0.8 (ERP-50).
+ */
+async function loadCategories(): Promise<void> {
+    loading.value = true
+    try {
+        const data = await api.get<HydraCollection<Category>>(
+            '/categories',
+            { itemsPerPage: 999 },
+            { toast: false },
+        )
+        categories.value = data.member ?? []
+    } catch {
+        // Reset sur echec pour ne pas afficher de donnees stale. Pas de
+        // toast : un user sans permission view recoit 403 et voit une
+        // liste vide propre — le mecanisme de gating se fait cote sidebar.
+        categories.value = []
+    } finally {
+        loading.value = false
+    }
+}
+
 function openCreateDrawer() {
     selectedCategory.value = null
     drawerOpen.value = true
@@ -102,36 +136,32 @@ function onDeleteRequest() {
 }
 
 /**
- * Soft delete via le composable de form (qui gere toast + erreur). Refresh
+ * DELETE /api/categories/{id} → soft delete (RG-1.12). Le serveur pose
- * de la liste a la fin pour retirer la ligne. L'index unique partiel
+ * `deleted_at = now()` et retourne 204. Refresh de la liste a la fin
- * autorise une recreation ulterieure avec le meme couple (name, type) —
+ * pour retirer la ligne (l'index unique partiel autorise une recreation
- * RG-1.07.
+ * ulterieure avec le meme couple (name, type) — RG-1.07).
  */
 async function handleDelete(): Promise<void> {
     if (!categoryToDelete.value) return
     deleting.value = true
     try {
-        const ok = await submitDelete(categoryToDelete.value.id)
+        await api.delete(`/categories/${categoryToDelete.value.id}`, {}, {
-        if (ok) {
+            toastSuccessMessage: t('admin.categories.toast.deleted'),
-            deleteModalOpen.value = false
+        })
-            categoryToDelete.value = null
+        deleteModalOpen.value = false
-            drawerOpen.value = false
+        categoryToDelete.value = null
-            await fetchAll()
+        drawerOpen.value = false
-        }
+        await loadCategories()
     } finally {
         deleting.value = false
     }
 }
 
 function onCategorySaved() {
-    fetchAll()
+    loadCategories()
 }
 
-// Chargement initial des deux ressources (liste + referentiel des types).
-// Le referentiel est pre-charge ici (et pas dans le drawer) pour que le
-// select soit pret au moment ou l'utilisateur clique sur « + Ajouter ».
 onMounted(() => {
-    fetchAll()
+    loadCategories()
-    fetchTypes()
 })
 </script>

frontend/modules/core/pages/logout.vue

@@ -12,7 +12,6 @@ const { resetSidebar } = useSidebar()
 const { resetModules } = useModules()
 const { resetCurrentSite } = useCurrentSite()
 const { resetAuditLog } = useAuditLog()
-const { resetCategoriesAdmin } = useCategoriesAdmin()
 
 onMounted(async () => {
     try {
@@ -28,7 +27,6 @@ onMounted(async () => {
         resetModules()
         resetCurrentSite()
         resetAuditLog()
-        resetCategoriesAdmin()
         await navigateTo('/login')
     }
 })

frontend/shared/composables/useApi.ts

@@ -1,6 +1,5 @@
 import type { FetchOptions , FetchError } from 'ofetch'
 import { $fetch } from 'ofetch'
-import { extractApiErrorMessage } from '~/shared/utils/api'
 
 export type AnyObject = Record<string, unknown>
 
@@ -42,8 +41,24 @@ export function useApi(): ApiClient {
 
     function extractErrorMessage(error: unknown, responseData?: unknown): string {
         const data = responseData ?? (error as FetchError)?.data
-        const msg = extractApiErrorMessage(data)
+
-        if (msg) return msg
+        if (typeof data === 'string') {
+            return data
+        }
+
+        if (data && typeof data === 'object') {
+            const record = data as Record<string, unknown>
+            return (
+                (record['hydra:description'] as string) ||
+        (record.detail as string) ||
+        (record.message as string) ||
+        (record.error as string) ||
+        (record.title as string) ||
+        (record['hydra:title'] as string) ||
+        ''
+            )
+        }
+
         return (error as FetchError)?.message ?? 'Erreur inconnue.'
     }
 

frontend/shared/utils/api.ts

@@ -31,62 +31,3 @@ export interface HydraCollection<T> {
 export function extractHydraMembers<T>(collection: HydraCollection<T>): T[] {
     return collection.member ?? []
 }
-
-/**
- * Une violation de contrainte API Platform (reponse 422). Le `propertyPath`
- * pointe le champ concerne, `message` est le libelle a afficher.
- */
-export interface ApiViolation {
-    propertyPath: string
-    message: string
-}
-
-/**
- * Extrait les violations d'un payload d'erreur 422 d'API Platform 4. Supporte
- * les deux formats de negociation (`violations` ou `hydra:violations`) et
- * renvoie un tableau vide si le payload n'en contient pas d'exploitables.
- *
- * Utilise par useCategoryForm et tout futur composable de formulaire qui
- * doit mapper les violations serveur sur ses champs.
- */
-export function extractApiViolations(data: unknown): ApiViolation[] {
-    if (!data || typeof data !== 'object') return []
-    const record = data as Record<string, unknown>
-    const raw = record.violations ?? record['hydra:violations']
-    if (!Array.isArray(raw)) return []
-    const out: ApiViolation[] = []
-    for (const v of raw) {
-        if (!v || typeof v !== 'object') continue
-        const obj = v as Record<string, unknown>
-        out.push({
-            propertyPath: String(obj.propertyPath ?? ''),
-            message: String(obj.message ?? ''),
-        })
-    }
-    return out
-}
-
-/**
- * Extrait un message d'erreur lisible depuis un payload Hydra / JSON
- * d'erreur API Platform. Essaie les champs courants dans l'ordre :
- * `hydra:description` → `detail` → `description` → `message` → `error` →
- * `title` → `hydra:title`. Renvoie '' si rien d'exploitable.
- *
- * Si `data` est une string, la renvoie telle quelle (cas des erreurs
- * Symfony en text/plain ou des messages bruts).
- */
-export function extractApiErrorMessage(data: unknown): string {
-    if (typeof data === 'string') return data
-    if (!data || typeof data !== 'object') return ''
-    const record = data as Record<string, unknown>
-    return (
-        (record['hydra:description'] as string)
-        ?? (record.detail as string)
-        ?? (record.description as string)
-        ?? (record.message as string)
-        ?? (record.error as string)
-        ?? (record.title as string)
-        ?? (record['hydra:title'] as string)
-        ?? ''
-    )
-}