redux-firestore icon indicating copy to clipboard operation
redux-firestore copied to clipboard

View changes between snapshots

Open ivangr1 opened this issue 5 years ago • 2 comments

Hello and thanks for the great library! I am new to Redux and can't seem to find an answer to my issue. I would like to somehow get the change type that happens when the collection is modified. I need to create a custom notification when new document is added in the collection which is being observed by onSnapshot.

Firebase docs have exactly what I want:

db.collection("cities").onSnapshot(function(snapshot) {
        snapshot.docChanges().forEach(function(change) {
            if (change.type === "added") {
                console.log("New city: ", change.doc.data());
            }
        });
    });

And since you changed the onSnapshot function I am not sure how and where exactly to get the change type. This is my code:

 componentDidMount () {
    const { firestore } = this.context.store
    firestore.onSnapshot({ collection: 'orders' })
  }

  componentWillUnmount() {
    this.context.store.firestore.unsetListener({ collection: 'orders' })
  }

export default connect((state) => ({
    orders: state.firestore.ordered.orders
  }))
(Orders);

Thank you!

ivangr1 avatar May 10 '19 11:05 ivangr1

When you use onSnapshot from the internal instance, actions of the type LISTENER_RESPONSE will be dispatched when data is returned that include doc changes, which is then set into redux state.

As for the exact type - not sure that is included in the dispatched action (though we should probably change that so it is), but redux state should be correctly updated for both types.

Does that help?

prescottprue avatar May 31 '19 02:05 prescottprue

@ivangr1 did you find a solution? I'm currently building an app where I need to track new documents only.

Here is the use case I'm trying to achieve and convert into a structure that works with redux-firestore:

roomRef.collection('callerCandidates').onSnapshot(snapshot => {
    snapshot.docChanges().forEach(async change => {
         if (change.type === 'added') {
             let data = change.doc.data();
             await localPC.addIceCandidate(new RTCIceCandidate(data));
        }
    });
});

In my understanding, @prescottprue you no longer use these libraries in favor of integrating firebase/firestore directly. Would you be able to suggest a direction I could go in or perhaps it would be better to use firestore onSnapshot directly with docChanges function in this case?

As an alternative, I could use timestamps to track last changes, and only loop through arr/objects that have changed since X.

maderesponsively avatar Jul 02 '22 07:07 maderesponsively