'How to simultaneously update multiple object's values inside an array

I'm trying to simultaneously update 2 object's values inside an array when an onClick function is called. Currently I am able to decrement the target (selected) value by 1 (e.g -1) but am in need of suggestions for my next expectation:

If a previous value exists (e.g an option is selected) and I select a different option (radio button) I expect the previous value to increment by 1 (+1) simultaneously to the new value being decremented.

Array Structure:

`(4) [{…}, {…}, {…}, {…}]
0: {name: 'Space pod', total_no: 2, max_distance: 200, speed: 2}
1: {name: 'Space rocket', total_no: 1, max_distance: 300, speed: 4}
2: {name: 'Space shuttle', total_no: 1, max_distance: 400, speed: 5}
3: {name: 'Space ship', total_no: 2, max_distance: 600, speed: 10}`

Current:

const handleVehiceChange = (e) => {
setValue(e.target.value);
setVehiclesData(
  vehiclesData.map((vehicle) =>
    vehicle.name === e.target.value
      ? { ...vehicle, total_no: vehicle.total_no - 1 }
      : vehicle
  )
)};


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source