Au cours de ce stage, trois missions m'ont été confiées sur le logiciel Data Inventory au cours des sprints n°21 et n°22. La technologie d'Inventory est React et je travaille sous l'éditeur VSCode. Voici ci-dessous, un descriptif des objectifs pour les besoins du produit Data Inventory.

L'objectif de ce premier ticket est de changer la couleur du Trust Score Shield. Ce Trust Score est présent dans divers composants React d'Inventory. Pour cela, j'ai utilisé un design tokens. Les design tokens sont des constantes (couleurs, marge, taille...) utilisées par les composants comme le Trust Score par exemple. Ils proviennent du Design System de Talend.
Lien GitHub du package.


Le Design System est une récente librairie open source permettant de partager et de documenter des composants React. Le but est que les développeurs puissent collaborer ensemble via cette librairie. Elle est développée et maintenue par l’équipe Design System de Talend. Design System

Une fois les composants retrouvés, j'ai remplacé l'ancienne couleur en important ce token dans les fichiers .scss correspondants.

Au cours de ce sprint, une demande d'évolution sur ce ticket a été demandée. Les composants du Trust Score présent à divers endroits de Data Inventory avaient des noms et des propriétés différentes : TrustScoreBadge, TrustScoreIcon et TrustScoreTile. L'objectif était de remplacer tous les composants par le TrustScoreBadge et d'adapter ses propriétés afin qu'il s'affiche dans le format exact. Cela a permis d'alléger et d'optimiser davantage le code.

L'objectif de ce second ticket consiste à remplacer un ancien composant switch par un nouveau plus lisible et compréhensible à la lecture. Ce composant permet de filtrer la recherche entre deux états pour une liste de jeux de données. Il sera une nouvelle fois importé depuis la librairie Design System de Talend.

Une fois l'emplacement de l'ancien composant trouvé, j'ai utilisé Storybook afin de pouvoir tester individuellement les changements opérés.

L'objectif de ce troisième ticket était d'améliorer le style du composant QualityBar et d'utiliser les nouvelles couleurs provenant du Design tokens. Comme demandé, je me suis assurée que le code utilise le même composant partout dans l'application afin d'éviter la duplication.