Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Crash when trying to change years #59

Open
agrifriend opened this issue Feb 3, 2024 · 4 comments
Open

Crash when trying to change years #59

agrifriend opened this issue Feb 3, 2024 · 4 comments

Comments

@agrifriend
Copy link

Bug Description
I tried to implement this library on my React-Native app, but when I try to change the calendar's year by pressing the year on the calendar's header, the app immediatly crashed with the message:

TypeError: years.at is not a function. (In 'years.at(0)', 'years.at' is undefined)

Steps to Reproduce
I used the lib in a pretty straight-forward way, nothing special and no particular manipulations, in "single" mode:

  1. Press the year on the top part of the calender
  2. Crash

Code

<DateTimePicker
    date={currentValue ? currentValue : new Date()}
    mode="single"
    onChange={({date}) => {onChangeValue(parseDateObject(date))}}
    maxDate={new Date()}
    dayContainerStyle={{backgroundColor: colors.white, borderRadius: wp(2)}}
    headerContainerStyle={{borderBottomColor: colors.lighterGray2, borderBottomWidth: 1}}
    headerTextStyle={{fontSize: 20, backgroundColor: colors.white, borderRadius: wp(1), padding: wp(1)}}
  />

Screenshots

Additional Information
expo: 47.0.12,
react: 18.1.0,
react-native: 0.70.5,
react-native-ui-datepicker: 2.0.0

@agrifriend
Copy link
Author

Ok, tried to manage to avoid it by making a slight tweak to the source code.

I changed file react-native-ui-datepicker\src\components\Header.tsx at line 110 from this:

<View style={[styles.textContainer, theme?.headerTextContainerStyle]}>
  <Text style={[styles.text, theme?.headerTextStyle]}>
    {calendarView === CalendarViews.year
      ? `${years.at(0)} - ${years.at(-1)}`
      : dayjs(currentDate).format('YYYY')}
  </Text>
</View>

To this:

<View style={[styles.textContainer, theme?.headerTextContainerStyle]}>
  <Text style={[styles.text, theme?.headerTextStyle]}>
    { dayjs(currentDate).format('YYYY') }
  </Text>
</View>

I'm not creating a pull req for that because I assume the line I removed is supposed to do something

@farhoudshapouran
Copy link
Owner

Maybe you don't need to use parseDateObject in your onChange method, you can use the date passed from the onChange method to update your date value.

Or if you can provide your parseDateObject details so I can test it.

@farhoudshapouran
Copy link
Owner

Please check the latest (v2.0.1) version

@cagataykapuagasi
Copy link

Same issue on android

react-native: 0.71.6
react-native-ui-datepicker: 2.0.2

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants