I'm attempting to create a multi-context modal in my RN Expo app whereby I have one global modal component that can be triggered from anywhere within my app, but I can specify which view to show upon opening the modal. So I will have a "create" and "edit" modal.

The modal seems to work fine on my web browser, but via Expo Go on Android it doens't work as expected. I have implemented a local modal also within my page to test and this works fine on both.

This would suggest that there is either an issue with the way I am implementing my global modal, or there is a way to do this that I haven't yet encountered. I have more experience with React rather than RN, so for me the way this has been done makes sense and should work, but I'm stuck as to why it's going wrong on mobile.

You can see from the mobile screenshot that when the global modal is triggered, a dark overlay is cast but there is no actual modal in view.

Note: I am using @react-navigation/drawer in this app, and you will see from the code below that the modal lives outside of that drawer navigator.

Screenshots