-
Notifications
You must be signed in to change notification settings - Fork 394
Description
I am using the modal component from React Native. When I close the modal for the first time, it shows the previous modal. This might be happening in version 0.78.2.
import React, { useContext } from "react";
import {
Modal,
StyleSheet,
Pressable,
View,
TouchableOpacity,
Text,
Image,
Alert,
} from "react-native";
import ImagePicker from "react-native-image-crop-picker"; // Assuming Image is imported from 'react-native-image-crop-picker'
import AppUtils from "../../utils/appUtils";
import { hp, wp } from "../../utils/dimension";
import AppFonts from "../../constants/fonts";
import { useNavigation, useTheme } from "@react-navigation/native";
import { BlurView } from "@react-native-community/blur";
import { LocalizationContext } from "../../localization/localization";
interface CustomImagePickerModalProps {
visible: boolean;
attachments: (image: Image) => void;
pressHandler: () => void;
crossPress?: () => void;
cameraOnpress?: () => void;
galleryOnpress?: () => void;
setvisble?:any
ondismiss?:()=>void
}
const CustomImagePickerModal: React.FC = ({
visible,
crossPress,
cameraOnpress,
galleryOnpress,
attachments,
pressHandler,
ondismiss
}) => {
const { images, colors } = useTheme() as any;
const { localization } = useContext(LocalizationContext) as any;
const openCamera = () => {
ImagePicker.openCamera({
width: 400,
height: 400,
cropping: false,
mediaType: "any",
}).then((image: Image) => {
attachments(image);
pressHandler();
});
};
const navgation = useNavigation();
return (
visible && (
<Modal
key={"12234"}
visible={visible}
animationType="fade"
transparent={true}
onDismiss={() => {
ondismiss && ondismiss();
}}
<BlurView
style={{
position: "absolute",
top: 0,
bottom: 0,
right: 0,
left: 0,
}}
blurType="light"
blurAmount={3}
reducedTransparencyFallbackColor="white"
{localization?.appkeys?.select}
<Pressable
onPress={() => {
crossPress();
}}
style={{ position: "absolute", top: hp(1.5), right: wp(4) }}
<Image
source={images?.crossIcon}
style={{
height: hp(3),
width: hp(3),
resizeMode: "contain",
}}
/>
ussage==>
{iseventdate && (
<DatePicker
key={"456444444"}
minDate={new Date()}
isVisible={iseventdate}
selectedDate={setselecteddata ? setselecteddata : new Date()}
mode={"date"}
onCancel={() => {
setIseventdate(false);
}}
onConfirm={(date: Date) => {
setIseventdate(false);
seteventcsetup({ ...eventcsetup, date: date.toString() });
setSetselecteddata(date);
}}
display={true}
maxDate={maxDate}
/>
</View>
)}
{uploadModal && (
<CustomImagePickerModal
key={"456234"}
visible={uploadModal}
galleryOnpress={() => {
setUploadModal(false);
setTimeout(() => {
openGallery();
}, 800);
}}
pressHandler={() => {
setUploadModal(false);
}}
cameraOnpress={() => {
console.log("hbjhvjhvjdh");
setUploadModal(false);
setIsModalVisible(true);
}}
crossPress={() => {
setUploadModal(false);
}}
ondismiss={() => {
setUploadModal(null);
}}
/>
</View>
)}