Removing delay of presenting BottomSheetModal - Where to call present method?

[theMasix]

Hello.
Since BottomSheetModal needs to be presented before expanding, 2 approaches might be applied to show bottom sheet:

1. configuring snapPoints and index to be expanded by default, then after calling present method, bottom sheet will pop up. The issue is if we omit expand method and only call present to show bottom sheet, then it has some delay for mounting process.
2. configuring bottom sheet not to be shown on mount, then calling present on screen where bottom sheet component exists, after mounting, we could show the bottom sheet with expand method instantly.

My question is, since we don't want have any delay before showing bottom sheet and we have to use BottomSheetModal (we have some tab navigators that should be under bottom sheet), then where should we call present?
Should we call present method in useFocusEffect (we use react-navigation to handle screens)? Should it be called in useLayoutEffect or what?

In first approach where we call present in useFocusEffect then the bottom sheet ref might not be passed to bottom sheet component and present method might be null. We could handle it with setTimeout in useFocusEffect but it's ugly and isn't the correct approach I think.

Any Idea? Thanks

[pouyarezvani]

@theMasix I see your post is from May 2nd. Have you found any solution to your delay issue? We are experiencing the same issue. There is a bit of delay before BottomSheetModal is presented.
@gorhom Would you be able to see into this if possible, please?
Thanks.

[theMasix]

Unfortunately No. Although the delay is much shorter in production builds, but we haven't reached a good solution to solve it completely yet. The library is cool but its community is not active :(

[gorhom]

Could you test on ‘v4’ ?

[jparkrr]

I'm also trying to make the sheet visible on mount.

@gorhom I've tested in on v4, and am running into #505

I presume it's calculating some values for the layout before it gets shown? Do you know much we can expect this to be reduced when v4 gets released?

Thanks for your work!

[theMasix]

I noticed that the #505 is fixed now. Is the delay fixed in v4 or not yet? @jparkrr

[theMasix]

I completely solved the issue by using gorhom/react-native-portal instead of BottomSheetModal component.

don't know why the BottomSheetModal has some delay on mount!

[pouyarezvani]

I changed the expand(1) to ref.current?.snapTo( 2, 500 )
And My snapPoints are snapPoints={[ 0,'25%', '50%' ]}
And my Index is index={-1}.

^ This is not working as expected behavior

[pouyarezvani]

@tgecty any luck on the snack?

[bryanprimus]

still an issue. the delay is annoying. i believe this happen because the BottomSheetModal isn't mounted by default. maybe it takes time to be mounted the first time?

[Karthik-B-06]

Hey, for me personally, the Bottomsheet Modal is presented properly, but when closed, I am unable to quickly interact with the screen. There is a delay. Is anyone facing this issue?

[dkahdwk]

@Karthik-B-06 After closing the bottomSheetModal, you need to open another bottomSheetModal quickly, but there is a delay. In the end, there was no solution, so I replaced it with a normal Modal.