RafaelZasas/intro-to-firebase

Fix Broken Profile Image 🩹

Closed this issue · 3 comments

RafaelZasas commented

Currently if a signed in user doesn't have an image associated with the account, the profile page's image will be broken.
This can be fixed by checking to see if the user.displayImage function returns null or not.
A static image in assets/ can be used or you can pull an image from Firestore.

antciulla commented

Would this be something that can be handled in profile.js? Could I implement a check if the displayImage is valid, if not set a default avatar for the user? Or am I thinking about this the wrong way?

  • 👍1
RafaelZasas commented

That's exactly the way I would do it! You can add a default avatar in the assets/ folder and use the profile.js to determine if the displayImage url is not null.

clarmso commented

Currently, if the user does not have an image, a random image is fetched and there's no broken image as the result:

https://github.com/RafaelZasas/intro-to-firebase/blob/master/public/src/html/profile.html#L236

Would you still like to have a default static image for the users who don't have an image?

EDIT: Actually the image is set here:

https://github.com/RafaelZasas/intro-to-firebase/blob/master/public/src/js/firestore.js#L237