react-native-ui-datepicker

react-native-ui-datepicker copied to clipboard

when the calendar prop is set to jalali and max date is also set for today, when I select 11th of Farvardin, the days after 11th of farvardin get disabled. (today date is 27th of farvardin). I randomly checked other dates and only 11th of farvardin 1404 has the problem.

I also tried setting disabledDates property instead of maxDate, the issue still existed.

this is my code:

export const CalendarDatePickerModal: React.FC<ICalendarDatePickerModalProps> = ({
  isModalVisible,
  setIsModalVisible,
  onConfirm = () => {},
  value,
}) => {
  const { t } = useTranslation();
  const defaultStyles = useDefaultStyles();
  const [selected, setSelected] = useState<DateType>(value ? new Date(value) : undefined);
  const today = new Date();
  const handleConfirm = () => {
    if (selected) {
      onConfirm(selected?.toString());
    }
    setIsModalVisible(false);
  };

  return (
    <Modal transparent={true} visible={isModalVisible} onRequestClose={() => setIsModalVisible(false)}>
      <View style={styles.modalContainer}>
        <View style={styles.backDrop} />
        <View style={styles.calendarContainer}>
          <DateTimePicker
            mode="single"
            calendar="jalali"
            date={selected}
            onChange={({ date }) => setSelected(date)}
            maxDate={today}
            firstDayOfWeek={6}
            timeZone="Asia/Tehran"
            locale="fa"
          />
          <View style={styles.buttonContainer}>
            <Button variant="primary" size="small" fullWidth={false} onPress={handleConfirm}>
              {t('Confirm')}
            </Button>
            <Button
              variant="secondary"
              textOnly
              size="small"
              fullWidth={false}
              onPress={() => setIsModalVisible(false)}
            >
              {t('Close')}
            </Button>
          </View>
        </View>
      </View>
    </Modal>
  );
};