[v1.11.0] fetchAndAdd action 🎢

NEW: fetchAndAdd action 🎢
mesqueeb · Sep 10, 2018 · 373b441 · 373b441
2 parents cc4b0dc + 15efb8a
commit 373b441
Show file tree

Hide file tree

Showing 7 changed files with 357 additions and 189 deletions.
diff --git a/README.md b/README.md
@@ -34,12 +34,10 @@ Other features include hooks, fillables (limit props to sync), default values (a
 - [Usage](#usage)
     - [Automatic 2-way sync](#automatic-2-way-sync)
     - [Editing](#editing)
-        - [Editing in 'collection' mode](#editing-in-collection-mode)
-        - [Editing in 'doc' mode](#editing-in-doc-mode)
     - [Shortcut: set(path, doc)](#shortcut-setpath-doc)
-    - [Fetching](#fetching)
     - [Multiple modules with 2way sync](#multiple-modules-with-2way-sync)
     - [Sync directly to module state](#sync-directly-to-module-state)
+    - [Fetching docs (with different filters)](#fetching-docs-with-different-filters)
 - [Extra features](#extra-features)
     - [Filters](#filters)
     - [Variables for firestorePath or filters](#variables-for-firestorepath-or-filters)
@@ -219,21 +217,6 @@ For this shortcut usage, import the npm module '[vuex-easy-access](https://githu
 
 Please note that it is important to pass the 'vuex-easy-firestore' plugin first, and the 'vuex-easy-access' plugin second for it to work properly.
 
-### Fetching
-
-Say that you have a default filter set on the documents you are syncing when you `openDBChannel` (see [Filters](#filters)). And you want to fetch extra documents with other filters. (eg. archived posts) In this case you can use the fetch action to retrieve documents from the same firestore path your module is synced to:
-
-```js
-dispatch('user/favourites/fetch', {whereFilters = [], orderBy = []})
-  .then(console.log)
-  .catch(console.error)
-```
-
-- *whereFilters:* The same as firestore's `.where()`. An array of arrays with the filters you want. eg. `[['field', '==', false], ...]`
-- *orderBy:* The same as firestore's `.orderBy()`. eg. `['created_date']`
-
-You have to manually write the logic for what you want to do with the fetched documents.s
-
 ### Multiple modules with 2way sync
 
 Of course you can have multiple vuex modules, all in sync with different firestore paths.
@@ -307,6 +290,68 @@ const settingsModule = {
 }
 ```
 
+### Fetching docs (with different filters)
+
+Say that you have a default filter set on the documents you are syncing when you `openDBChannel` (see [Filters](#filters)). And you want to fetch extra documents with other filters. (eg. archived posts) In this case you can use the fetch actions to retrieve documents from the same firestore path your module is synced to:
+
+- `dispatch('fetch')` for manual handling the fetched docs
+- `dispatch('fetchAndAdd')` for fetching and automatically adding the docs to the module like your other docs
+
+You can have two extra parameters:
+
+- *whereFilters:* The same as firestore's `.where()`. An array of arrays with the filters you want. eg. `[['field', '==', false], ...]`
+- *orderBy:* The same as firestore's `.orderBy()`. eg. `['created_date']`
+
+#### Usage example `fetchAndAdd`:
+
+```js
+dispatch('pokemonBox/fetchAndAdd', {whereFilters: [['freed', '==', true]], orderBy: ['freedDate']})
+  .then(result => {
+    if (querySnapshot.done === true) {
+      // `{done: true}` is returned when everything is fetched:
+      return 'all docs retrieved'
+    }
+    // Nothing more needs to be done. Docs are automatically added to `pokemonBox`
+    // docs will also receive `defaultValues` you have set up. (see "defaultValues set after server retrieval" below)
+  })
+  .catch(console.error)
+```
+
+#### Usage example `fetch`:
+
+```js
+dispatch('pokemonBox/fetch', {whereFilters: [['freed', '==', true]], orderBy: ['freedDate']})
+  .then(querySnapshot => {
+    if (querySnapshot.done === true) {
+      // `{done: true}` is returned when everything is fetched:
+      return 'all docs retrieved'
+    }
+    // the Firestore `querySnapshot` as is
+    querySnapshot.forEach(doc => {
+      // you have to manually add the doc with `fetch`
+      const fetchedDoc = doc.data()
+      fetchedDoc.id = doc.id
+      commit('pokemonBox/INSERT_DOC', fetchedDoc)
+      // also don't forget that in this case `defaultValues` will not be applied
+    })
+  })
+  .catch(console.error)
+```
+
+#### A note on setting a fetch limit:
+
+The fetch limit defaults to 50 docs. If you watch to fetch *the next 50 docs* you just need to call the `fetch` or `fetchAndAdd` action again, and it will automatically retrieve the next docs! You can change the default fetch limit like so:
+
+```js
+{
+  // your other vuex-easy-fire config
+  fetch: {
+    // The max amount of documents to be fetched. Defaults to 50.
+    docLimit: 50,
+  },
+}
+```
+
 ## Extra features
 
 ### Filters
@@ -318,7 +363,7 @@ The filters set in `sync: {}` are applied before the DB Channel is openend. They
 
 ```js
 {
-  // your other config...
+  // your other vuex-easy-fire config...
   sync: {
     where: [], // an array of arrays
     orderBy: [],
@@ -366,7 +411,7 @@ store.dispatch('userModule/openDBChannel')
 
 ```js
 {
-  // your other config...
+  // your other vuex-easy-fire config...
   sync: {
     fillables: [],
     guard: [],
@@ -382,7 +427,7 @@ But you may choose not to call this to abort the mutation.
 
 ```js
 {
-  // your other config...
+  // your other vuex-easy-fire config...
   sync: {
     insertHook: function (updateStore, doc, store) { updateStore(doc) },
     patchHook: function (updateStore, doc, store) { updateStore(doc) },
@@ -405,7 +450,7 @@ Exactly the same as above, but for changes that have occured on the server. You
 
 ```js
 {
-  // your other config...
+  // your other vuex-easy-fire config...
   serverChange: {
     addedHook: function (updateStore, doc, id, store, source, change) { updateStore(doc) },
     modifiedHook: function (updateStore, doc, id, store, source, change) { updateStore(doc) },

diff --git a/dist/index.cjs.js b/dist/index.cjs.js
@@ -807,12 +807,45 @@ var actions = {
       });
     });
   },
-  serverUpdate: function serverUpdate(_ref13, _ref14) {
-    var commit = _ref13.commit;
-    var change = _ref14.change,
-        id = _ref14.id,
-        _ref14$doc = _ref14.doc,
-        doc = _ref14$doc === void 0 ? {} : _ref14$doc;
+  fetchAndAdd: function fetchAndAdd(_ref13) {
+    var state = _ref13.state,
+        getters = _ref13.getters,
+        commit = _ref13.commit,
+        dispatch = _ref13.dispatch;
+
+    var _ref14 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
+      whereFilters: [],
+      orderBy: [] // whereFilters: [['archived', '==', true]]
+      // orderBy: ['done_date', 'desc']
+
+    },
+        _ref14$whereFilters = _ref14.whereFilters,
+        whereFilters = _ref14$whereFilters === void 0 ? [] : _ref14$whereFilters,
+        _ref14$orderBy = _ref14.orderBy,
+        orderBy = _ref14$orderBy === void 0 ? [] : _ref14$orderBy;
+
+    return dispatch('fetch', {
+      whereFilters: whereFilters,
+      orderBy: orderBy
+    }).then(function (querySnapshot) {
+      if (querySnapshot.done === true) return querySnapshot;
+
+      if (isWhat.isFunction(querySnapshot.forEach)) {
+        querySnapshot.forEach(function (_doc) {
+          var id = _doc.id;
+          var doc = setDefaultValues(_doc.data(), state._conf.serverChange.defaultValues);
+          doc.id = id;
+          commit('INSERT_DOC', doc);
+        });
+      }
+    });
+  },
+  serverUpdate: function serverUpdate(_ref15, _ref16) {
+    var commit = _ref15.commit;
+    var change = _ref16.change,
+        id = _ref16.id,
+        _ref16$doc = _ref16.doc,
+        doc = _ref16$doc === void 0 ? {} : _ref16$doc;
     doc.id = id;
 
     switch (change) {
@@ -829,11 +862,11 @@ var actions = {
         break;
     }
   },
-  openDBChannel: function openDBChannel(_ref15, pathVariables) {
-    var getters = _ref15.getters,
-        state = _ref15.state,
-        commit = _ref15.commit,
-        dispatch = _ref15.dispatch;
+  openDBChannel: function openDBChannel(_ref17, pathVariables) {
+    var getters = _ref17.getters,
+        state = _ref17.state,
+        commit = _ref17.commit,
+        dispatch = _ref17.dispatch;
     var store = this; // set state for pathVariables
 
     if (pathVariables && isWhat.isObject(pathVariables)) commit('SET_PATHVARS', pathVariables); // get userId
@@ -944,11 +977,11 @@ var actions = {
       });
     });
   },
-  set: function set(_ref16, doc) {
-    var commit = _ref16.commit,
-        dispatch = _ref16.dispatch,
-        getters = _ref16.getters,
-        state = _ref16.state;
+  set: function set(_ref18, doc) {
+    var commit = _ref18.commit,
+        dispatch = _ref18.dispatch,
+        getters = _ref18.getters,
+        state = _ref18.state;
     if (!doc) return;
 
     if (!getters.collectionMode) {
@@ -963,11 +996,11 @@ var actions = {
 
     return dispatch('patch', doc);
   },
-  insert: function insert(_ref17, doc) {
-    var state = _ref17.state,
-        getters = _ref17.getters,
-        commit = _ref17.commit,
-        dispatch = _ref17.dispatch;
+  insert: function insert(_ref19, doc) {
+    var state = _ref19.state,
+        getters = _ref19.getters,
+        commit = _ref19.commit,
+        dispatch = _ref19.dispatch;
     var store = this;
     if (!getters.signedIn) return 'auth/invalid-user-token';
     if (!doc) return;
@@ -986,11 +1019,11 @@ var actions = {
 
     return storeUpdateFn(newDoc);
   },
-  insertBatch: function insertBatch(_ref18, docs) {
-    var state = _ref18.state,
-        getters = _ref18.getters,
-        commit = _ref18.commit,
-        dispatch = _ref18.dispatch;
+  insertBatch: function insertBatch(_ref20, docs) {
+    var state = _ref20.state,
+        getters = _ref20.getters,
+        commit = _ref20.commit,
+        dispatch = _ref20.dispatch;
     var store = this;
     if (!getters.signedIn) return 'auth/invalid-user-token';
     if (!isWhat.isArray(docs) || !docs.length) return;
@@ -1016,11 +1049,11 @@ var actions = {
 
     return storeUpdateFn(newDocs);
   },
-  patch: function patch(_ref19, doc) {
-    var state = _ref19.state,
-        getters = _ref19.getters,
-        commit = _ref19.commit,
-        dispatch = _ref19.dispatch;
+  patch: function patch(_ref21, doc) {
+    var state = _ref21.state,
+        getters = _ref21.getters,
+        commit = _ref21.commit,
+        dispatch = _ref21.dispatch;
     var store = this;
     if (!doc) return;
     var id = getters.collectionMode ? getId(doc) : undefined;
@@ -1044,14 +1077,14 @@ var actions = {
 
     return storeUpdateFn(value);
   },
-  patchBatch: function patchBatch(_ref20, _ref21) {
-    var state = _ref20.state,
-        getters = _ref20.getters,
-        commit = _ref20.commit,
-        dispatch = _ref20.dispatch;
-    var doc = _ref21.doc,
-        _ref21$ids = _ref21.ids,
-        ids = _ref21$ids === void 0 ? [] : _ref21$ids;
+  patchBatch: function patchBatch(_ref22, _ref23) {
+    var state = _ref22.state,
+        getters = _ref22.getters,
+        commit = _ref22.commit,
+        dispatch = _ref22.dispatch;
+    var doc = _ref23.doc,
+        _ref23$ids = _ref23.ids,
+        ids = _ref23$ids === void 0 ? [] : _ref23$ids;
     var store = this;
     if (!doc) return; // define the store update
 
@@ -1075,11 +1108,11 @@ var actions = {
 
     return storeUpdateFn(doc, ids);
   },
-  delete: function _delete(_ref22, id) {
-    var state = _ref22.state,
-        getters = _ref22.getters,
-        commit = _ref22.commit,
-        dispatch = _ref22.dispatch;
+  delete: function _delete(_ref24, id) {
+    var state = _ref24.state,
+        getters = _ref24.getters,
+        commit = _ref24.commit,
+        dispatch = _ref24.dispatch;
     if (!id) return;
     var store = this;
 
@@ -1106,11 +1139,11 @@ var actions = {
 
     return storeUpdateFn(id);
   },
-  deleteBatch: function deleteBatch(_ref23, ids) {
-    var state = _ref23.state,
-        getters = _ref23.getters,
-        commit = _ref23.commit,
-        dispatch = _ref23.dispatch;
+  deleteBatch: function deleteBatch(_ref25, ids) {
+    var state = _ref25.state,
+        getters = _ref25.getters,
+        commit = _ref25.commit,
+        dispatch = _ref25.dispatch;
     if (!isWhat.isArray(ids)) return;
     if (!ids.length) return;
     var store = this; // define the store update
@@ -1140,9 +1173,9 @@ var actions = {
 
     return storeUpdateFn(ids);
   },
-  _stopPatching: function _stopPatching(_ref24) {
-    var state = _ref24.state,
-        commit = _ref24.commit;
+  _stopPatching: function _stopPatching(_ref26) {
+    var state = _ref26.state,
+        commit = _ref26.commit;
 
     if (state._sync.stopPatchingTimeout) {
       clearTimeout(state._sync.stopPatchingTimeout);
@@ -1152,9 +1185,9 @@ var actions = {
       state._sync.patching = false;
     }, 300);
   },
-  _startPatching: function _startPatching(_ref25) {
-    var state = _ref25.state,
-        commit = _ref25.commit;
+  _startPatching: function _startPatching(_ref27) {
+    var state = _ref27.state,
+        commit = _ref27.commit;
 
     if (state._sync.stopPatchingTimeout) {
       clearTimeout(state._sync.stopPatchingTimeout);