From 6842fb69a0010fb61cce5be341089caf64f0148c Mon Sep 17 00:00:00 2001
From: Paul Adamsen <117673433+pauladamseniii@users.noreply.github.com>
Date: Tue, 16 May 2023 15:44:55 -0400
Subject: [PATCH] CEC-4301 - Revise home map zoom to (#333)

---
 .../App/__snapshots__/App.test.js.snap        | 16 ++++++++--------
 src/components/VehicleMap/index.jsx           | 19 ++++++++++++++-----
 src/components/VehicleMap/zoomLocations.json  |  8 ++++----
 3 files changed, 26 insertions(+), 17 deletions(-)

diff --git a/src/components/App/__snapshots__/App.test.js.snap b/src/components/App/__snapshots__/App.test.js.snap
index 9795528..209f8f2 100644
--- a/src/components/App/__snapshots__/App.test.js.snap
+++ b/src/components/App/__snapshots__/App.test.js.snap
@@ -497,17 +497,17 @@ exports[`App Route / authenticated 1`] = `
                       North America
                     </option>
                     <option
-                      value="{ \\"center\\": [33.8463, -118.0461], \\"zoom\\": 10 }"
+                      value="{ \\"center\\": [33.8623, -118.0295], \\"zoom\\": 14 }"
                     >
                       - La Palma
                     </option>
                     <option
-                      value="{ \\"center\\": [33.8847, -118.4109], \\"zoom\\": 10 }"
+                      value="{ \\"center\\": [33.9021, -118.3792], \\"zoom\\": 14 }"
                     >
                       - Manhattan Beach
                     </option>
                     <option
-                      value="{ \\"center\\": [37.7749, -122.4194], \\"zoom\\": 10 }"
+                      value="{ \\"center\\": [37.7637, -122.4197], \\"zoom\\": 14 }"
                     >
                       - San Francisco
                     </option>
@@ -517,7 +517,7 @@ exports[`App Route / authenticated 1`] = `
                       Europe
                     </option>
                     <option
-                      value="{ \\"center\\": [47.0707, 15.4395], \\"zoom\\": 10 }"
+                      value="{ \\"center\\": [47.0221, 15.4774], \\"zoom\\": 14 }"
                     >
                       - Graz
                     </option>
@@ -1894,17 +1894,17 @@ exports[`App Route /home authenticated 1`] = `
                       North America
                     </option>
                     <option
-                      value="{ \\"center\\": [33.8463, -118.0461], \\"zoom\\": 10 }"
+                      value="{ \\"center\\": [33.8623, -118.0295], \\"zoom\\": 14 }"
                     >
                       - La Palma
                     </option>
                     <option
-                      value="{ \\"center\\": [33.8847, -118.4109], \\"zoom\\": 10 }"
+                      value="{ \\"center\\": [33.9021, -118.3792], \\"zoom\\": 14 }"
                     >
                       - Manhattan Beach
                     </option>
                     <option
-                      value="{ \\"center\\": [37.7749, -122.4194], \\"zoom\\": 10 }"
+                      value="{ \\"center\\": [37.7637, -122.4197], \\"zoom\\": 14 }"
                     >
                       - San Francisco
                     </option>
@@ -1914,7 +1914,7 @@ exports[`App Route /home authenticated 1`] = `
                       Europe
                     </option>
                     <option
-                      value="{ \\"center\\": [47.0707, 15.4395], \\"zoom\\": 10 }"
+                      value="{ \\"center\\": [47.0221, 15.4774], \\"zoom\\": 14 }"
                     >
                       - Graz
                     </option>
diff --git a/src/components/VehicleMap/index.jsx b/src/components/VehicleMap/index.jsx
index 1af736a..b0fecd9 100644
--- a/src/components/VehicleMap/index.jsx
+++ b/src/components/VehicleMap/index.jsx
@@ -12,6 +12,7 @@ import { ValidateLocationData } from "../../utils/locations";
 import { useUserContext } from "../Contexts/UserContext";
 import { useVehicleContext, VehicleProvider } from "../Contexts/VehicleContext";
 import { VehiclePopUp } from "./popup";
+import { useLocalStorage } from "../useLocalStorage";
 import zoomLocations from './zoomLocations.json';
 
 const Component = () => {
@@ -29,6 +30,7 @@ const Component = () => {
   const [zoom, setZoom] = useState(2);
   const [markers, setMarkers] = useState([]);
   const [connections, setConnections] = useState({});
+  const [lastMapCenter, setLastMapCenter] = useLocalStorage("MAP_CENTER", "");
 
   useEffect(() => {
     if (!token) return;
@@ -62,10 +64,16 @@ const Component = () => {
   };
 
   const centerAroundMarkers = (points) => {
-    let defaultLocationJSON = process.env.REACT_APP_HOME_MAP_DEFAULT_LOCATION;
-    let defaultLocation = JSON.parse(defaultLocationJSON)
-    setCenter([defaultLocation.lat, defaultLocation.lng]);
-    setZoom(defaultLocation.zoom);
+    if (lastMapCenter) {
+      let zoomLocation = JSON.parse(lastMapCenter)
+      setCenter(zoomLocation.center);
+      setZoom(zoomLocation.zoom)
+    } else {
+      let defaultLocationJSON = process.env.REACT_APP_HOME_MAP_DEFAULT_LOCATION;
+      let defaultLocation = JSON.parse(defaultLocationJSON)
+      setCenter([defaultLocation.lat, defaultLocation.lng]);
+      setZoom(defaultLocation.zoom);
+    }
   };
 
   useEffect(() => {
@@ -105,6 +113,7 @@ const Component = () => {
   };
 
   const focusMap = (e) => {
+    setLastMapCenter(e.target.value)
     let zoomLocation = JSON.parse(e.target.value)
     setCenter(zoomLocation.center);
     setZoom(zoomLocation.zoom)
@@ -145,7 +154,7 @@ const Component = () => {
 
   return (
     <>
-      <DropDownList label="Zoom To" data={zoomLocations} classes={classes} onChange={focusMap} />
+      <DropDownList label="Zoom To" data={zoomLocations} classes={classes} onChange={focusMap} value={lastMapCenter} />
       <MapContainer
         center={center}
         zoom={zoom}
diff --git a/src/components/VehicleMap/zoomLocations.json b/src/components/VehicleMap/zoomLocations.json
index 6c502c8..95de52a 100644
--- a/src/components/VehicleMap/zoomLocations.json
+++ b/src/components/VehicleMap/zoomLocations.json
@@ -4,15 +4,15 @@
     "label": "North America"
   },
   {
-    "value": "{ \"center\": [33.8463, -118.0461], \"zoom\": 10 }",
+    "value": "{ \"center\": [33.8623, -118.0295], \"zoom\": 14 }",
     "label": "- La Palma"
   },
   {
-    "value": "{ \"center\": [33.8847, -118.4109], \"zoom\": 10 }",
+    "value": "{ \"center\": [33.9021, -118.3792], \"zoom\": 14 }",
     "label": "- Manhattan Beach"
   },
   {
-    "value": "{ \"center\": [37.7749, -122.4194], \"zoom\": 10 }",
+    "value": "{ \"center\": [37.7637, -122.4197], \"zoom\": 14 }",
     "label": "- San Francisco"
   },
   {
@@ -20,7 +20,7 @@
     "label": "Europe"
   },
   {
-    "value": "{ \"center\": [47.0707, 15.4395], \"zoom\": 10 }",
+    "value": "{ \"center\": [47.0221, 15.4774], \"zoom\": 14 }",
     "label": "- Graz"
   }
 ]
\ No newline at end of file