mitigation transformer a la sauvegarde

src/AnnotationCreation.js

@@ -101,6 +101,8 @@ function AnnotationCreation(props) {
 
   const [shapes, setShapes] = useState([]);
   const [scale, setScale] = useState(1);
+  const [isMouseOverSave, setIsMouseOverSave] = useState(false);
+
 
   const { height, width } = VideosReferences.get(props.windowId).ref.current;
 
@@ -484,6 +486,7 @@ function AnnotationCreation(props) {
         setColorToolFromCurrentShape={setColorToolFromCurrentShape}
         updateShapes={updateShapes}
         shapes={shapes}
+        isMouseOverSave={isMouseOverSave}
       />
       <StyledForm
         onSubmit={submitForm}
@@ -527,7 +530,10 @@ function AnnotationCreation(props) {
           <Button onClick={closeCompanionWindow}>
             Cancel
           </Button>
-          <Button variant="contained" color="primary" type="submit">
+          <Button variant="contained" color="primary" type="submit"
+           onMouseOver={() => setIsMouseOverSave(true)}
+           onMouseOut={() => setIsMouseOverSave(false)}
+          >
             Save
           </Button>
         

src/annotationForm/AnnotationDrawing.js

@@ -497,6 +497,7 @@ function AnnotationDrawing(props) {
         height={props.originalHeight}
         onTransform={onTransform}
         handleDragEnd={handleDragEnd}
+        isMouseOverSave={props.isMouseOverSave}
       />
     </Stage>
   );

src/annotationForm/KonvaDrawing/shapes/ParentComponent.js

@@ -16,6 +16,7 @@ import ImageShape from './Image';
 function ParentComponent({
   shapes, onShapeClick, selectedShapeId, activeTool,
   scale, width, height, onTransform, handleDragEnd,
+  isMouseOverSave
 }) {
   // TODO Simplify these state
   const [selectedShape, setSelectedShape] = useState(null);
@@ -47,7 +48,7 @@ function ParentComponent({
       scaleY={scale}
     >
       {shapes.map((shape, i) => {
-        const isSelected = selectedShapeId === shape.id;
+        const isSelected = selectedShapeId === shape.id && isMouseOverSave===false;
         switch (shape.type) {
           case 'rectangle':
             return (