HosseinShabani / react-native-modern-datepicker

A customizable calendar, time & month picker for React Native (including Persian Jalaali calendar & locale)
MIT License
574 stars 162 forks source link

RangeError: Array size is not a small enough positive integer. #76

Open MshHooman opened 2 years ago

MshHooman commented 2 years ago

hi, sometimes when i want to open the datepicker , see application crash. this happen very rarely and mostly on production version.

finally i found this error on my sentry server :

Error: RangeError: Array size is not a small enough positive integer.

app:///index.android.bundle in getMonthDays at line 930:4671 app:///index.android.bundle at line 926:404 app:///index.android.bundle in useMemo at line 97:45738 app:///index.android.bundle in Days at line 926:371

in Days (at Calendar.js:32)
in RCTView (at createAnimatedComponent.js:144)
in AnimatedComponent (at createAnimatedComponent.js:194)
in ForwardRef(AnimatedComponentWrapper) (at Calendar.js:31)
in RCTView (at Calendar.js:30)
in RCTView (at Calendar.js:21)
in Calendar (at DatePicker.js:77)
in RCTView (at DatePicker.js:90)
in DatePicker (at CustomDatePicker.js:67)
in RCTView (at CustomModal.js:45)
in TouchableWithoutFeedback (at CustomModal.js:44)
in RCTView (at createAnimatedComponent.js:144)

and this my code :

   <>
  <Input
    onFocus={this.onHandleFocus}
    placeholder={placeholder}
    value={selectedDate}
    withoutLabel
    errorMessage={errorMessage}
  />
  <CustomModal onRequestClose={this.handleClose} modalVisible={modalVisible}>
    <DatePicker
      options={{
        mainColor: primaryBlue700,
        defaultFont: "YekanBakh-Medium",
      }}
      isGregorian={false}
      selected={selectedDate}
      current={selectedDate}
      mode="calendar"
      onDateChange={(newDate) => this.handleDateChange(newDate)}
    />
  </CustomModal>
</>
MrSinaRJ commented 2 years ago

I know it's been 2 months and my answer may not help you, but it may help some future people facing this problem.

The problem is "This package only works with 'English' digits for numbers", Therefore you can't use any kind of localization to change Numbers into Persian or Arabic digits. you are forced to feed the app only 'English' digits.

I'm using some digit changer functions to change persian2english where I want to feed the component and english2persian where I want to show the numbers in Text or other places.

here the functions (I found them somewhere and don't have access to source, so I just copy the code) :


export const e2a = (s) => s.replace(/\d/g, (d) => "٠١٢٣٤٥٦٧٨٩"[d]);

export const p2e = (s) => s.replace(/[۰-۹]/g, (d) => "۰۱۲۳۴۵۶۷۸۹".indexOf(d));
export const a2e = (s) => s.replace(/[٠-٩]/g, (d) => "٠١٢٣٤٥٦٧٨٩".indexOf(d));

export const p2a = (s) =>
  s.replace(/[۰-۹]/g, (d) => "٠١٢٣٤٥٦٧٨٩"["۰۱۲۳۴۵۶۷۸۹".indexOf(d)]);
export const a2p = (s) =>
  s.replace(/[٠-٩]/g, (d) => "۰۱۲۳۴۵۶۷۸۹"["٠١٢٣٤٥٦٧٨٩".indexOf(d)]);