From c6540ddb20ed48b6f1261af23589cc1d56e0e2bf Mon Sep 17 00:00:00 2001
From: Sacha Weatherstone <sachaw100@hotmail.com>
Date: Wed, 28 Dec 2022 14:13:19 +1100
Subject: [PATCH] Add padding to bounding box

---
 .../PageComponents/Map/MapControlls.tsx       | 22 ++++++++++++++-----
 1 file changed, 16 insertions(+), 6 deletions(-)

diff --git a/src/components/PageComponents/Map/MapControlls.tsx b/src/components/PageComponents/Map/MapControlls.tsx
index 1611cd8f..ea9eb47d 100644
--- a/src/components/PageComponents/Map/MapControlls.tsx
+++ b/src/components/PageComponents/Map/MapControlls.tsx
@@ -27,10 +27,20 @@ export const MapControlls = (): JSX.Element => {
 
       const bounds = bbox(line);
 
-      const center = map?.cameraForBounds([
-        [bounds[1], bounds[0]],
-        [bounds[3], bounds[2]]
-      ]);
+      const center = map?.cameraForBounds(
+        [
+          [bounds[1], bounds[0]],
+          [bounds[3], bounds[2]]
+        ],
+        {
+          padding: {
+            top: 10,
+            bottom: 10,
+            left: 10,
+            right: 10
+          }
+        }
+      );
 
       if (center) {
         map?.easeTo(center);
@@ -45,10 +55,10 @@ export const MapControlls = (): JSX.Element => {
       });
     }
   };
-  
+
   useEffect(() => {
     getBBox();
-  }, [])
+  }, []);
 
   return (
     <div className="absolute right-0 top-0 z-10 m-2 ">