Refactor remove/hide layers

Signed-off-by: Vijayan Balasubramanian <balasvij@amazon.com>
opensearch-project · Jan 31, 2023 · 1b4f3d4 · 1b4f3d4
1 parent a53df97
commit 1b4f3d4
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 55 deletions.
diff --git a/public/components/layer_control_panel/layer_control_panel.tsx b/public/components/layer_control_panel/layer_control_panel.tsx
@@ -48,7 +48,7 @@ import {
 } from '../../model/layerRenderController';
 import { MapState } from '../../model/mapState';
 import { ConfigSchema } from '../../../common/config';
-import {moveLayers, updateLayerVisibility} from "../../model/map/layer_operations";
+import {moveLayers, removeLayers, updateLayerVisibility} from "../../model/map/layer_operations";
 
 interface MaplibreRef {
   current: Maplibre | null;
@@ -300,7 +300,7 @@ export const LayerControlPanel = memo(
 
     const onDeleteLayerConfirm = () => {
       if (selectedDeleteLayer) {
-        layersFunctionMap[selectedDeleteLayer.type]?.remove(maplibreRef, selectedDeleteLayer);
+        removeLayers(maplibreRef.current!, selectedDeleteLayer.id, true);
         removeLayer(selectedDeleteLayer.id);
         setIsDeleteLayerModalVisible(false);
         setSelectedDeleteLayer(undefined);

diff --git a/public/model/OSMLayerFunctions.ts b/public/model/OSMLayerFunctions.ts
@@ -1,7 +1,7 @@
 import { Map as Maplibre, LayerSpecification } from 'maplibre-gl';
 import { OSMLayerSpecification } from './mapLayerType';
 import { getMaplibreBeforeLayerId } from './layersFunctions';
-import { hasLayer } from './map/layer_operations';
+import { hasLayer, removeLayers } from './map/layer_operations';
 
 interface MaplibreRef {
   current: Maplibre | null;
@@ -99,26 +99,8 @@ export const OSMLayerFunctions = {
   ) => {
     // If layer already exist in maplibre source, update layer config
     // else add new layer.
-    if (hasLayer(maplibreRef.current!, layerConfig.id)) {
-      updateLayerConfig(layerConfig, maplibreRef);
-    } else {
-      addNewLayer(layerConfig, maplibreRef, beforeLayerId);
-    }
-  },
-  remove: (maplibreRef: MaplibreRef, layerConfig: OSMLayerSpecification) => {
-    const layers = getCurrentStyleLayers(maplibreRef);
-    layers.forEach((mbLayer: { id: any }) => {
-      if (mbLayer.id.includes(layerConfig.id)) {
-        maplibreRef.current?.removeLayer(mbLayer.id);
-      }
-    });
-  },
-  hide: (maplibreRef: MaplibreRef, layerConfig: OSMLayerSpecification) => {
-    const layers = getCurrentStyleLayers(maplibreRef);
-    layers.forEach((mbLayer: { id: any }) => {
-      if (mbLayer.id.includes(layerConfig.id)) {
-        maplibreRef.current?.setLayoutProperty(mbLayer.id, 'visibility', layerConfig.visibility);
-      }
-    });
+    return hasLayer(maplibreRef.current!, layerConfig.id)
+      ? updateLayerConfig(layerConfig, maplibreRef)
+      : addNewLayer(layerConfig, maplibreRef, beforeLayerId);
   },
 };
diff --git a/public/model/customLayerFunctions.ts b/public/model/customLayerFunctions.ts
@@ -1,7 +1,7 @@
 import { Map as Maplibre, AttributionControl, RasterSourceSpecification } from 'maplibre-gl';
 import { CustomLayerSpecification, OSMLayerSpecification } from './mapLayerType';
 import { getMaplibreBeforeLayerId } from './layersFunctions';
-import { hasLayer } from './map/layer_operations';
+import { hasLayer, removeLayers } from './map/layer_operations';
 
 interface MaplibreRef {
   current: Maplibre | null;
@@ -98,26 +98,11 @@ export const CustomLayerFunctions = {
     layerConfig: CustomLayerSpecification,
     beforeLayerId: string | undefined
   ) => {
-    if (hasLayer(maplibreRef.current!, layerConfig.id)) {
-      updateLayerConfig(layerConfig, maplibreRef);
-    } else {
-      addNewLayer(layerConfig, maplibreRef, beforeLayerId);
-    }
+    return hasLayer(maplibreRef.current!, layerConfig.id)
+      ? updateLayerConfig(layerConfig, maplibreRef)
+      : addNewLayer(layerConfig, maplibreRef, beforeLayerId);
   },
   remove: (maplibreRef: MaplibreRef, layerConfig: OSMLayerSpecification) => {
-    const layers = getCurrentStyleLayers(maplibreRef);
-    layers.forEach((mbLayer: { id: any }) => {
-      if (mbLayer.id.includes(layerConfig.id)) {
-        maplibreRef.current?.removeLayer(mbLayer.id);
-      }
-    });
-  },
-  hide: (maplibreRef: MaplibreRef, layerConfig: OSMLayerSpecification) => {
-    const layers = getCurrentStyleLayers(maplibreRef);
-    layers.forEach((mbLayer: { id: any }) => {
-      if (mbLayer.id.includes(layerConfig.id)) {
-        maplibreRef.current?.setLayoutProperty(mbLayer.id, 'visibility', layerConfig.visibility);
-      }
-    });
+    removeLayers(maplibreRef.current!, layerConfig.id, true);
   },
 };
diff --git a/public/model/documentLayerFunctions.ts b/public/model/documentLayerFunctions.ts
@@ -191,35 +191,35 @@ const updateLayer = (
       dataSource.setData(getLayerSource(data, layerConfig));
     }
     updateCircleLayer(maplibreInstance, {
-      fillColor: layerConfig.style?.fillColor,
+      fillColor: layerConfig.style.fillColor,
       maxZoom: layerConfig.zoomRange[1],
       minZoom: layerConfig.zoomRange[0],
       opacity: layerConfig.opacity,
-      outlineColor: layerConfig.style?.borderColor,
+      outlineColor: layerConfig.style.borderColor,
       radius: layerConfig.style?.markerSize,
       sourceId: layerConfig.id,
       visibility: layerConfig.visibility,
-      width: layerConfig.style?.borderThickness,
+      width: layerConfig.style.borderThickness,
     });
     const geoFieldType = getGeoFieldType(layerConfig);
     if (geoFieldType === 'geo_shape') {
       updateLineLayer(maplibreInstance, {
-        width: layerConfig.style?.borderThickness,
-        color: layerConfig.style?.fillColor,
+        width: layerConfig.style.borderThickness,
+        color: layerConfig.style.fillColor,
         maxZoom: layerConfig.zoomRange[1],
         minZoom: layerConfig.zoomRange[0],
         opacity: layerConfig.opacity,
         sourceId: layerConfig.id,
         visibility: layerConfig.visibility,
       });
       updatePolygonLayer(maplibreInstance, {
-        width: layerConfig.style?.borderThickness,
-        fillColor: layerConfig.style?.fillColor,
+        width: layerConfig.style.borderThickness,
+        fillColor: layerConfig.style.fillColor,
         maxZoom: layerConfig.zoomRange[1],
         minZoom: layerConfig.zoomRange[0],
         opacity: layerConfig.opacity,
         sourceId: layerConfig.id,
-        outlineColor: layerConfig.style?.borderColor,
+        outlineColor: layerConfig.style.borderColor,
         visibility: layerConfig.visibility,
       });
     }
@@ -237,7 +237,4 @@ export const DocumentLayerFunctions = {
       ? updateLayer(layerConfig, maplibreRef, data)
       : addNewLayer(layerConfig, maplibreRef, data, beforeLayerId);
   },
-  remove: (maplibreRef: MaplibreRef, layerConfig: DocumentLayerSpecification) => {
-    removeLayers(maplibreRef.current!, layerConfig.id, true);
-  },
 };