DocumentReference.update() called with invalid data when trying to replace old array

I created object and inside this object there is an array (array objects), like so: .

But in other case i need to add nested array inside this array object. Suppose i want to insert new field in chapters index no 0. I want it become like this:

-chapters   - 0 : -chapter: 'Pendahuluan'         -chapterDesc: 'bla.. bla'         -id: 59291         -materi:            -0 : title: 'bla..bla'                desc: 'desc bla.. bla'           -1 : title: 'bla.. bla again'              : desc: 'desc bla.. bla.. again'  

What i did like so;

const handleMateri = async (data, index) => {        showModal.value = false          const allOldChapter = course.value.chapters        console.log('old',allOldChapter)          const newAllChapter = allOldChapter.map(chap => chap.id !== data.id ? chap : data)          console.log('new',newAllChapter)          await updateDoc('courses', props.id, { chapters:  newAllChapter})        }  

and Firestore update function

const updateDoc = async(collection, id, updates) => {          isPending.value = true          error.value = null            try{              let docRef = projectFirestore.collection(collection).doc(id)              const res = await docRef.update(updates)              isPending.value = false              return res            }catch(err){              isPending.value = false              error.value = err.message              console.log(err.message)            }        }  

then i got this issue

Can someone help me?

https://stackoverflow.com/questions/65605329/documentreference-update-called-with-invalid-data-when-trying-to-replace-old-a January 07, 2021 at 09:04AM