Need to refresh three times to get all the values with hooks

Question

Hello I am trying to get all the date between each start date and end date and then put these dates inside my react-native-calendar component. Everything work but actually I need to CTRL + S three time my project to have the values inside my calendar, do you have any idea how to have it directly ?

Here is my code :

const myConstrucion = async () => {
    let user_id = await AsyncStorage.getItem('user_id');
    const _id = user_id;

    try {
        let res = await axios.get(`https://myseenapp.herokuapp.com/constructionSite/${_id}`);
        let data = res.data;
        setConstruction(data);
        let st = data
        .map(e => e.startDate.split("-").reverse().join("-"))
        .forEach((day) => { setStartDate(day)})
        let et = data
        .map(e => e.endDate.split("-").reverse().join("-"))
        .forEach((day) => { setEndDate(day)})
        let now = moment(startD);
        let end = moment(endD);
            while (now <= end){
                dateArray.push(now.format("YYYY-MM-DD"));
                now.add(1, 'days');
                dateArray.forEach((day) => {
                    newDaysObject[day] = {
                        textColor: "white",
                        color: 'gold',
                        selected: true,
                    }
                    return dateArray;
                })
            }
    }
    catch (err) {
        console.log(err)
    }
};

I have also my useEffect :

useEffect(() => {
    myConstrucion()
}, [])

Answer 1

I can't test at the moment. By the way using [] in userEffect is bad practice.

This way you are telling useEffect to not whatch for any dependency, just run the first time. In that array one should put the variable to check for change, try

useEffect(() => {
  myConstrucion()
}, [_id])