Failed to execute 'createObjectURL' on 'URL': Overload resolution failed

Question

I want to add an image upload feature to my website. If the image is uploaded I want it to be displayed in an IMG tag otherwise shows the first letter of the username. So to check whether the image is uploaded or not, I created a field in my firestore named userImageUpload. I stored the firestore details in a state userDetails and if I call userDetails.data() I will get the fields of the user document.

To check if image uploaded, I added this code:

           {userDetails.data().userImageUpload ? (
              <img src={URL.createObjectURL(image)} alt="" />
            ) : (
              <h1>B</h1>
            )}
          </div>

But I am getting the error as : TypeError: Failed to execute 'createObjectURL' on 'URL': Overload resolution failed