After copying array, why can't I edit nested array?

Question

I'm trying to edit an array by removing a specific date. I'm using React18 and Redux Toolkit holds the original array, but for some reason after copying it, I cannot edit the array. Here is the current error message;

"Uncaught TypeError: Cannot assign to read only property 'dates' of object '#'"

What is wrong with my approach?

 import { useDispatch, useSelector } from "react-redux";
 import { setCurrentMonthBookings } from "./location";

 const Component = () => {
  const { booking, currentMonthBookings } = useSelector(state => state.calendar);

  const handleDelete = () => {
   let reservations = currentMonthBookings.slice();

   const bookingIndex = reservations.findIndex(
      (curBooking) =>
     curBooking.date === booking.date && curBooking.id === booking.id,
   );

   const newDates = reservations[bookingIndex].dates.filter(
     (date) => date !== booking.date,
   );

   reservations.splice(bookingIndex, 1);

   reservations.forEach((reservation) => {
     if (reservation.id === booking.id) {
       reservation.dates = newDates; //error happens here...
     }
   });

   dispatch(setCurrentMonthBookings(reservations));
  }

 return (
    <div>
     <button onClick={handleDelete}>Delete It</button>
    </div>
 );
}

export default Component;

What the booking object looks like...

{ 
  date: "2022-05-03",
  dates: (2) ['2022-05-03', '2022-05-04'],
  guestId: "1938479385798579",
  id: "9879287498765"
}

The currentMonthBookings array is a series of booking objects.

Thank you for your replies.