Calendar picker doesn't show dates changes

[crazydeveloper09]

I am using this library in my app and I have a weird problem. The date in the state updates onDateChange, but the calendar doesn't show it in the view. I need to go to next month, then back and it shows the last chosen date as active. All the code is on Snack

But for first look I am going to post the co here

`import React, { useState } from "react"; import { View, Text, StyleSheet } from "react-native"; import CalendarPicker from 'react-native-calendar-picker';

const CalendarScreen: React.FC = () => { const [selectedStartDate, setSelectedStartDate] = useState<Date>(new Date()); const startDate = selectedStartDate ? selectedStartDate.toLocaleDateString() : '';

const onDateChange = (date: Date) => {
    setSelectedStartDate(date)
}

return (
    <View style={styles.container}>
        <CalendarPicker 
            startFromMonday={true}
            selectedDayColor="#97D7ED"
            todayBackgroundColor="#CBEBF6"
            months={['Styczeń', 'Luty', 'Marzec', 'Kwiecień', 'Maj', 'Czerwiec', 'Lipiec', 'Sierpień', 'Wrzesień', 'Październik', 'Listopad', 'Grudzień']} 
            weekdays={['Pon', 'Wt', 'Śro', 'Czw', 'Pt', 'Sob', 'Nd']}
            previousTitle="Poprzedni"
            nextTitle="Następny"
            onDateChange={onDateChange}
        />
        <Text>Wybrana data: {startDate}</Text>
    </View>
)

}

const styles = StyleSheet.create({ container: { padding: 15, justifyContent: 'center', alignItems: 'center' } })

export default CalendarScreen;`

[olimpic245]

the same problem for 8.0.1/8.0.2 version. 7.1.4 has no this bug

[peacechen]

8.x replaced Moment with Date-fns. Those changes may have inadvertently broken existing behavior. Try using this as a controlled component, passing in the selectedStartDate prop:

  selectedStartDate={selectedStartDate}

Depending on how the selectedStartDate state variable is stored, you may need to convert it to a Date-fns instance. A JS Date should work but I haven't tested it.

[mihailiftodi-D3]

I'm currently facing the same issue. Setting selectedStartDate={selectedStartDate} did not solve the issue

[peacechen]

@tranjog Do you have any insight into this?

[tranjog]

Sorry about the slow reply @peacechen and @crazydeveloper09 .

I think I got to the bottom of it. Please check my PR here: PR: 381

PS: You will need to add the selectedStartDate prop

[peacechen]

Thanks @tranjog for debugging and fixing this! PR is merged. Please publish at your convenience.

[tranjog]

Thanks for merging @peacechen! 8.0.3 is now published and should hopefully fix your issues @crazydeveloper09 @mihailiftodi-D3 @olimpic245