feat(layers-rect): implement layer rectangle deleting

Closes MIN-105

src/components/Map/Drawer/LayersDrawer/LayersDrawerObjectsList.component.tsx

@@ -11,6 +11,7 @@ import { LayersDrawerTextItem } from '@/components/Map/Drawer/LayersDrawer/Layer
 import QuestionModal from '@/components/FunctionalArea/Modal/QuestionModal/QustionModal.component';
 import {
   removeLayerImage,
+  removeLayerRect,
   removeLayerText,
   updateLayerImageObject,
   updateLayerRect,
@@ -18,6 +19,7 @@ import {
 } from '@/redux/layers/layers.thunks';
 import {
   layerDeleteImage,
+  layerDeleteRect,
   layerDeleteText,
   layerUpdateImage,
   layerUpdateRect,
@@ -52,13 +54,18 @@ interface LayersDrawerObjectsListProps {
 const removeObjectConfig = {
   image: {
     question: 'Are you sure you want to remove the image?',
-    successMessage: 'The layer image has been successfully removed',
-    errorMessage: 'An error occurred while removing the layer text',
+    successMessage: 'The layer image has been successfully removed.',
+    errorMessage: 'An error occurred while removing the layer text.',
   },
   text: {
     question: 'Are you sure you want to remove the text?',
-    successMessage: 'The layer text has been successfully removed',
-    errorMessage: 'An error occurred while removing the layer text',
+    successMessage: 'The layer text has been successfully removed.',
+    errorMessage: 'An error occurred while removing the layer text.',
+  },
+  rect: {
+    question: 'Are you sure you want to remove the rectangle?',
+    successMessage: 'The layer rectangle has been successfully removed.',
+    errorMessage: 'An error occurred while removing the layer rectangle.',
   },
 };
 
@@ -72,21 +79,25 @@ export const LayersDrawerObjectsList = ({
   const minZIndex = useAppSelector(state => minObjectZIndexForLayerSelector(state, layerId));
   const layer = useAppSelector(state => layerByIdSelector(state, layerId));
   const mapEditToolsLayerImageObject = useAppSelector(mapEditToolsLayerObjectSelector);
-  const [removeModalState, setRemoveModalState] = useState<undefined | 'text' | 'image'>(undefined);
-  const [layerObjectToRemove, setLayerObjectToRemove] = useState<LayerImage | LayerText | null>(
-    null,
+  const [removeModalState, setRemoveModalState] = useState<undefined | 'text' | 'image' | 'rect'>(
+    undefined,
   );
+  const [layerObjectToRemove, setLayerObjectToRemove] = useState<
+    LayerImage | LayerText | LayerRect | null
+  >(null);
   const dispatch = useAppDispatch();
   const setBounds = useSetBounds();
   const pointToProjection = usePointToProjection();
   const { mapInstance } = useMapInstance();
 
-  const removeObject = (layerObject: LayerImage | LayerText): void => {
+  const removeObject = (layerObject: LayerImage | LayerText | LayerRect): void => {
     setLayerObjectToRemove(layerObject);
     if ('glyph' in layerObject) {
       setRemoveModalState('image');
-    } else {
+    } else if ('notes' in layerObject) {
       setRemoveModalState('text');
+    } else {
+      setRemoveModalState('rect');
     }
   };
 
@@ -115,7 +126,7 @@ export const LayersDrawerObjectsList = ({
             textId: layerObjectToRemove.id,
           }),
         );
-      } else {
+      } else if (removeModalState === 'image') {
         await dispatch(
           removeLayerImage({
             modelId: currentModelId,
@@ -130,6 +141,21 @@ export const LayersDrawerObjectsList = ({
             imageId: layerObjectToRemove.id,
           }),
         );
+      } else {
+        await dispatch(
+          removeLayerRect({
+            modelId: currentModelId,
+            layerId: layerObjectToRemove.layer,
+            rectId: layerObjectToRemove.id,
+          }),
+        ).unwrap();
+        dispatch(
+          layerDeleteRect({
+            modelId: currentModelId,
+            layerId: layerObjectToRemove.layer,
+            rectId: layerObjectToRemove.id,
+          }),
+        );
       }
       removeElementFromLayer({
         mapInstance,
@@ -335,7 +361,7 @@ export const LayersDrawerObjectsList = ({
           key={layerRect.id}
           moveToFront={() => moveRectToFront(layerRect)}
           moveToBack={() => moveRectToBack(layerRect)}
-          removeObject={() => {}}
+          removeObject={() => removeObject(layerRect)}
           centerObject={() => centerObject(layerRect)}
           editObject={() => editRect()}
           isLayerVisible={isLayerVisible}