Android - Undefined is not a function / NativeModule.closePicker()

[Alissonfm]

Describe the bug
On the RN old arch, but using Hermes, if you try to programatically dismiss the picker, in my EX below:

I have a hook watching the user interaction with the app, if he became idle for 5 min, we trigger logout due to sensitive data, so before the page/component unmount I tried to set the 'open' prop of the picker as false, in modal mode of course, and then I got this error, I checked the native code for android, the old arch one and its missing the closePicker function...

the path to the file where the closePicker is missing:
react-native-date-picker/android/src/oldarch/java/com/henninghall/date_picker/DatePickerModule.java

on iOS it work as expected.

Expected behavior
Dismiss the picker modal when passing a bool false to the 'open' modal prop

To Reproduce
tried to set the 'open' prop of the picker as false, in modal mode of course, and then I got this error, I checked the native code for android, the old arch one and its missing the closePicker function...

``
const [picker, setPicker] = useState(null);

const programaticallyDismissTimePicker = useCallback(() => {
setPicker(null);
}, [])

useEffect(() => {
const removeListener = navigation.addListener('beforeRemove', programaticallyDismissTimePicker)
return () => {
removeListener();
}
}, [programaticallyDismissTimePicker, navigation]);`

[...]

return (
<DatePicker
modal
title="Stel de gewenste tijd in"
open={!!picker}
date={new Date()}
mode="time"
cancelText="Annuleren"
confirmText="Selecteren"
onConfirm={(date) => {
addTimeslot(date, picker);
setPicker(null);
}}
onCancel={() => {
setPicker(null);
}}
/>
)
``

Smartphone (please complete the following information):

• OS: Android
• React Native version: 0.71.8
• react-native-date-picker version: 4.3.5

[nnabinh]

@henninghall I got the same issue as described here. Can you take a look?

[nnabinh]

@Alissonfm As a workaround, you can optionally render the component without using open prop.

shouldShowDatePicker && <DatePicker open ... />

[henninghall]

Hi, thanks for reporting this. Please provide a repo where this is reproducible and I can investigate this.

[devevecare]

Had the same issue, so steps to reproduce, Have a button on screen 1 which opens up the datepicker, open and set date and then go to inner screen and come back to first screen it throws error

Screen 1:

const [showDatepicker, setShowDatepicker] = useState(false);
const [selectedDate, setSelecteDate] = useState(new Date());
const showCalendar = useCallback(() => {
    setShowDatepicker(true);
  }, []);
  const hideCalendar = useCallback(() => {
    setShowDatepicker(false);
  }, []);
  const onChangeDate = useCallback((date: Date) => {
    setSelecteDate(date);
    setShowDatepicker(false);
  }, []);
  
  return (<DatePicker
            modal
            open={showDatepicker}
            date={selectedDate}
            mode="date"
            onConfirm={onChangeDate}
            onCancel={hideCalendar}
          />)

Go to some inner screen and try to come back and use the same button to open the datepicker again.

[MahmoudNafiseh]

@devevecare I made a pr that should fix this issue. #782

[henninghall]

Thanks for the PR @MahmoudNafiseh, the fix is released in version 4.4.1

[devevecare]

Thanks for the PR @MahmoudNafiseh the fix works fine. 👍