0

I am trying to figure out how to set an image from the Firestore database for each user in react native gifted chat as the user's avatar, but I can not figure out how to do it.

I posted my code earlier on another question, but no one replied, so what is your approach for pulling a users image from Firebase Firestore and setting it as the avatar?

At the moment, to get the Users ID from Firestore, I have tried this, but it does not work.

async componentDidMount() {
  this.setState({ user: firebaseApp.auth().currentUser });
  this.listenForMessages(this.messagesRef);
  const currentUserUID = firebaseApp.auth().currentUser.uid;
  let doc =  await firebaseApp
  .firestore()
  .collection('userProfile')
  .doc(currentUserUID)
  .get();
    
  let dataObj = doc.data();
   
 this.setState({ avatar: dataObj.image}); // CALLING IMAGE FROM DATABASE
    
}
Andrew
  • 795
  • 4
  • 18
codergirl
  • 25
  • 1
  • 7

1 Answers1

0

I would avoid using Firestore to store your avatar images. A single Firestore document can not be more than 1 MB in size.

Unless you control how large the image is allowed to be, you will eventually exceed the document limit quickly. However, if you use Cloud Storage for Firebase and only store the URL in Cloud Firestore, you will take up much less space.

Cloud Storage is also more affordable in terms of storage costs and will not restrict your storage requirements if you decide to make the avatar bigger, for example. Another benefit of this approach is managing the caching for faster image retrieval times.

Andrew
  • 795
  • 4
  • 18