(temporarily) disable native navigation

Hello   For a native app, I need to show a PIN lock screen when app is resumed. I already implemented the Page and also show it as desired on the OnResume app event. BUT, I’m still able to close this page/pop up, by just using the mobile device’s back navigation (swipe gesture). Also, clearing the stack history on showing the lock page is not the solution (because I still need it. of course). Is there a way to temporarly disable the navigation, or just disable it on specific page?   Or the other way around: Is there a better way to implement my task?   Thanks in advance.
1 answers

I haven’t thought of a better solution yet, so here’s how I’d approach this. Note it will require some JS code:

  • Use my Nav Exposer widget to expose the React Navigation object. You just have to drop this once on the home page of the app.
  • Now global.navigation will access the navigation object from a JS action
  • So then on resume, you call a nanoflow that will call:
    • A new JS action, where you implement the logic from this guide to prevent the user from going back
    • Show the page
  • When the user successfully completes the PIN entry:
    • In a new JS action, remove the listener created in the previous JS action so the back action will work again
    • Close the page