React Use State Containing JSON Object Reverts Updates?

Running into a really weird issue. I have a Postgres table which upon program startup, loads a bunch of values into a JSON object stored as a Use State Object at the start. It is a big object, but I will give you an example below.

const [person, setPerson] = useState({
id: 0,
name: "John Smith"
phones: [{
   number: "(111) 111-1111"
   type: "Cell"
   }]
})

When I use setPerson to update the JSON object, I am doing it as such:

setPerson({
...person,
name: "New Name"
})

The update takes place, and I see the dashboard dynamically change. However, when I run my next update, for example:

let new_phones = person.phones.push({
   number: "new number",
   type: "Cell"
})

setPerson({
...person,
phones: new_phones
})

What ends up happening is that the phones correctly update, and I now see my two phones shown instead of one. However, the updated name reverts to the old name. Instead of showing “New Name” as it should, it goes back to showing the name before any updates took place, “John Smith”.

The only fields that don’t get reverted would be the fields in Person that contain an array. If I make another change after updating phones, phones will not revert back to only containing 1 object. It will still show 2. The fields that revert at the static fields that contain strings, ints, etc.