BugiDev / BugiDev/react-native-calendar-strip

daySelectionAnimation stopped working out of nowhere

Open
#296 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
976
Forks
336
PR merge metrics
No merged PRs in 30d

Description

Hi all, not sure if the title sounds too direct, but is exactly how it is lol, I haven't touched this component in quite a while, like 2 months, and suddenly, out of nowhere, I decided to publish my app and a coworker tested the calendar strip and the date color didn't change whenever you press on any day of the week, the configuration hasn't changed, and I checked the documentation to see if the newer versions of the component changed anything, but look like it didn't.

here is the code

```
{
setEnable(false);
DataManager.FechaActual = Moment(date).format(
'YYYY-MM-DD',
);
await setFechaActual();
setEnable(true);
}}
highlightDateNumberStyle={styles.enabledDate}
highlightDateNameStyle={styles.enabledDate}
customDatesStyles={customDatesStylesFunc}
leftSelector={[]}
rightSelector={[]}
iconContainer={{flex: 0.1}}
/>
```

and here is a little gif

![Grabación de pantalla 2021-05-17 a la(s) 13 44 20](https://user-images.githubusercontent.com/15862547/118541432-a8469800-b71f-11eb-8186-9957b96a0196.gif)

only day 14 has information, the rest of the days are empty, but still, day selection is not getting colored

edit: forgot to post my customdatestyle

```
const customDatesStylesFunc = (date: any) => {
if (Moment(date).isSame(horaActual, 'days')) {
// dia actual
return {
dateNameStyle: {color: '#3066FA'},
dateNumberStyle: {color: '#3066FA'},
highlightDateNumberStyle: {color: '#3066FA'},
highlightDateNameStyle: {color: '#3066FA'},
};
}
if (Moment(date).isAfter(horaActual, 'days')) {
// dias posteriores
return {
dateNameStyle: {color: '#212B42'},
dateNumberStyle: {color: '#212B42'},
highlightDateNumberStyle: {color: '#212B42'},
highlightDateNameStyle: {color: '#212B42'},
};
}
if (Moment(date).isBefore(horaActual, 'days')) {
// dias previos
return {
dateNameStyle: {color: '#8E9CB4'},
dateNumberStyle: {color: '#8E9CB4'},
highlightDateNumberStyle: {color: '#8E9CB4'},
highlightDateNameStyle: {color: '#8E9CB4'},
};
}
};
```

Contributor guide

Open the contributing guide

Research direction

Start with the CalendarStrip component and reproduce the provided configuration, including daySelectionAnimation and customDatesStylesFunc. Compare the selected-day styling with the attached behavior; done means selecting any day visibly applies the configured background or date color.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react-native
Domain
mobile
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.