I am creating a real-time chat application using firebase and React js. I create a const functions = require('firebase-functions'); called "chats" inside the firebase. This collection contains unique room_ID(a bination of sender and receiver) and that document again contains subcollections called "messages". Each collection inside the message has infomation like message, time, sender_id, and read status.

Now, every time, when I receive a new message into the chat list I have to update the conversation. I use ponentDidMount() method of Reactjs and write below code:

firestore.collection('chats').doc("b7EuhNpdzXUlxhSgDkn2a6oReTl1_OZbrlH8FjmVFqSAtAc0A6TUHS3I3").collection("messages")
.onSnapshot(querySnapshot => {
  console.log("querySnapshot", querySnapshot)
  querySnapshot.docChanges().forEach(change => {
    console.log("change", change)
    if (change.type === 'added') {
      this.setState({messages : [...this.state.messages, change.doc.data()]});
      console.log('New city: ', change.doc.data());
    }
    if (change.type === 'modified') {
      console.log('Modified city: ', change.doc.data());
    }
    if (change.type === 'removed') {
      console.log('Removed city: ', change.doc.data());
    }
  });
});

You can see here that, It will only work for a single room(b7EuhNpdzXUlxhSgDkn2a6oReTl1_OZbrlH8FjmVFqSAtAc0A6TUHS3I3). I want to write query in such a way that it will listen to the message for each contact. For that, I have to remove the restriction of specific doc.

Please help me.

Thank you in advance.

Here is the structure of Firebase database.

I am creating a real-time chat application using firebase and React js. I create a const functions = require('firebase-functions'); called "chats" inside the firebase. This collection contains unique room_ID(a bination of sender and receiver) and that document again contains subcollections called "messages". Each collection inside the message has infomation like message, time, sender_id, and read status.

Now, every time, when I receive a new message into the chat list I have to update the conversation. I use ponentDidMount() method of Reactjs and write below code:

firestore.collection('chats').doc("b7EuhNpdzXUlxhSgDkn2a6oReTl1_OZbrlH8FjmVFqSAtAc0A6TUHS3I3").collection("messages")
.onSnapshot(querySnapshot => {
  console.log("querySnapshot", querySnapshot)
  querySnapshot.docChanges().forEach(change => {
    console.log("change", change)
    if (change.type === 'added') {
      this.setState({messages : [...this.state.messages, change.doc.data()]});
      console.log('New city: ', change.doc.data());
    }
    if (change.type === 'modified') {
      console.log('Modified city: ', change.doc.data());
    }
    if (change.type === 'removed') {
      console.log('Removed city: ', change.doc.data());
    }
  });
});

You can see here that, It will only work for a single room(b7EuhNpdzXUlxhSgDkn2a6oReTl1_OZbrlH8FjmVFqSAtAc0A6TUHS3I3). I want to write query in such a way that it will listen to the message for each contact. For that, I have to remove the restriction of specific doc.

Please help me.

Thank you in advance.

Here is the structure of Firebase database.

• javascript
• reactjs
• firebase
• google-cloud-firestore

Share Follow edited Jul 30, 2020 at 8:56 Shivani Sonagara asked Jul 28, 2020 at 10:10 Shivani SonagaraShivani Sonagara 1,30799 silver badges2121 bronze badges 4

• I found it a bit confusing to visualize your firebase structure with the way you described it, could you share a screenshot or a tree-like representation of what it looks like? Also, from what I understood, you want to watch every document on your room subcollection for changes, is that correct? – Rafael Lemos Commented Jul 28, 2020 at 13:41
• @ralemos Yes you are right – Shivani Sonagara Commented Jul 29, 2020 at 4:20
• ok, so can you share a screenshot or a tree-like representation of what your firestore structure actually looks like so we can help to create a proper listener for it? – Rafael Lemos Commented Jul 29, 2020 at 15:54
• I have added screenshots of my firebase structure. – Shivani Sonagara Commented Jul 30, 2020 at 8:57

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 2

Look into the documentation for CollectionGroups - set your listener to the .collectionGroup("messages") - you will have to process through the changes for all of the different "chats" documents. (HINT: each returned messages DocRef includes the refPath field - which you can trivially parse to find the path to the "parent" chat document)

I believe a few better approaches to fetch the data you want would be to either:

• Restructure your Firestore to have only a messages collection, like the following example structure:

  messages collection
      uid
      receiverUserId
      senderUserId
      msg
      read
      time
  

With this approach you could filter the documents you are watching, for example documents received by the currently authenticated user from multiple users, by doing something like this:

firestore.collection("messages")
  .where("receiverUserId", "==", authUid)
  .onSnapshot(function(querySnapshot) {
     //do whatever
});

• Create multiple listeners, one for each chats document, to watch it's subsequent messages subcollection. So you could do something like this untested code:

  firestore.collection('chats').get().then(function(querySnapshot) {
    querySnapshot.forEach(function(doc) {
        var eachChatRef = firestore.collection('chats').doc(doc.documentID)
        var messagesRef = eachChatRef.collection("messages");
        messagesRef.onSnapshot(function(snapshot) {
            snapshot.docChanges().forEach(function(messageDoc) {
                // Do whatever
            });
        });
    });
  });
  

To extend to @LeadDreamer answer, this worked for me to listen to changes in all documents in a collection using collectionGroup:

const unsub = () =>
  onSnapshot(collectionGroup(db, "reservations"), (doc) => {
    doc.docs.forEach((d) => {
      console.log(d.data());
    });
  });