fix polygon

src/AnnotationDrawing.js

@@ -80,10 +80,19 @@ function AnnotationDrawing(props) {
 
   /** */
   const onShapeClick = async (shape) => {
+
+    
+
     setSelectedShapeId(shape.id);
     // find shape by id
     setCurrentShape(shapes.find((s) => s.id === shape.id));
     props.setShapeProperties(shape);
+
+    // place shape on top
+
+     const newShapes = shapes.filter((s) => s.id !== shape.id); // remove shape from the list
+      newShapes.push(shape); // add shape to the end of the list
+
   };
 
   /** */

src/shapes/Polygon.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import {Transformer, Shape, Line} from 'react-konva';
 
 /** FreeHand shape displaying */
-function FreeHand({
+function Polygon({
   activeTool, fill, height, onShapeClick, points, isSelected, shape, stroke, strokeWidth, width, x, y,
 }) {
   // TODO check if selectedShapeId is needed
@@ -25,7 +25,7 @@ function FreeHand({
   };
 
   return (
-    console.log("FreeHand shape", shape),
+  
     <>
       <Line
           ref={shapeRef}
@@ -51,7 +51,7 @@ function FreeHand({
   );
 }
 
-FreeHand.propTypes = {
+Polygon.propTypes = {
   activeTool: PropTypes.string.isRequired,
   fill: PropTypes.string,
   height: PropTypes.number,
@@ -63,7 +63,7 @@ FreeHand.propTypes = {
   width: PropTypes.number,
 };
 
-FreeHand.defaultProps = {
+Polygon.defaultProps = {
   fill: 'red',
   height: 1080,
   points: [0, 0, 100, 0, 100, 100],
@@ -72,4 +72,4 @@ FreeHand.defaultProps = {
   width: 1920,
 };
 
-export default FreeHand;
+export default Polygon;