I am inserting a map in my application. I used react-native-maps, and it renders fine. However, I find myself completely unable to get location permissions to work.
For context, I have tried using both the React-native-permissions and expo-location.
with both, attempting to request location permission does not display any dialog to screen in my app. I am not sure why.
from my app.json:
"react-native-permissions",{
"iosPermissions": ["Camera","Microphone","LocationAlways","LocationWhenInUse" ] }```
from my permission request component (I know it's pretty sloppy, i'm just trying to ensure that it works before I clean it up):
export function RequestPermissions(permission_number: number) { let permissionText: number = 0; RNPermissions.request(PERMISSIONS.IOS.LOCATION_WHEN_IN_USE).then((status) => { switch (status) { case RESULTS.UNAVAILABLE: console.log('This feature is not available (on this device / in this context)'); //really i should return a number here to indicate the permission status so that the next step permissionText =1; return permissionText; case RESULTS.DENIED: console.log('The permission has not been requested / is denied but requestable'); permissionText = 2; return permissionText; case RESULTS.BLOCKED: permissionText =3; console.log('The permission is denied and not requestable'); return permissionText; case RESULTS.GRANTED: console.log('The permission is granted'); permissionText =4; return permissionText; case RESULTS.LIMITED: console.log('The permission is granted but with limitations'); permissionText =5; return permissionText; } }); return permissionText; }
and finally, when I call
import { View, StyleSheet, Text } from 'react-native';import MapView from 'react-native-maps';import { RequestPermissions, CheckPermissions } from '@/components/TryPermissions';import * as Location from "expo-location";import { PermissionStatus } from 'expo-location';const MapScreen: React.FC = () => { return (<View style={styles.container}><MapView style={styles.map} initialRegion={{ latitude: 37.78825, longitude: -122.4324, latitudeDelta: 0.0922, longitudeDelta: 0.0421, }} /></View> );};const ReadyMap: React.FC = () => { const [hasPermission, setHasPermission] = useState<boolean | null>(null); let checkpermssionrequestex: number = 0; useEffect(() => { const checkAndRequestPermissions = async () => { let permissionStatus = await CheckPermissions(1); // Check for location permission if (permissionStatus !== 4) { permissionStatus = await RequestPermissions(1); // Request location permission checkpermssionrequestex = permissionStatus; } setHasPermission(permissionStatus === 4); }; checkAndRequestPermissions(); }, []); if (hasPermission === null) { return <Text>Loading...</Text>; // Show a loading state while checking permissions } if (!hasPermission) { console.log(PermissionStatus); alert("permssion request returned negative, loading map with default location"); return <MapScreen />; } return <MapScreen />; // Render the map if permission is granted};const styles = StyleSheet.create({ container: { flex: 1, }, map: { flex: 1, },});export default ReadyMap;Note: This will render map, but instead of asking for permission it jumps straight to permission denied. I am running a developer build on an actual device. I am assuming there is a problem with my code and thus, haven't included all the specs, but can provide more info if necessary.As always, I appreciate any assistance.