1

when I submit the form to store the data on the firestore db I got this error message: image 1

the value of images on the state is showen like this : image 2

I find the same question posted by others but all the answers there is not working for me Here is my code :

 const storeImage = async (image) => {
  return new Promise((resolve, reject) => {
    const storage = getStorage()
    const fileName = `${auth.currentUser.uid}-${image.name}-${uuidv4()}`

    const storageRef = ref(storage, 'images/' + fileName)

    const uploadTask = uploadBytesResumable(storageRef, image)

    uploadTask.on(
      'state_changed',
      (snapshot) => {
        const progress =
          (snapshot.bytesTransferred / snapshot.totalBytes) * 100
        console.log('Upload is ' + progress + '% done')
        switch (snapshot.state) {
          case 'paused':
            console.log('Upload is paused')
            break
          case 'running':
            console.log('Upload is running')
            break
          default:
            break
        }
      },
      (error) => {
        reject(error)
      },
      () => {
        // Handle successful uploads on complete
        // For instance, get the download URL: https://firebasestorage.googleapis.com/...
        getDownloadURL(uploadTask.snapshot.ref).then((downloadURL) => {
          resolve(downloadURL)
        })
      }
    )
  })
}

const imgUrls = await Promise.all(
  [...images].map((image) => storeImage(image))
).catch(() => {
  setLoading(false)
  toast.error('Images not uploaded')
  return
})

const formDataCopy = {
  ...formData,
  imgUrls,
  geolocation,
  timestamp: serverTimestamp(),
}

formDataCopy.location = address
delete formDataCopy.images
delete formDataCopy.address
!formDataCopy.offer && delete formDataCopy.discountedPrice

const docRef = await addDoc(collection(db, 'listings'), formDataCopy)
setLoading(false)
toast.success('Listing saved')
navigate(`/category/${formDataCopy.type}/${docRef.id}`)

}

0 Answers0