From baed5ba26770c35f2166c6affa1decd5c5c4d3b5 Mon Sep 17 00:00:00 2001
From: winzlieb <winzlieb@c3d2.de>
Date: Fri, 11 Mar 2022 11:24:19 +0100
Subject: [PATCH] wrap updateBounds into useCallback

avoids call on every rerender
---
 frontend/search/components/ngo/LeafletMap.tsx | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/frontend/search/components/ngo/LeafletMap.tsx b/frontend/search/components/ngo/LeafletMap.tsx
index 761d4cd..747dc61 100644
--- a/frontend/search/components/ngo/LeafletMap.tsx
+++ b/frontend/search/components/ngo/LeafletMap.tsx
@@ -1,4 +1,4 @@
-import React, {useEffect, useState} from 'react'
+import React, {useCallback, useEffect, useState} from 'react'
 import 'leaflet'
 import 'leaflet/dist/leaflet.css'
 
@@ -18,11 +18,16 @@ type LeafletMapProps = {onBoundsChange?: (bounds: L.LatLngBounds) => void}
 
 const BoundsChangeListener = ({onBoundsChange}: {onBoundsChange?: (bounds: L.LatLngBounds) => void}) => {
   const map = useMap()
-  const updateBounds = () => {
-    onBoundsChange && onBoundsChange(
-      map.getBounds()
-    )
-  }
+
+  const updateBounds = useCallback(
+    () => {
+      onBoundsChange && onBoundsChange(
+        map.getBounds()
+      )
+    },
+    [map],
+  );
+
   useEffect(() => {
     updateBounds()
   }, [map, updateBounds])