fix(cropping): label color and back (#229)

AxaFrance · Apr 26, 2022 · a335304 · a335304
1 parent 933f1b0
commit a335304
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/src/Ml.Cli.WebApp/ClientApp/src/Toolkit/BoundingBox/Cropping.container.js b/src/Ml.Cli.WebApp/ClientApp/src/Toolkit/BoundingBox/Cropping.container.js
@@ -49,9 +49,9 @@ const prevStateWithRatioImage = (previousShapes, newImage, previousImageWidth, p
 const CroppingContainer = ({ labels, url, onSubmit, expectedOutput = [] }) => {
   const labelsWithColor = labels.map((label, index) => {
     return {
-      id: index.toString(),
+      id: label.id || index.toString(),
       label: label.name,
-      color: '#' + stringToRGB(index + label.name),
+      color: label.color || '#' + stringToRGB(index + label.name),
     };
   });
 
@@ -92,7 +92,7 @@ const CroppingContainer = ({ labels, url, onSubmit, expectedOutput = [] }) => {
     const currentLabelId = labelsWithColor[0].id;
     if (image) {
       const initialShapes = expectedOutput ? expectedOutput.labels.boundingBoxes.map(e => {
-        const label = labels.find(l => l.name === e.label);
+        const label = labelsWithColor.find(l => l.label === e.label);
         return {
           begin: { x: e.left, y: e.top },
           end: { x: e.left + e.width, y: e.top + e.height },

diff --git a/src/Ml.Cli.WebApp/ClientApp/src/Toolkit/BoundingBox/Labels.js b/src/Ml.Cli.WebApp/ClientApp/src/Toolkit/BoundingBox/Labels.js
@@ -70,7 +70,7 @@ const Labels = ({ setState, state, labels }) => {
             <button
               key={index}
               title={index + 1 <= shortcuts.length ? `Raccourci : alt + ${index + 1}` : 'Pas de raccourci'}
-              className={state.currentLabelId === index.toString() ? 'labels-button-current' : 'labels-button'}
+              className={state.currentLabelId === index.toString() || state.currentLabelId === label.id ? 'labels-button-current' : 'labels-button'}
               onClick={() => selectLabel(label)}>
               <div className="labels-color" style={{ backgroundColor: label.color }} />
               <span>{label.label}</span>