How to use BottomSheet inside model - react-native

Question

I want to add bottom sheet in Modal. I am using reanimated-bottom-sheet and react native modal.
But when I use BottomSheet inside Modal gesture not work and can't closeBottomSheet with swiping down.
I searched and I found this is RCGH problem.
So I decide to use View instead of Modal.
but View doesn't cover Header.
This is bottomSheet code:
<View style={BottomSheetStyles.container}>
<TouchableWithoutFeedback onPress={handleOutsidePress}>
<Animated.View style={[BottomSheetStyles.dropShadow, { opacity }]} />
</TouchableWithoutFeedback>
<Animated.Code exec={onChange(position, [cond(eq(position, 1), call([], onClose))])} />
<BottomSheet
ref={sheet}
initialSnap={zeroIndex}
snapPoints={snapPoints}
callbackNode={position}
renderHeader={() => <View style={BottomSheetStyles.header} />}
renderContent={() => (
<View style={[BottomSheetStyles.content, { height: "100%" }]}>{children}</View>
)}
/>
</View>
and this is styles:
const BottomSheetStyles = StyleSheet.create({
container: {
position: "absolute",
top: 0,
left: 0,
right: 0,
bottom: 0,
flex: 1,
zIndex: 100,
},
dropShadow: {
position: "absolute",
top: 0,
left: 0,
right: 0,
bottom: 0,
flex: 1,
zIndex: 100,
backgroundColor: "rgba(0, 0, 0, 0.3)",
},
header: {
backgroundColor: Colors.greyC4C,
width: 90,
height: 7,
margin: 5,
alignSelf: "center",
borderRadius: 11,
},
content: {
backgroundColor: Colors.whiteFFF,
paddingTop: 18,
borderTopLeftRadius: 22,
borderTopRightRadius: 22,
},
});
So problem can be solve either whit solving gesture in Modal or do something to cover Header with View.
I am using React Navigation.