search

lodev09 / react-native-true-sheet

The true native bottom sheet experience 💩
https://sheet.lodev09.com
MIT License
395 stars 12 forks source link

Rendering `Modal` by react-native with default `presentationStyle` triggers onDismiss #33

Closed hirbod closed 3 months ago

hirbod commented 3 months ago

Hi,

In my video, you can see two scenes. The first time I click the connect button, it renders a Modal from react-native with default settings. This immediately invokes onDismiss, which triggers my route.back() function. However, it should not do that.

When I change the presentationStyle to “overFullScreen” (wait at the end of my video while I am hot refreshing) “pageSheet”, or “formSheet”, the issue is resolved.

https://github.com/lodev09/react-native-true-sheet/assets/504909/cfc38d09-e581-4222-89d0-39b5c57e26b8

Ideally it should work with the default presentationStyle as well.

lodev09 commented 3 months ago

Yeah, I think that's default behavior on IOS when handling the view controller. The RN modal presentation styles might be adjusting the container view controller automatically if shown as sheet (pageSheet or formSheet). You can see this in action in this guide, notice the parent is being dismissed temporarily while the child is being presented.

If overFullScreen isn't ideal, I would suggest to follow the stacking guide instead. You can also use RN navigation, see this guide

lodev09 commented 3 months ago

You can also try dismissing the sheet gracefully before showing the Modal. E.g:

await sheet.dismiss()
// show modal

Closing this for now. We don't have control on how view controllers are handled in IOS, sorry.

hirbod commented 3 months ago

I can't dismiss the sheet in time because it's handled by a third-party module. I pushed a PR to the breaking repo and added overFullScreen to fix the issue. This might be worth noting in the documentation.