Appending default dates to array breaks when crossing into new year

I am working on a form component which creates a list of scheduled closure dates for retailers.

At the moment, I am having some difficulty with anything that crosses into the new year when setting default values.

For example, from a recent run here is my output:

Add initial set of closure dates:

[
    {
        "from": "2023-06-01",
        "to": "2023-06-08"
    },
    {
        "from": "2023-07-03",
        "to": "2023-07-08"
    },
    {
        "from": "2023-08-03",
        "to": "2023-08-08"
    },
    {
        "from": "2023-09-03",
        "to": "2023-09-08"
    },
    {
        "from": "2023-10-03",
        "to": "2023-10-08"
    }
]

Remove all but last added closure date, then add 4 more new closure dates:

[
    {
        "from": "2023-10-03",
        "to": "2023-10-08"
    },
    {
        "from": "2023-11-03",
        "to": "2023-11-08"
    },
    {
        "from": "2023-12-03",
        "to": "2023-12-08"
    },
    {
        "from": "2024-01-03",
        "to": "2024-01-08"
    },
    {
        "from": "2023-02-03",
        "to": "2023-02-08"
    }
]

Remove all but last 2 entries and add more closure dates:

[
    {
        "from": "2024-01-03",
        "to": "2024-01-08"
    },
    {
        "from": "2023-02-03",
        "to": "2023-02-08"
    },
    {
        "from": "2023-03-03",
        "to": "2023-03-08"
    },
    {
        "from": "2023-04-03",
        "to": "2023-04-08"
    },
    {
        "from": "2023-05-03",
        "to": "2023-05-08"
    }
]

How do I fix it? My code is below:

  const handleAddClosureDate = () => {
    if (closureDates.length < 5) {
      const fromDate = new Date();
      const toDate = new Date(fromDate.getTime() + 5 * 24 * 60 * 60 * 1000);

      const existingDates = closureDates.map((date) => ({ from: new Date(date.from), to: new Date(date.to) }));
      const lastDate = existingDates[existingDates.length - 1];

      fromDate.setMonth(lastDate ? lastDate.from.getMonth() + 1 : fromDate.getMonth() + 1);
      toDate.setFullYear(fromDate.getFullYear(), fromDate.getMonth());

      const currentYear = fromDate.getFullYear();
      fromDate.setFullYear(currentYear);
      toDate.setFullYear(currentYear);

      setClosureDates((previousDates) => [
        ...previousDates,
        { from: fromDate.toISOString().substring(0, 10), to: toDate.toISOString().substring(0, 10) },
      ]);
    }
  };

Hm that was a tricky one! <br />

fromDate.setFullYear(lastDate ? lastDate.from.getFullYear() : fromDate.getFullYear()); // <-- Add this line
fromDate.setMonth(lastDate ? lastDate.from.getMonth() + 1 : fromDate.getMonth() + 1);

Then you can remove this part:

const currentYear = fromDate.getFullYear();
// fromDate.setFullYear(currentYear); // <- Remove
toDate.setFullYear(currentYear);

Output:

{from: '2023-10-03', to: '2023-10-08'}
{from: '2023-11-03', to: '2023-11-08'}
{from: '2023-12-03', to: '2023-12-08'}
{from: '2024-01-03', to: '2024-01-08'}
{from: '2024-02-03', to: '2024-02-08'}

In this line:

fromDate.setMonth(lastDate ? lastDate.from.getMonth() + 1 : fromDate.getMonth() + 1);

If lastDate was on december, the getMonth() + 1 automatically sets the January to the next year. <br />
But because

const fromDate = new Date();

gets the current year, you need to set the fullYear based on the previous value from lastDate, similar to what you did with the months. <br />
Cheers!