From 6b24ab409619731b4a453bea239e09c12fd910f7 Mon Sep 17 00:00:00 2001
From: Nahid Guliyev <quliyevn633@gmail.com>
Date: Fri, 15 Sep 2023 19:11:48 +0200
Subject: [PATCH 1/3] [distance] request map is cut off after going online

---
 src/components/MapView/MapView.web.tsx | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/src/components/MapView/MapView.web.tsx b/src/components/MapView/MapView.web.tsx
index d1b26df8b00e..39bef7392f25 100644
--- a/src/components/MapView/MapView.web.tsx
+++ b/src/components/MapView/MapView.web.tsx
@@ -40,8 +40,17 @@ 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});
+
+            return () => {
+                resizeObserver?.disconnect();
+            }
         }, [waypoints, mapRef, mapPadding]);
 
         useImperativeHandle(

From e83f20f2501108124bc3479dbebb5ded99f2b7d0 Mon Sep 17 00:00:00 2001
From: Nahid Guliyev <quliyevn633@gmail.com>
Date: Tue, 19 Sep 2023 00:59:40 +0200
Subject: [PATCH 2/3] extracting resizeObserver into antoher useEffect.

---
 src/components/MapView/MapView.web.tsx | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/components/MapView/MapView.web.tsx b/src/components/MapView/MapView.web.tsx
index 39bef7392f25..6594e57f055d 100644
--- 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,

From e2ce219f9549feff9df871fc67f5932aba695f31 Mon Sep 17 00:00:00 2001
From: Nahid Guliyev <quliyevn633@gmail.com>
Date: Tue, 19 Sep 2023 01:33:10 +0200
Subject: [PATCH 3/3] prettier linting change

---
 src/components/MapView/MapView.web.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/MapView/MapView.web.tsx b/src/components/MapView/MapView.web.tsx
index 6594e57f055d..ce13cee10f54 100644
--- a/src/components/MapView/MapView.web.tsx
+++ b/src/components/MapView/MapView.web.tsx
@@ -56,7 +56,7 @@ const MapView = forwardRef<MapViewHandle, MapViewProps>(
 
             return () => {
                 resizeObserver?.disconnect();
-            }
+            };
         }, [mapRef]);
 
         useImperativeHandle(