fix: prevent infinite loop by checking map state on moveend

mapper/src/App.js

@@ -81,9 +81,26 @@ function MapEvents({ onMapChange }) {
     const map = useMapEvents({
         moveend: () => {
             const center = map.getCenter();
-            onMapChange({
+            const newZoom = map.getZoom();
-                zoom: map.getZoom(),
+            const newCenter = [center.lat, center.lng];
-                center: [center.lat, center.lng],
+
+            onMapChange(prevState => {
+                // A small tolerance for floating point comparisons
+                const tolerance = 1e-5;
+                if (!prevState.center) {
+                    return { zoom: newZoom, center: newCenter };
+                }
+
+                const zoomChanged = prevState.zoom !== newZoom;
+                const centerChanged = Math.abs(prevState.center[0] - newCenter[0]) > tolerance ||
+                                    Math.abs(prevState.center[1] - newCenter[1]) > tolerance;
+
+                if (zoomChanged || centerChanged) {
+                    return { zoom: newZoom, center: newCenter };
+                }
+
+                // If nothing changed, return the previous state to prevent a re-render
+                return prevState;
             });
         },
     });