Cooking up some Code Firebase v9

REACT JS with some backbones from spoony API and a dash of firebase. Initially this was supposed to be a quick build since I was overseeing a tutorial. I decided to add a firebase to be able to allow any user to add any cuisine of their choosing. I was meat with harsh resistance because of firebase. Only to find that firebase had been updated to version 9.

const imageReference = ref(storage, `images/${v4() + imageUpload.name}`)
    uploadBytes(imageReference, imageUpload)
    .then((snapshot) => {
      getDownloadURL(snapshot.ref).then((url) => {
        ////////////////////////////////////////////////
        const collectRecipes = collection(fire, 'recipes')
          addDoc(collectRecipes, { "name":titleRef.current.value, 
              "instructions":instructionRef.current.value,
              "ingredients":ingridentsList ,
              "url" : url
            }).then(response => {
                console.log(response);
                setMsg("Recipe added for the dish");
                titleRef.current.value = "";
                instructionRef.current.value = "";
                setIngridientsList([]);
                setImageUpload(null)
                setProcessingIcon(false)
            }).catch(error => {
              console.log("ERRROR");
              console.log(error);
              setProcessingIcon(false)
            });
        ////////////////////////////////////////////////
      })
    })