Cannot assign to read only property 'approved_by_customer

I know that the same question has been asked before but none of them are working for me, so here is my requirement -> I have users list and I logged in as a Admin, First I called getUsers api to get the list of the users and displayed the list in the UI, there is a button Accept for each user to approve them, So on click of Accept button, I am calling this method ->

         const [allUserList, setAllUserList] = useState(usersArray)
         const [filterUserListAfterUpdate, setFilterUserListAfterUpdate] = useState([])

          const onClickAcceptUser (id) => {
            let updatedUserList = []
            allUserList.forEach(user => {
                if(user._id === id){
                    user.approved_by_customer_admin = true
                }
                updatedUserList.push(user)
            })
            setFilterUserListAfterUpdate(updatedUserList)
      }

        return(<UserList filteredUsersList = {filterUserListAfterUpdate} onAccept={(id) => onClickAcceptUser(id) />)

NOTE -: I am using NodeJs as in backend and MongoDB and this is my full user object =>

//All the below values are dummy not real.
approved_by_customer_admin: false
auth0_id: "email|622e0414804c"
company_id: "622df44843fc4"
created_date: "2022-03-13T14:47:52.589Z"
email: "[email protected]"
industry_name: "gmail"
is_active: false
phone_number: ""
prefer_contact: "email"
role: "customer_auditor"
updated_date: "2022-03-13T14:47:52.589Z"
__v: 0
_id: "6243ffa"

I need to change only one property of object(or maybe more than one, in future). At the line user.approved_by_customer_admin = true I got the error in my console. Any suggestions would be appreciable.

CodePudding user response：

find an index of array of object and update the value of that like this

let updatedUserList = [...allUserList]
const objIndex = updatedUserList.findIndex(user => user._id == approveUser.id);
updatedUserList[objIndex].approved_by_customer_admin = true;
filterUserListAfterUpdate(updatedUserList)

CodePudding user response：

Tapping in the dark: based in your comment in one of the answer mentioning "Cannot assign to read only property" I am suspecting some other component like Mongoose to produce the error.

Some search lead me to How to fix the error (TypeError: Cannot assign to read only property 'map' of object '#<QueryCursor>') and https://github.com/Automattic/mongoose/issues/11377, suggesting to downgrade Node (strictly below 17.5.0)