cozy-ui
cozy-ui copied to clipboard
evolution : arborescence cozy-ui
Constats
Nous avons différents niveaux de composants dans cozy-ui :
- composant Mui exporté tel que
- composant bas niveau (type atome)
- composant legacy qui ont leur pendant côté Mui
- composant deprecated
- composant très haut niveau, métier (Viewer, Contactlist ...)
Objectifs
Séparer les fichiers afin de les ordonner. Pourquoi ?
- pour coller un peu plus à l'approche Mui en offrant la possibilité de faire des imports plus simple / explicite
- pour arranger un peu mieux les choses dans cozy-ui afin d'offir une meilleure lisibilité aux dev en
- isolant le legacy
- isolant le deprecated
- isolant les meta composants
Arborescences cozy-ui
- Renommer /react en /src
- Puis déplacer dans des sous-dossiers selon afinités :
- src/hooks
- src/utils => src/base ?
- src/helpers => src/base ?
- src/components/legacy : composant custom sans Mui mais qui existe dans Mui => OBJECTIF LE SUPPRIMER
- src/components/extra : Viewer, Dialog, ContactList, Viewer, BottomSheet, Paywall
- src/components/deprecated : Menu, Radio etc. => OBJECTIF LE SUPPRIMER
- src/components/core : Badge, button, Avatar, tout le reste dont les deprecated qui sont deja la
- composants legacy avec du style legacy/via une lib MAIS qui existent pas dans mui (PushButtonClient, PieChart)
- composants customs basé sur mui (Banner)
- reexport mui
- surcharge mui
Côté NPM et import dans les applications
- Remplacer le dossier
transpiled/react
par le dossier correspondant à l'import- src/components/core => /dist/core
- src/components/legacy => /dist/legacy
- src/components/deprecated => /dist/deprecated
- src/components/extra=> /dist/extra
- src/hooks => /dist/hooks
- transpiled/react/stylesheet.css => dist/components.min.css
On aurait donc par exemple import Component from 'cozy-ui/transpiled/react/Component
qui deviendrait import Component from cozy-ui/core/Component
Tasks
Dans le repo
- [ ] Déplacer les composants du dossier /react dans src/components/core
- [ ] Déplacer les composants du dossier /react dans src/components/legacy
- [ ] Déplacer les composants du dossier /react dans src/components/deprecated
- [ ] Déplacer les composants du dossier /react dans src/components/extra
- [ ] Déplacer les composants du dossier /react dans src/hooks
- [ ] Déplacer les composants du dossier /react/utils dans src/base ?
- [ ] Déplacer les composants du dossier /react/helpers dans src/base ?
Dans le package NPM
- [ ] Changer le dossier de destination de cozy-ui/transpiled/react/stylesheet.css => cozy-ui/dist/components.min.css
- [ ] Builder les composants src/components/core dans /core
- [ ] Builder les composants src/components/legacy dans /legacy
- [ ] etc.
Travail collaboratif en atelier avec @zatteo et @cballevre à la dernière réunion d'équipe. @Crash-- Qu'en penses-tu ?
Première PR afin de trier les composants dans la doc : https://github.com/cozy/cozy-ui/pull/2461
PR qui déplace les composants dépréciés dans /deprecated
https://github.com/cozy/cozy-ui/pull/2464
PR qui consiste à déplacer les composants du dossier MuiCozyTheme https://github.com/cozy/cozy-ui/pull/2465
PR de déplacement des providers dans un dossier providers
https://github.com/cozy/cozy-ui/pull/2501