From 7842734318d415bfdebe73b2863ef54661fd014a Mon Sep 17 00:00:00 2001
From: robinvandermolen <robin@maykinmedia.nl>
Date: Mon, 14 Apr 2025 09:50:16 +0200
Subject: [PATCH] bug: [#192] Fixed broken map event unmounting

When unmounting a specific map event handler (`map.off(eventType, func)`), the exact same mounting function (`map.on(eventType, func)`) has to be used. Otherwise the map unmounting doesn't know how which function should be removed, and nothing happens (resulting in more and more duplicate handlers for the same event). See https://leafletjs.com/reference.html#evented-off

By using a custom function on the `map.on()` (which in turn *might* call the correct `props[handler]`), the `props[handler]` is actually never used as event handler. Meaning that the `map.off()`, in the current setup, will never work.

By making sure that the `map.on()` and `map.off()` use the same function, the unmounting works as expected and old event handlers are removed.
---
 src/EditControl.js | 12 +++---------
 1 file changed, 3 insertions(+), 9 deletions(-)

diff --git a/src/EditControl.js b/src/EditControl.js
index 81b38d7..6a490b7 100644
--- a/src/EditControl.js
+++ b/src/EditControl.js
@@ -38,15 +38,9 @@ function EditControl(props) {
     const { onMounted } = props;
 
     for (const key in eventHandlers) {
-      map.on(eventHandlers[key], (evt) => {
-        let handlers = Object.keys(eventHandlers).filter(
-          (handler) => eventHandlers[handler] === evt.type
-        );
-        if (handlers.length === 1) {
-          let handler = handlers[0];
-          props[handler] && props[handler](evt);
-        }
-      });
+      if (props[key]) {
+        map.on(eventHandlers[key], props[key]);
+      }
     }
     map.on(leaflet.Draw.Event.CREATED, onDrawCreate);
     drawRef.current = createDrawElement(props, context);