diff --git a/src/components/Map/index.jsx b/src/components/Map/index.jsx
index 9bfc672bf..d48f654c2 100644
--- a/src/components/Map/index.jsx
+++ b/src/components/Map/index.jsx
@@ -18,7 +18,6 @@ import {
 import {getBEMClassName} from 'utils';
 
 import NearestAddress from './NearestAddress';
-import './map.scss';
 import OpenFormsProvider from './provider';
 import {
   applyLeafletTranslations,
@@ -70,7 +69,9 @@ const LeaftletMap = ({
   const modifiers = disabled ? ['disabled'] : [];
   const className = getBEMClassName('leaflet-map', modifiers);
 
-  applyLeafletTranslations(intl);
+  useEffect(() => {
+    applyLeafletTranslations(intl);
+  }, [intl]);
 
   const onFeatureCreate = event => {
     updateGeoJsonGeometry(event.layer);
@@ -87,18 +88,19 @@ const LeaftletMap = ({
   };
 
   const updateGeoJsonGeometry = newFeatureLayer => {
-    if (featureGroupRef.current) {
-      const newFeatureLayerId = newFeatureLayer._leaflet_id;
-      const layers = featureGroupRef.current?.getLayers();
-      // Limit the amount of features to 1, by removing the previous layer
-      if (layers.length > 1) {
-        const oldLayerIds = layers
-          .map(layer => layer._leaflet_id)
-          .filter(layerId => layerId !== newFeatureLayerId);
-        oldLayerIds.forEach(oldLayerId => {
-          featureGroupRef.current?.removeLayer(oldLayerId);
-        });
-      }
+    const featureGroup = featureGroupRef.current;
+    if (featureGroup) {
+      const newLayerId = featureGroup.getLayerId(newFeatureLayer);
+
+      featureGroup.eachLayer(layer => {
+        const layerId = featureGroup.getLayerId(layer);
+
+        // Remove all layers that aren't the newly added layer
+        // Ensuring that only 1 layer/shape will be present at any time
+        if (layerId !== newLayerId) {
+          featureGroup.removeLayer(layer);
+        }
+      });
     }
     onGeoJsonGeometrySet(newFeatureLayer.toGeoJSON().geometry);
   };
diff --git a/src/components/Map/map.scss b/src/components/Map/map.scss
deleted file mode 100644
index 2ac423add..000000000
--- a/src/components/Map/map.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-@import 'leaflet/dist/leaflet.css';
-@import 'leaflet-draw/dist/leaflet.draw.css';
-
-.leaflet-container .leaflet-draw-actions {
-  // Make sure all action bars are the same height
-  a,
-  &.leaflet-draw-actions-top a,
-  &.leaflet-draw-actions-bottom a {
-    height: 30px;
-    line-height: 30px;
-  }
-
-  a {
-    color: #fff;
-  }
-}
diff --git a/src/scss/components/_leaflet-map.scss b/src/scss/components/_leaflet-map.scss
index 2c0a9de18..d2b88dae9 100644
--- a/src/scss/components/_leaflet-map.scss
+++ b/src/scss/components/_leaflet-map.scss
@@ -1,4 +1,6 @@
 @use 'microscope-sass/lib/bem';
+@import 'leaflet/dist/leaflet.css';
+@import 'leaflet-draw/dist/leaflet.draw.css';
 @import 'leaflet-geosearch/dist/geosearch.css';
 @import 'leaflet-gesture-handling/dist/leaflet-gesture-handling.css';
 
@@ -15,4 +17,12 @@
   @include bem.modifier('disabled') {
     cursor: default;
   }
+
+  .leaflet-draw-actions {
+    a {
+      height: 30px;
+      line-height: 30px;
+      color: #fff;
+    }
+  }
 }