redux-firestore
redux-firestore copied to clipboard
feat(store): store snapshot objects in state for use in pagination
It would be great if I could access the original firestore client API objects through this library as well.
This begins at accessing the original firestore object I am passing over to the redux-firestore store enhancer and ends at the individual document snapshots I get back from api calls.
A simple example is that I would like to query the next set of documents within a collection startingFrom a document snapshot like described in the Firestore Documentation. This already works with redux-firestore, but I have to get the original document snapshot again myself as its not available through the store:
// Pseudo code
// Get Redux-Firestore Object from Store
const { firestore } = this.store;
// Get current State from Store
const { firestore: { ordered: { 'cars.1': items } } } = this.store.getState();
// Get Snapshot of the last queried document
var snapshot = await firestore.collection( 'cars' ).doc( items[ items.length - 1 ].id ).get();
// Do the firestore query with startFrom = snapshot to get the next page of results
firestore.get( {
collection: 'cars',
limit: 10,
startAfter: snapshot
} );
This is suboptimal as redux-firestore should already have this snapshot, but it throws it away and only stores the data of each document snapshot.
It is more common to try to keep plain js objects in redux state since that makes immutable state updates more clear. I am open to the idea of storing non-plain-js objects like snapshots in state, but would like to understand the possible performance impacts more fully before making the change.
I am not a 100% familiar with how store enhancers actually work, but would having queried snapshots accessibe through a method on store.firestore be an option? If it is we could keep the redux store plain (which is mostly fine right now except for those cases where you need the original firestore snapshots).
I have a plan of using WeakMap to cache DocumentSnapshot using the data from .data() as a key, where those data object has also been dispatched to redux. So that we can get snapshot directly using only plain object stored in redux.
const todoList = useSelector(state => state.firestore.ordered.todos)
const lastVisible = firestore.getSnapshotFromCache(todoList[todoList.length - 1])
// then use lastVisible as startAfter query in firestoreConnect, somehow
@illuminist really like the idea of using WeakMap - open to a PR if you get a chance
@illuminist Open to a PR if you get a chance otherwise I'll try to get to it when I can
PR https://github.com/prescottprue/redux-firestore/pull/246