[Mineur] Textes longs qui cassent la mise en page (username en admin, nom de fichier, surnom en DM) #159

New issue

Closed

opened 2026-10-28 10:32:31 +00:00 by asventi · 0 comments

asventi commented

2026-10-28 10:32:31 +00:00

Owner

Gravité : Mineur
Rapports QA d'origine : SECURITY_UX-17, FILES-08, FRIENDS-10

Détails des rapports

[SECURITY_UX-17] Admin > Users : un username long étire le tableau, les colonnes Rôle et Actions sont hors écran — Gravité : Mineur

Où : /admin/users (toutes tailles : 375, 768 et 1400 px)
Étapes : 1. Il existe un user de 255 caractères sans espace (autorisé par l'API : Length(1,255), créé par l'agent auth : qa_auth_uuuu…). 2. Ouvrir /admin/users en admin.
Attendu : username tronqué (ellipsis / break-all), colonnes Rôle et Actions visibles.
Obtenu : la colonne Username fait ~2000 px (DIV conteneur scrollWidth 2581 pour clientWidth 1047 à 1400 px ; en-tête « Role » à x=2414) : sans scroll horizontal manuel dans le tableau, on ne voit ni le rôle ni les actions (changer rôle / supprimer / reset mot de passe) pour aucun user.
Preuve : screens/security_ux_adm_users_1400.png, screens/security_ux_resp_mobile_adm_users.png
Cause probable : frontend/src/admin/components/AdminListUser.tsx:93 (<ListCell pp>{user.userName}</ListCell> sans truncate/max-w/break-all).

[FILES-08] Un nom de fichier long (jusqu'à 255 car. via l'API) casse la mise en page de la liste : colonnes Size/Actions hors écran — Gravité : Mineur

Où : /knowledge. Étapes : 1. POST /api/files avec un nom de 255 caractères sans espace (l'UI plafonne à 100 via maxLength, mais l'API accepte 255 ; les noms de pièces jointes de chat chat_<id>_<nom> montent aussi à 255). 2. Ouvrir /knowledge.
Attendu : nom tronqué (ellipsis), colonnes visibles. Obtenu : la ligne s'étire, l'en-tête n'affiche plus que « Name », les actions (renommer/supprimer) de TOUTES les lignes disparaissent du viewport. Preuve : screens/qa_files_12_root_weird_and_long.png.
Cause probable : frontend/src/files/components/FileItem.tsx (lien sans truncate/min-w-0).

[FRIENDS-10] Nom (surnom) long non tronqué dans la liste des messages d'un DM ; aperçu sidebar incohérent avec le titre — Gravité : Cosmétique

Où : /messages/{convId} ; sidebar "Messages"
Étapes : 1. A donne un surnom de 255 caractères à B (ou 255 "W"). 2. Ouvrir le DM A<->B.
Obtenu : la ligne d'auteur du message de B déborde horizontalement hors de l'écran (friends_11_dm_with_long_nick.png) ; le placeholder du composeur est tronqué à "Message". Par ailleurs le titre de la conversation et l'auteur des messages utilisent le surnom, mais l'aperçu du dernier message dans la sidebar et les cartes "Recent conversations" utilisent le vrai username (qa_friends_b_l56ma: B-a...) : incohérent.
Cause probable : frontend/src/chat/components/Messages/MessageRow.tsx:106 (displayName, sans truncate) vs frontend/src/friends/components/SideBarChatItem.tsx:35 et FriendsWidgets.tsx (resolveUser(...).userName).

Trouvé par une campagne de tests QA automatisés (agents Claude, Playwright) sur l'environnement de dev. Les captures citées sont locales et non jointes.

**Gravité :** Mineur **Rapports QA d'origine :** SECURITY_UX-17, FILES-08, FRIENDS-10 ## Détails des rapports <details><summary>[SECURITY_UX-17] Admin > Users : un username long étire le tableau, les colonnes Rôle et Actions sont hors écran — Gravité : Mineur</summary> - Où : `/admin/users` (toutes tailles : 375, 768 et 1400 px) - Étapes : 1. Il existe un user de 255 caractères sans espace (autorisé par l'API : `Length(1,255)`, créé par l'agent auth : `qa_auth_uuuu…`). 2. Ouvrir `/admin/users` en admin. - Attendu : username tronqué (ellipsis / `break-all`), colonnes Rôle et Actions visibles. - Obtenu : la colonne Username fait ~2000 px (`DIV` conteneur `scrollWidth 2581` pour `clientWidth 1047` à 1400 px ; en-tête « Role » à x=2414) : sans scroll horizontal manuel dans le tableau, on ne voit ni le rôle ni les actions (changer rôle / supprimer / reset mot de passe) pour aucun user. - Preuve : `screens/security_ux_adm_users_1400.png`, `screens/security_ux_resp_mobile_adm_users.png` - Cause probable : `frontend/src/admin/components/AdminListUser.tsx:93` (`<ListCell pp>{user.userName}</ListCell>` sans `truncate`/`max-w`/`break-all`). </details> <details><summary>[FILES-08] Un nom de fichier long (jusqu'à 255 car. via l'API) casse la mise en page de la liste : colonnes Size/Actions hors écran — Gravité : Mineur</summary> - Où : /knowledge. Étapes : 1. `POST /api/files` avec un nom de 255 caractères sans espace (l'UI plafonne à 100 via `maxLength`, mais l'API accepte 255 ; les noms de pièces jointes de chat `chat_<id>_<nom>` montent aussi à 255). 2. Ouvrir /knowledge. - Attendu : nom tronqué (ellipsis), colonnes visibles. Obtenu : la ligne s'étire, l'en-tête n'affiche plus que « Name », les actions (renommer/supprimer) de TOUTES les lignes disparaissent du viewport. Preuve : `screens/qa_files_12_root_weird_and_long.png`. - Cause probable : `frontend/src/files/components/FileItem.tsx` (lien sans `truncate`/`min-w-0`). </details> <details><summary>[FRIENDS-10] Nom (surnom) long non tronqué dans la liste des messages d'un DM ; aperçu sidebar incohérent avec le titre — Gravité : Cosmétique</summary> - Où : `/messages/{convId}` ; sidebar "Messages" - Étapes : 1. A donne un surnom de 255 caractères à B (ou 255 "W"). 2. Ouvrir le DM A<->B. - Obtenu : la ligne d'auteur du message de B déborde horizontalement hors de l'écran (`friends_11_dm_with_long_nick.png`) ; le placeholder du composeur est tronqué à "Message". Par ailleurs le titre de la conversation et l'auteur des messages utilisent le surnom, mais l'aperçu du dernier message dans la sidebar et les cartes "Recent conversations" utilisent le vrai username (`qa_friends_b_l56ma: B-a...`) : incohérent. - Cause probable : `frontend/src/chat/components/Messages/MessageRow.tsx:106` (`displayName`, sans truncate) vs `frontend/src/friends/components/SideBarChatItem.tsx:35` et `FriendsWidgets.tsx` (`resolveUser(...).userName`). </details> --- _Trouvé par une campagne de tests QA automatisés (agents Claude, Playwright) sur l'environnement de dev. Les captures citées sont locales et non jointes._

asventi added the

bug

groupe/ui-polish

labels

2026-10-28 10:44:23 +00:00

asventi self-assigned this

2026-10-30 17:19:09 +00:00

asventi referenced this issue from a pull request that will close it,

2026-10-30 17:34:22 +00:00

fix: accessibility (#162) and long texts breaking the layout (#159) #179

asventi closed this issue

2026-10-30 17:36:41 +00:00