Fix for cut button

ui-ngx/src/app/modules/home/components/widget/lib/maps/data-layer/polygons-data-layer.ts

@@ -32,6 +32,7 @@ import {
   UnplacedMapDataItem
 } from '@home/components/widget/lib/maps/data-layer/latest-map-data-layer';
 import { map } from 'rxjs/operators';
+import { instanceOfSearchableComponent } from '@home/models/searchable-component.models';
 
 class TbPolygonDataLayerItem extends TbLatestDataLayerItem<PolygonsDataLayerSettings, TbPolygonsDataLayer> {
 
@@ -252,6 +253,8 @@ class TbPolygonDataLayerItem extends TbLatestDataLayerItem<PolygonsDataLayerSett
     });
     this.addItemClass('tb-cut-mode');
     this.polygon.once('pm:cut', (e) => {
+      console.log("(e.layer in polygon", e.layer )
+      console.log("this.polygon instanceof L.Rectangle", this.polygon instanceof L.Rectangle)
       if (e.layer instanceof L.Polygon) {
         if (this.polygon instanceof L.Rectangle) {
           this.polygonContainer.removeLayer(this.polygon);

ui-ngx/src/app/modules/home/components/widget/lib/maps/data-layer/polylines-data-layer.ts

@@ -36,6 +36,9 @@ import {
   UnplacedMapDataItem
 } from '@home/components/widget/lib/maps/data-layer/latest-map-data-layer';
 import { map } from 'rxjs/operators';
+import { PointItem } from '@home/components/widget/lib/maps/data-layer/trips-data-layer';
+import _ from 'lodash';
+import { createTooltip, updateTooltip } from '@home/components/widget/lib/maps/data-layer/data-layer-utils';
 
 class TbPolylineDataLayerItem extends TbLatestDataLayerItem<PolylinesDataLayerSettings, TbPolylineDataLayer> {
 
@@ -257,14 +260,54 @@ class TbPolylineDataLayerItem extends TbLatestDataLayerItem<PolylinesDataLayerSe
     this.addItemClass('tb-cut-mode');
     this.polyline.once('pm:cut', (e) => {
       if (e.layer instanceof L.Polyline) {
-        this.polylineContainer.removeLayer(this.polyline);
-        this.polyline = L.polyline(e.layer.getLatLngs() as L.LatLngExpression[] | L.LatLngExpression[][], {
+        // fallback for single segment case
+        this.polyline = L.polyline(e.layer.getLatLngs() as L.LatLngExpression[] | L.LatLngExpression[][] , {
           ...this.polylineStyleInfo.style,
           snapIgnore: !this.dataLayer.isSnappable(),
           bubblingMouseEvents: !this.dataLayer.isEditMode()
         });
         this.polyline.addTo(this.polylineContainer);
+      } else if (e.layer instanceof L.LayerGroup) {
+        if(e.layer.getLayers){
+          console.log(e.layer, e.layer.getLayers, e.layer.getLayers())
+          const cutSegments = e.layer.getLayers() as L.Polyline[];
+          this.polylineContainer.removeLayer(this.polyline);
+          cutSegments.forEach(segment => {
+            console.log(segment instanceof L.Polyline)
+            segment.setStyle({
+              ...this.polylineStyleInfo.style,
+              snapIgnore: !this.dataLayer.isSnappable(),
+              bubblingMouseEvents: !this.dataLayer.isEditMode()
+            });
+            // segment.setStyle({
+            //   ...this.polylineStyleInfo.style,
+            //   snapIgnore: !this.dataLayer.isSnappable(),
+            //   bubblingMouseEvents: !this.dataLayer.isEditMode()
+            // });
+            segment.addTo(this.polylineContainer);
+          });
+
+        }
+
+
+
       }
+        // if (e.layer instanceof L.Polyline) {
+      //   // if (this.polyline instanceof L.Polyline) {
+      //     this.polylineContainer.removeLayer(this.polyline);
+      //     this.polyline = L.polyline(e.layer.getLatLngs() as L.LatLngExpression[] | L.LatLngExpression[][] , {
+      //       ...this.polylineStyleInfo.style,
+      //       snapIgnore: !this.dataLayer.isSnappable(),
+      //       bubblingMouseEvents: !this.dataLayer.isEditMode()
+      //     });
+      //     this.polyline.addTo(this.polylineContainer);
+      //   } else {
+      //     // @ts-ignore
+      //     this.polyline.setLatLngs(e.layer.getLatLngs());
+      //     // @ts-ignore
+      //     console.log("ELSE :", this.polyline)
+      //   // }
+      // }
       // @ts-ignore
       e.layer._pmTempLayer = true;
       e.layer.remove();
@@ -274,7 +317,7 @@ class TbPolylineDataLayerItem extends TbLatestDataLayerItem<PolylinesDataLayerSe
       this.polyline.addTo(this.polylineContainer);
       this.updateSelectedState();
       cutButton?.setActive(false);
-      this.savePolylineCoordinates()
+      this.savePolylineCoordinates();
     });
     const map = this.dataLayer.getMap().getMap();
     map.pm.setLang('en', {

ui-ngx/src/assets/locale/locale.constant-en_US.json

@@ -8638,6 +8638,7 @@
                     "polyline-configuration": "Polyline configuration",
                     "remove-polyline": "Remove polyline",
                     "edit": "Edit polyline",
+                    "cut": "Cut polyline area",
                     "rotate": "Rotate polyline",
                     "remove-polyline-for": "Remove polyline for '{{entityName}}'",
                     "draw-polyline": "Draw polyline",