Merge pull request #624 from codeforboston/frontend_issue553_survey-g…

…eo-data made changes to support safari
codeforboston · Oct 1, 2024 · a804ed2 · a804ed2
2 parents ad3580e + fb0014d
commit a804ed2
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 53 deletions.
diff --git a/frontend/front/src/pages/Surveyor/dashboard/LocationPermission.js b/frontend/front/src/pages/Surveyor/dashboard/LocationPermission.js
@@ -1,16 +1,15 @@
 import { Alert, Box, Button, Link, Typography } from "@mui/material";
-import { useEffect, useState } from "react";
+import { useState } from "react";
 
 const LocationPermission = () => {
-  const [disableLocButn, setDisableLocBtn] = useState(false);
   const [err, setErr] = useState(false);
   const [errType, setErrType] = useState("");
-  const [locationStatus, setLocationStatus] = useState("Off");
+  const [locationStatus, setLocationStatus] = useState("unknown");
 
-  const locationPermission = () => {
+  const handleLocationPermission = () => {
     function success() {
       setErr(false);
-      setLocationStatus("On");
+      setLocationStatus("Granted");
     }
     function error(err) {
       if (err.code === 1) {
@@ -23,44 +22,6 @@ const LocationPermission = () => {
     navigator.geolocation.getCurrentPosition(success, error);
   };
 
-  useEffect(() => {
-    //checking location permission
-    navigator.permissions.query({ name: "geolocation" }).then((res) => {
-      if (res.state === "prompt") {
-        setDisableLocBtn(false);
-        setErr(false);
-        setLocationStatus("Off");
-      } else if (res.state === "denied") {
-        setDisableLocBtn(true);
-        setErrType("user_denied");
-        setErr(true);
-        setLocationStatus("Denied");
-      } else if (res.state === "granted") {
-        setDisableLocBtn(true);
-        setErr(false);
-        setLocationStatus("On");
-      } else {
-        setDisableLocBtn(true);
-      }
-      res.onchange = (e) => {
-        if (e.type === "change") {
-          const newState = e.target.newState;
-          if (newState === "granted" || newState === "denied") {
-            if (newState === "granted") {
-              setLocationStatus("On");
-            }
-            if (newState === "denied") {
-              setLocationStatus("Denied");
-            }
-            setDisableLocBtn(true);
-          } else {
-            setDisableLocBtn(true);
-          }
-        }
-      };
-    });
-  });
-
   let permissionDeniedMsg = (
     <Alert severity="error">
       It looks like the location permission was denied, please follow
@@ -99,6 +60,9 @@ const LocationPermission = () => {
       </ul>
     </Alert>
   );
+  let permissionSuccess = (
+    <Alert security="success">Location Permission is allowed</Alert>
+  );
 
   return (
     <Box
@@ -109,23 +73,20 @@ const LocationPermission = () => {
       alignItems="center"
     >
       <Alert severity="warning">
-        To submit surveys, please grant location permission using the "Grant
-        Location Permission" button below. You will be prompted for permission
-        please select "Allow".
+        To submit surveys, please enable your location permission using the
+        "Check Location Permission" button below. You will be prompted for
+        permission please select "Allow".
       </Alert>
       {err &&
         (errType === "user_denied" ? (
           permissionDeniedMsg
         ) : (
           <Typography>error</Typography>
         ))}
-      <Typography>Location Permission Status: {locationStatus}</Typography>
-      <Button
-        variant="contained"
-        onClick={locationPermission}
-        disabled={disableLocButn ? true : false}
-      >
-        Grant Location Permission
+      {locationStatus === "Granted" && permissionSuccess}
+
+      <Button variant="contained" onClick={handleLocationPermission}>
+        Check Location Permission
       </Button>
     </Box>
   );

diff --git a/frontend/front/src/pages/Surveyor/dashboard/locationPermissionSlice.js b/frontend/front/src/pages/Surveyor/dashboard/locationPermissionSlice.js
@@ -0,0 +1,15 @@
+import { createSlice } from "@reduxjs/toolkit";
+
+export const locationPermissionSlice = createSlice({
+  name: "locationPermission",
+  initialState: {
+    pageFirstLoad: true,
+  },
+  reducers: {
+    updatePageFirstLoad: (state, action) => {
+      state.pageFirstLoad = action.payload;
+    },
+  },
+});
+export const { updatePageFirstLoad } = locationPermissionSlice.actions;
+export default locationPermissionSlice.reducer;
diff --git a/frontend/front/src/redux/store.js b/frontend/front/src/redux/store.js
@@ -5,6 +5,7 @@ import { breadcrumbsReducer } from "../features/breadcrumb/breadcrumbSlice";
 import { loginReducer } from "../features/login/loginSlice";
 import navReducer from "../features/nav/navSlice";
 import surveyorReducer from "../features/surveyor/surveyorSlice";
+import locationPermissionReducer from "../pages/Surveyor/dashboard/locationPermissionSlice";
 
 export const createStore = (options) =>
   configureStore({
@@ -14,6 +15,7 @@ export const createStore = (options) =>
       breadcrumbs: breadcrumbsReducer,
       login: loginReducer,
       surveyor: surveyorReducer,
+      locationPermissionPage: locationPermissionReducer,
       // apis
       [apiSlice.reducerPath]: apiSlice.reducer,
     },