react-native check and prompt user to enable Network/GPS

Question

I am looking around on how to check if network or GPS are enabled on a device when my application starts. And if they are disabled prompt the user to enable it.

Is this posible in React-native?, and is there any class or tool that could help with this type of dialogs?

Answer 1

So I am going to start answering my own question.

For GPS:

there seems to be a sensible solution. IOS seems to natively request if there is a geolocation request. And for Android this is not natively supported but someone has created a module for that ( https://github.com/webyonet/react-native-android-location-services-dialog-box )

so in my action creator I added the next code:

if(Platform.OS === 'android') LocationServicesDialogBox.checkLocationServicesIsEnabled({                  message: "<h2>Use Location?</h2> \                             This app wants to change your device settings:<br/><br/>\                             Use GPS for location<br/><br/>",                  ok: "YES",                  cancel: "NO"              }).then(() => {                  locationTracking(dispatch, getState, geolocationSettings)             }) 

For Network: There is no native support for neither so i end up doing my own action creator to check.

export function networkCheck(){   return (dispatch) => {     const dispatchNetworkState = (isConnected) => dispatch({       type: types.NETWORK_STATE,       state: isConnected     })     const handle = () => NetInfo.isConnected.fetch().done(dispatchNetworkState)     NetInfo.isConnected.addEventListener('change', handle);   } } 

A little extra:

for GPS i added this to check if the user goes and disable GPS on the middle of the task.

export function locationCheck(geolocationSettings = {enableHighAccuracy: true, timeout: 20000, maximumAge: 10000, distanceFilter:10}){   return (dispatch) => {     navigator.geolocation.watchPosition(         () => {             dispatch({                 type: types.LOCATION_STATE,                 state: true             })         },         () => {             dispatch({                 type: types.LOCATION_STATE,                 state: false             })         },         geolocationSettings)   } }