const [image_URL, setImageURL] = useState(null) // To store the URL of image
const [edu_list, setEduList] = useState([]) // To store array of educational qualification
const [skill_list, setSkillList] = useState([]) // To store array of skills
const [project_list, setProjectList] = useState([]) // To store array of skills
const [language_list, setLanguageList] = useState([]) // To store array of languages
const [certificate_list, setCertificateList] = useState([]) // To store array of certificate
const [certificate_url_list, setCertificateURLList] = useState([]) //To store the array of uploaded document url
const saveChanges = async () => {
setEdit(false)
setInputBox1(false)
setInputBox2(false)
setInputBox3(false)
setInputBox4(false)
setInputBox5(false)
try {
if (certificate_list) {
const store_urls = []
for (let certificate of certificate_list) { // This will upload the all certificates to firebase storage
const certificateRef = ref(FirebaseStorage, `Certificates/${user_details.email}/${certificate.text}`)
const response = await uploadBytes( certificateRef , certificate.preview )
const downloadURL = await getDownloadURL( response.ref )
store_urls.push( { url : downloadURL , text: certificate.text } )
}
setCertificateURLList( previous => [ ...previous , ...store_urls ] )
}
if (image) { // This will upload the profile picture to firebase storage
const dpRef = ref(FirebaseStorage,
`Profile pictures/${user_details.user_type}/${user_details.email}/${image.name}`)
const response = await uploadBytes(dpRef, image)
const downloadURL = await getDownloadURL( response.ref )
setImageURL( downloadURL )
}
console.log( 'Certificates = ' , certificate_url_list )
console.log('Profile picture = ' , image_URL)
const user_ref = collection(FirebaseFirestore, 'Users') // Selects the collection
const condition = where('email', '==', user_details.email) // Providing the condition for selecting the user
const selected_user = query(user_ref, condition) // Selects the user from the total collection
await getDocs(selected_user).then(async (user_document) => { // This code will upload the data to firebase firestore
const userDocRef = user_document.docs[0].ref
await updateDoc(userDocRef, {
username: new_username,
phone_number: new_phonenumber,
location: location,
age: age,
experience: experience,
summary: summary,
profile_picture: image_URL,
educational_qualification: edu_list,
skills: skill_list,
projects: project_list,
languages_known: language_list,
certificates: certificate_url_list,
job_applied: 0,
job_saved: 0,
profile_views: 0,
}).then(alert('Profile is updated'))
.catch((error) => alert(error.message, 'Data are not updated'))
}).catch((error) => console.log(error.message, 'Error with getdocs'))
} catch (error) { console.log(error.message) }
}
In the provided code, I have been trying to update an existing document in the Firebase Firestore after uploading. I am uploading the list of certificates one by one and a picture into Firebase Storage, and they are stored in storage and return the URL of the corresponding files.
However, when I try to store the URLs such as certificate URLs into 'certificate_url_list' using 'setCertificateURLList' and the profile picture URL into 'image_URL' using 'setImageURL' functions, they are not getting stored properly. So the 'certificate' and 'profile_picture' fields in the 'updateDoc' become null and are not stored in the Firebase Firestore.