316 - SFG reload map on refresh

src/actions/MapActions.js

@@ -117,6 +117,12 @@ export const openMap = (mapId) => {
         });
       }, 1000);
 
+      if (sessionStorage.getItem("currentMapId")) {
+        sessionStorage.removeItem("currentMapId");
+      }
+
+      sessionStorage.setItem("currentMapId", mapId);
+
       dispatch(postRequest("/api/user/map/view", { eid: mapId }));
       dispatch(notifyServerOfCurrentMap());
     }
@@ -142,13 +148,15 @@ export const deleteMap = (mapId) => {
 
 export const newMap = () => {
   return (dispatch) => {
+    sessionStorage.removeItem("currentMapId");
     dispatch({
       type: "NEW_MAP",
       payload: { unsavedMapUuid: uuidv4() },
     });
     setTimeout(() => {
       dispatch({ type: "CHANGE_MOVING_METHOD", payload: "flyTo" });
     }, 500);
+
     dispatch(updateReadOnly());
     dispatch(notifyServerOfCurrentMap());
   };
@@ -401,4 +409,4 @@ const shortenTimestamp = (timestamp) => {
   } else {
     return moment(timestamp).format("DD/MM/YY");
   }
-};
+};

src/components/left-pane/LeftPaneLandData.js

@@ -149,7 +149,6 @@ const LeftPaneLandData = ({ open, active, onClose }) => {
                 .filter((dataGroup) => dataGroup.userGroupId == userGroup.id)
                 .map(
                   (dataGroup) => (
-                    console.log("From LeftPaneLandData", dataGroup),
                     (
                       <div
                         className={"datagroup-style-wrapper"}

src/pages/MapApp.js

@@ -7,7 +7,7 @@ import Tooltips from '../components/common/Tooltips';
 import ControlButtons from '../components/map-controls/ControlButtons';
 import Spinner from '../components/common/Spinner';
 import * as Auth from "../utils/Auth";
-import { getMyMaps } from '../actions/MapActions'
+import { getMyMaps, openMap } from '../actions/MapActions';
 import { getUserDetails } from '../actions/UserActions';
 import NoConnectionToast from '../components/map/NoConnectionToast';
 import {
@@ -24,20 +24,27 @@ const MapApp = () => {
   const dispatch = useDispatch();
   const navigate = useNavigate();
 
-  useEffect(() => {
-    if (authenticated && Auth.isTokenActive()) {
-      // If authenticated, get user details, maps, and setup websocket connection with the server
-      dispatch(getUserDetails());
-      dispatch(getMyMaps());
-      dispatch(establishSocketConnection());
-    } else {
-      // If not authenticated, remove token, disconnect websocket, and redirect to login page
-      Auth.removeToken();
-      dispatch(closeSocketConnection());
-      console.log("no token, redirecting to login page");
-      navigate("/auth", { replace: true });
-    }
-  }, [authenticated]);
+ useEffect(async () => {
+   if (authenticated && Auth.isTokenActive()) {
+     // If authenticated, get user details, setup websocket connection, and get maps
+     await dispatch(getUserDetails());
+     dispatch(establishSocketConnection());
+     await dispatch(getMyMaps());
+
+     // Open the map that was previously open if the page was refreshed
+     const storedMapId = parseInt(sessionStorage.getItem("currentMapId"));
+     if (storedMapId) {
+       await dispatch(openMap(storedMapId));
+     }
+   } else {
+     // If not authenticated, remove token, disconnect websocket, and redirect to login page
+     Auth.removeToken();
+     dispatch(closeSocketConnection());
+     sessionStorage.removeItem("currentMapId");
+     console.log("no token, redirecting to login page");
+     navigate("/auth", { replace: true });
+   }
+ }, [authenticated]);  
 
   // If user details have been populated, render map, else render loading spinner
   if (user.populated) {