[Bug][Android]: Conflict with react-native-modal when Fabric/new architecture enabled

[Dat-Mobile]

Version

v5

Reanimated Version

v3

Gesture Handler Version

v2

Platforms

Android

What happened?

The modal shows up with blank background and its children are collapsed
I already created the bug but it was marked as invalid #2166

Reproduction steps

Place both components in the same screen then the issue happen:

import Modal from "react-native-modal";
import BottomSheet, {...} from "@gorhom/bottom-sheet";

This issue only happen if:

• New architecture enabled
• On Android, both debug and release
• (react-native-modal) and in the same screen

Here's the button I press to open the react-native-modal:

Then the modal shows up with blank background and its children are collapsed

When I remove from the screen, the works fine again

Reproduction sample

https://snack.expo.dev/@liudmyla.chubar/drag-down-issue

Relevant log output

Reproduction sample above is not of the issue!!
I only use it so that the issue won't marked as invalid

[nemoneph]

Same issue but with Modal directly from react-native.

[rklomp]

I am also seeing this issue when trying to use Modal from 'react-native' in combination with BottomSheet from '@gorhom/bottom-sheet' (v5.1.1).

My app has a FlashList with items. A BottomSheet containing a BottomSheetScrollView is used to show filtering options for the list.
With new arch disabled, clicking an item in the list opens the modal as expected.
When creating a new build with new arch enabled, clicking an item will not show the modal content, but makes the the screen unresponsive to any input. So some kind of overlay is rendered, but the modal itself is not visible.

Whenever I remove the BottomSheet from the view everything is working as expected.

This issue is blocking me from moving to new arch.

[danish5454]

any solution ?

[github-actions]

This issue is stale because it has been open 30 days with no activity. Remove stale label or comment or this will be closed in 5 days.

[rklomp]

Still an issue

[thanhcuong1990]

This issue still happens with React Native 0.78.2

[danish5454]

@thanhcuong1990 RN 0.76.3 is also experiencing the same issue.

[msphn]

clean your keyboard bro

[danish5454]

clean your keyboard bro

I'm not using any input fields. Simply opening the modal after the bottom sheet closes.

[tmak1990]

the issue still remains. any fixes?
I need to use Modal from react-native, and react-native-modal library as well...

[rklomp]

Unfortunately I have not found a solution yet.

@gorhom Do you have any idea what could cause this?

[poupsipoups]

Hey I have the exact same issue. The modal is stuck at the top left corner and freeze all the screen