Error loading preview on images saved to firebase storage

I’m developing a react native app and I am having a hard time reading an image saved to storage in firebase cloud. It says error loading preview and when I click on the link it also opens a missing image url. What am I doing wrong? According to other questions it has to do with the rules. And this was suggested.

rules_version = '2';

service firebase.storage {
  match /b/{bucket}/o {
    match /{allPaths=**} {
      allow read;
      allow write: if request.auth != null;
    }
  }
}

Yet, no cigar

I’m also following their suggested method to save the image, or at least it appears I am

const sendToBackend = () => {
  const metadata = {
    contentType: `image/${get_extension(image)}`
  };

  function get_extension(url) {
    let extension = url.toLowerCase().split(".").pop();

    return extension; // png, mp4, jpeg etc.
  }
  const filename = new Date().getTime() + image.substring(image.lastIndexOf("/")+1);

  console.log("image", filename);

  const storageRef = ref(storage, 'profileimages/' + filename);

  const uploadTask = uploadBytesResumable(storageRef, image, metadata );

  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;
      }
    }, 
    (error) => {
      console.error(error);
    }, 
    () => {
      getDownloadURL(uploadTask.snapshot.ref).then((downloadURL) => {
        console.log('File available at', downloadURL);
        const userId = auth.currentUser.uid;
        const docRef = doc(db, 'useraccounts', userId);
        updateDoc(docRef, {
          image: downloadURL,
        })
        .then(() => {
          console.log("Document successfully updated!");
          getUser();
        })
        .catch((error) => {
          console.error("Error updating document: ", error);
        });
      });
    }
  );
};

My problem is simple.

I want to be able to select an image from my phone or camera – DONE
I want to save it to firestore cloud storage – DONE (It seems so at least)
I want to be able to pass the URL for the image to the document in firebase collection (DONE)
I want to be able to read the downloadURL when I read {user.image} – (NOT Working)