Try making the function async to only perform the action after uploading the data
Edit to add question at bottom: Currently, it runs fine, it's just that it's not running asynchronously (I think that's why the async await is trying).
My question is how to make the submission process asynchronous so that I can only perform an action (prompt the user for preferred next steps in this case) after uploading the information.
const handleSubmit = async () => {
try {
if (image.value) {
await uploadImage(image.value); <--I thought this was
asynchronous, but I tested and I don't think it is.
}
const colRef = collection(db, "collection");
//I thought the below was asynchronous, but it's not
await addDoc(colRef,
{
data: data.value <--placeholder
});
});
} catch {
}
//code to run after addDoc is done, but it runs immediately
$q.dialog({
[content]
})
};
Update: I've changed the addDoc function with the .then function and this seems to work. The current problem is that I cannot complete the uploadImage function before running the addDoc function.
This is my attempt to commit the uploadImage function, which I know is sloppy and wrong:
if (image.value) {
return new Promise((resolve, reject) => {
const newImage = uploadImage(image.value);
resolve(newImage);
});
} else {
console.log("error");
}