diff --git a/.claude/rules/frontend.md b/.claude/rules/frontend.md index 6c34164..fec9242 100644 --- a/.claude/rules/frontend.md +++ b/.claude/rules/frontend.md @@ -53,6 +53,53 @@ Tout affichage LISTE tabulaire (donnees metier paginees, CRUD admin) doit passer **Exception** : tableaux purement presentationnels non paginables (diff field/old/new, grille de comparaison, matrice RBAC d'admin, etc.) peuvent rester en `` HTML brut. +## Listes paginees (standard) — usePaginatedList obligatoire + +**Toute liste qui consomme une `GetCollection` API doit passer par `usePaginatedList`** (`frontend/shared/composables/usePaginatedList.ts`). Le composable est le pendant front de la regle ABSOLUE n°13 (« toute collection est paginee cote back ») : il consomme l'envelope Hydra (`member` / `totalItems` / `view`) et expose un etat reactif a brancher directement sur `MalioDataTable`. + +Pattern de reference : + +```ts +const { + items, + totalItems, + currentPage, + itemsPerPage, + itemsPerPageOptions, + fetch: loadList, + goToPage, + setItemsPerPage, +} = usePaginatedList({ url: '/my-resources' }) + +onMounted(loadList) +``` + +```vue + +``` + +Garanties offertes par le composable : +- Force `Accept: application/ld+json` → API Platform 4 renvoie bien `member` / `totalItems` (sans Accept, retour tableau plat sans pagination). +- Defaut 10 items/page, choix client 10 / 25 / 50, aligne sur le defaut serveur. +- Mutation `setFilters` / `setSort` / `setItemsPerPage` → retombe systematiquement en page 1. +- Cas limite « page hors borne apres filtre » : retombe automatiquement sur la derniere page valide (`tests/usePaginatedList.test.ts`). +- Etat 100 % local (refs internes a l'instance) — **jamais reflete dans l'URL**, conformement a la regle « Etat des tableaux — pas de persistance URL » ci-dessous. + +A NE PAS faire : +- Charger une collection complete via `?itemsPerPage=999` pour bypasser la pagination. Le seul cas legitime de retour complet est l'alimentation d'un `