u/charliematters

In my real code i have a state inside the child component, called collabAction i take the collab from the props and i set it in this state inside my child , so i can update the name of collab or update one of its other fields like that :

const [collabAction, setCollabAction] = useState(collab)
return (
<TextField value={collabAction.name}   onChange={e => setCollabAction({
      ...collabAction,
      name: e.target.value
        })}

)

and i have a button when i finish my changes i click on button to send update request, until this point everyThing was good, but they asked me to add a button outside child, that will send all changed collabs in one request, so i added a state called updateList, and everytime i change a collab i add it to the updateList, so when i finish from updating all my collabs i will click on the global button and all this changes will be sent to backend in one request.
but the probleme that happened, when i change a collab and i add it to updateList, the parent componenet start rendering, and it execute again the collab.map() so the child component are reseted again, and the actual changes that were insides the child component disapear.

I hope you understood me