So I have two similar Arraystate.camData and data.camData that contain some data, one of which is an Array of Events.

I would like to keep data.camData but also concat it Events with state.camData Events.

here is just return a concatenated list of Events only. I lose the other elements inside camData such as ID. I am not sure how I can keep those and update just the Events.

camData.Events.length //100
state.camData.Events.length //100

let camEvents = data.camData.map((camData) => {
  return camData?.Events.concat(state?.camData[camData.CamID]?.Events)  
});

console.log(camEvents[0].length); //200

since I was not able to keep the original value on the map, I am now reassigning camEvents to the data.camData

for (let i = 0; i < camEvents.length; i++) {
  data.camData[i].Events = camEvents[i].Events;
}

However, I don't understand why the number is still 100 and not 200 as camEvents[0].length

console.log("data.camData", data.camData[0].Events.length); //100

The Arrays look like this

[
{CamId: 1, LastStatus: 'ONLINE', Events: Array(100)}
{CamId: 2, LastStatus: 'ONLINE', Events: Array(100)}
{CamId: 3, LastStatus: 'ONLINE', Events: Array(100)}
{CamId: 4, LastStatus: 'ONLINE', Events: Array(100)}
{CamId: 5, LastStatus: 'ONLINE', Events: Array(100)}
{CamId: 6, LastStatus: 'ONLINE', Events: Array(100)}
{CamId: 7, LastStatus: 'ONLINE', Events: Array(100)}
{CamId: 8, LastStatus: 'ONLINE', Events: Array(100)}
]