Is it possible to render the calendar with a highlighted day without the need to select the day?

[Vasault]

so my idea is to whenever i get to this screen, the current day should be highlighted, but the only way this works, is to actually select the current day., this is my code.

              <CalendarStrip
                  useIsoWeekday={false}
                  startingDate={fecha}
                  showMonth={false}
                  calendarHeaderContainerStyle={styles.calendarHeaderContainerStyle}
                  calendarColor={'#FFFFFF'}
                  style={styles.calendarStripContainer}
                  daySelectionAnimation={Constants.calendarOptions()}
                  onDateSelected={async (date) => {
                    DataManager.FechaActual = Moment(date).format('YYYY-MM-DD');
                    await setFechaActual();
                  }}
                  dateNumberStyle={styles.calendarStripMediumText}
                  dateNameStyle={styles.calendarStripLowText}
                  highlightDateNumberStyle={styles.enabledDate}
                  highlightDateNameStyle={styles.enabledDate}
                  disabledDateNameStyle={styles.disabledDate}
                  disabledDateNumberStyle={styles.disabledDate}
                  customDatesStyles={customDatesStylesFunc}
                  disabledDateOpacity={1}
                  leftSelector={[]}
                  rightSelector={[]}
                  iconContainer={{flex: 0.1}}
                />

[Vasault]

basically what i need is to trigger the onSelectedDay event on the useEffect(), how do i call the onSelectedDay event in react hooks?. ps: i tried the selectedDay, but that just selects the date, i need the onpress event to call the my api

[peacechen]

Your code snippet shows that customDatesStyles is passed in. The customDatesStylesFunc can highlight any date that you wish (e.g. today which can be constructed with moment())

[Vasault]

Your code snippet shows that customDatesStyles is passed in. The customDatesStylesFunc can highlight any date that you wish (e.g. today which can be constructed with moment())

this is my current customDatesStyles

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

[peacechen]

It looks like horaActual is defined in your component and is the date that you want highlighted. That should work as you expect. What is the specific behavior that you want to achieve? Is it to scroll to the date horaActual? You shouldn't need to rely on the onSelectedDay callback to update the rest of your component. Simply update the appropriate state to trigger useEffect. This sounds like more of a general React question. I recommend creating a sample project on Expo and also post on StackOverflow.

[Vasault]

yeah sorry i guess with the onSelectedDay is fair enough for what i'm looking for