adding to elements in array of objects using React Hooks

Question

const roomData = [{
        name: 1,
        data: [{
                x: 102,
                y: 35
            },
            {
                x: 105,
                y: 40
            }
        ]
    },
    {
        name: 2,
        data: [{
            x: 104,
            y: 36
        }, {
            x: 105,
            y: 40
        }]
    }
}

This is my array.

(response.data).forEach((room) => {
            setRoomData(roomData => [...roomData, {
                name: room['floor'],
                data: [{
                    x: room['Roomnumber'],
                    y: room['room_temperature']
                }]
            }]);

This is how I set RoomData. I need to add another x and y pair in data property on fetching.How to do this using react hooks?

Answer 1

So to add data to room(s) with name of roomToChange you can use Array.prototype.map:

roomData.map((room) =>
  room.name === roomToChange
    ? { ...room, data: room.data.concat(extraItem) }
    : room
);