extracting resizeObserver into antoher useEffect.

Expensify · Sep 18, 2023 · e83f20f · e83f20f
1 parent db324f0
commit e83f20f
Showing 1 changed file with 12 additions and 6 deletions.
diff --git a/src/components/MapView/MapView.web.tsx b/src/components/MapView/MapView.web.tsx
@@ -40,18 +40,24 @@ const MapView = forwardRef<MapViewHandle, MapViewProps>(
 
             const map = mapRef.getMap();
 
-            const resizeObserver = new ResizeObserver(() => {
-                mapRef?.resize();
-            });
-            resizeObserver.observe(mapRef?.getContainer());
-
             const {northEast, southWest} = utils.getBounds(waypoints.map((waypoint) => waypoint.coordinate));
             map.fitBounds([northEast, southWest], {padding: mapPadding});
+        }, [waypoints, mapRef, mapPadding]);
+
+        useEffect(() => {
+            if (!mapRef) {
+                return;
+            }
+
+            const resizeObserver = new ResizeObserver(() => {
+                mapRef.resize();
+            });
+            resizeObserver.observe(mapRef.getContainer());
 
             return () => {
                 resizeObserver?.disconnect();
             }
-        }, [waypoints, mapRef, mapPadding]);
+        }, [mapRef]);
 
         useImperativeHandle(
             ref,