Expo location permissions is not being granted after updating from Expo SDK 40 to SDK 42

Question

My project was previously in Expo SDK 40, but I had to upgrade it to SDK 42. There is a component of my app where the user may want to see their current location on a map, but I keep getting an error thrown. The permission is granted in the initial screen, but the location is not carried over to the new map. Below is some of my code:

//This code correctly asks the user for permission to access their current location before they make it to the map

useFocusEffect( 
      React.useCallback(()=> {
        let isActive = true;

        async function getLocationAsync() {

          const { status } = await Location.requestForegroundPermissionsAsync()
              if (status !== 'granted'){
                  setErrorMsg('Permission to access location was denied')
                  return;      
                } 
                let location = await Location.getCurrentPositionAsync({});
                setLocation(location);
    }

//This is the code before it was updated that requested and displayed their location in Expo SDK 40

useFocusEffect( 
      React.useCallback(()=> {
        let isActive = true;
        
          const fetchGeoPosition = () => { 
            navigator.geolocation.getCurrentPosition(
              position => { 
                if (isActive){
                  setUserLatitude(position.coords.latitude);
                  setUserLongitude(position.coords.longitude);
                  setPositionError(null);
                  console.log('Location Accessed')
                }
                setIsLoading(false)
              }, 

              error => isActive && setPositionError(error.message),
              {enableHighAccuracy: true, timeout: 20000, maximumAge: 2000}
            ); 
              }
...
    fetchGeoPosition()

//How the location renders on the map

<MapView
       provider= {PROVIDER_GOOGLE}
       style={styles.map}
             region={{
                     latitude: user_latitude,
                     longitude: user_longitude,
                     latitudeDelta: 0.015,
                     longitudeDelta: 0.0121
                    }}
 >

//This is my attempt to update the current location code, but still tells me the previous method is depreciated

 useFocusEffect( 
      React.useCallback(()=> {
        let isActive = true;
        
          async function fetchGeoPosition() { 
            const {status} = await Location.requestForegroundAsync()
              if (status !== 'granted'){
                setErrorMsg('Permission to access location was denied')
                return;
              }
              let location = await Location.getForegroundPositionAsync({})
              setLocation(location)
              navigator.geolocation.getForegroundPosition(
              position => { 
                if (isActive){
                  setUserLatitude(position.coords.latitude);
                  setUserLongitude(position.coords.longitude);
                  setPositionError(null);
                  console.log('Location Accessed')
                }
                setIsLoading(false)
              }, 
              error => isActive && setPositionError(error.message),
              {enableHighAccuracy: true, timeout: 20000, maximumAge: 2000}
              )
     
              }
...
fetchGeoPosition()

<MapView
           provider= {PROVIDER_GOOGLE}
           style={styles.map}
                 region={{
                         latitude: user_latitude,
                         longitude: user_longitude,
                         latitudeDelta: 0.015,
                         longitudeDelta: 0.0121
                        }}
     >