Aller au contenu

Storybook & rangement du DS dans le paquet uimmo

Note de chantier après le point Pierre × Rémy × Hugo du 2026-08-20 (fiche). ADR proposée : 2026-08-20 designers UI Storybook hors apps (proposed).

Contexte

Le DS vit dans Figma (lib 🎨 Uimmo) et dans le code (projects/common/uimmo/ + thème projects/common/front/theme/*, monorepo brickssas/monorepo). Les composants et stories sont dispersés entre uimmo et les apps (AppInvest, PDP, Shared).

Le palier acté le 2026-08-20 : Figma reste ; les PD prennent eux-mêmes le passage maquette → Storybook ; Hugo review le code et ne relais plus l'IA. Hors-scope : brancher les apps (Investors, EF) et les API.

État actuel

Dernière mise à jour : 2026-08-20

  • Point Hugo × PD du 2026-08-20 : périmètre, review, publication Storybook et 1re PR cadrés — fiche · transcript.
  • Hugo s'occupe d'abord du plugin docs et de la publication auto du Storybook sur les PR (sans label Chromatic). Chromatic = tests CI. Railway déploie le Storybook.
  • Aucune issue Linear ouverte pour ces actions au 2026-08-20.
  • Antériorité : BRI-132 · BRI-1039 · BRI-1333.
  • [outcome non formulé].

Ce qui est cadré (ne plus rejouer)

Décision Détail Source
Hors-scope Storybook seulement. Pas d'apps, pas d'API. L947
Figma On continue Figma. 1re étape = les PD font le dernier kilomètre dans Cursor. Pas « tuer Figma ». L943
Merge PD review design entre eux. Hugo review le code. Les PD ne mergent pas. L465
Publication PR Storybook auto, sans label Chromatic. Chromatic = CI. Railway = deploy. L523
Rules Cursor Pas de rules par rôle designer. Do/don't = doc de composant. La codebase (props) prime. L557
Où travailler Local (voir le Storybook). Cloud pour planifier. Une conv = une branche, depuis develop. L320
1ers sujets Screens et modals. Éviter la nav (le centre de notifs est un mauvais 1er test). PDP a un App Layout dump. L981

Workflow PD (récap Hugo)

  1. Conversation locale, partir de develop. Mode Plan d'abord, puis Build.
  2. Lancer le Storybook (Cursor peut le faire). Itérer en local.
  3. Inspecter : lire le JSX (variant, size, color) plutôt que l'inspecteur CSS. Vérifier les tokens.
  4. Stories interactives (state), pas des maquettes mortes.
  5. Layout Storybook : composants centrés, screens fullscreen — ne pas se battre contre le layout sans le savoir.
  6. Push → PR. Assigner l'autre PD en review design. Hugo review le code. Attendre le lien Storybook de la PR.
  7. Questions → #techfront.

Rangement vers uimmo

Hugo n'a pas posé de critère formel de promotion. Consigne : regarder AppInvest, PDP et Shared, et identifier ce qui « devrait plutôt être dans Uimmo ». — L1003

1re PR attendue : prise en main, même fake — réorganisation, rangement, correctif (ex. un type de badge déjà changé dans Figma mais pas en code).

Composant Emplacement actuel Story ? Équivalent Figma Uimmo Décision Ticket
à remplir à l'inventaire

Questions encore ouvertes

Les questions 1–4 de la V0 (publication, plugin, review, apps) sont tranchées. Il reste :

  1. Découpage Rémy × Pierre — même action aux deux ; Pierre devait rappeler Rémy après le call. Sans ça, collision sur les mêmes fichiers.
  2. Format de la doc composant une fois le plugin activé (miroir des descriptions Figma ? do/don't ?).
  3. Outcome — toujours [outcome non formulé].
  4. Lien éventuel avec BRI-1368 (CI Design QA qui lit Storybook) — non évoqué dans le meeting.

Pages liées

Sources