feat(refs): support refs in collection when adding

Author: posva

examples/index.html

@@ -43,6 +43,18 @@
         </li>
       </ul>
 
+      <h4>collection with refs</h4>
+
+      <ul>
+        <li v-for="moment in moments">{{ moment }}</li>
+      </ul>
+
+      <h5>Original data</h5>
+
+      <ul>
+        <li v-for="tweet in tweets">{{ tweet }}</li>
+      </ul>
+
       <p>config: </p>
       <pre>
         {{ config }}
@@ -66,12 +78,15 @@
         el: '#app',
         data: {
           todos: [],
+          tweets: [],
           config: null,
           newTodoText: ''
         },
 
         firestore: {
           todos: unFinishedTodos,
+          moments: db.collection('moments'),
+          tweets: db.collection('tweets'),
           config
         },
 

src/index.js

@@ -9,17 +9,58 @@ function bindCollection ({
 }) {
   // TODO wait to get all data
   const array = vm[key] = []
+  const depth = 0
 
   const change = {
     added: ({ newIndex, doc }) => {
-      array.splice(newIndex, 0, createSnapshot(doc))
+      const subs = {}
+      const snapshot = createSnapshot(doc)
+      const [data, refs] = extractRefs(snapshot)
+      array.splice(newIndex, 0, data)
+      const refKeys = Object.keys(refs)
+      if (!refKeys.length) return // resolve()
+      // TODO check if no ref is missing
+      // TODO max depth param, default to 1?
+      // if (++depth > 3) throw new Error('more than 5 nested refs')
+      refKeys.forEach(refKey => {
+        // check if already bound to the same ref -> skip
+        const sub = subs[refKey]
+        const ref = refs[refKey]
+        if (sub && sub.path !== ref.path) {
+          sub.unbind()
+        }
+        // maybe wrap the unbind function to call unbind on every child
+        const [innerObj, innerKey] = deepGetSplit(array[newIndex], refKey)
+        if (!innerObj) {
+          console.log('=== ERROR ===')
+          console.log(data, refKey, newIndex, innerObj, innerKey)
+          console.log('===')
+        }
+        subs[refKey] = {
+          unbind: subscribeToDocument({
+            ref,
+            obj: innerObj,
+            key: innerKey,
+            depth,
+            // TODO parentSubs
+            resolve
+          }),
+          path: ref.path
+        }
+        // unbind currently bound ref
+        // bind ref
+        // save unbind callback
+        // probably save key or something as well
+      })
     },
     modified: ({ oldIndex, newIndex, doc }) => {
       array.splice(oldIndex, 1)
       array.splice(newIndex, 0, createSnapshot(doc))
+      // TODO replace listeners of nested refs
     },
     removed: ({ oldIndex }) => {
       array.splice(oldIndex, 1)
+      // TODO remove listeners of nested refs
     }
   }
 

test/helpers/mock.js

@@ -111,7 +111,7 @@ class CollectionReference {
       docChanges: [{
         type: 'added',
         doc: new DocumentSnapshot(null, id, data),
-        newIndex: Object.keys(this.data).length,
+        newIndex: Object.keys(this.data).length - 1,
         oldIndex: -1
       }]
     })

test/refs-collections.spec.js

@@ -0,0 +1,55 @@
+import Vuefire from '../src'
+import {
+  db,
+  tick,
+  delay,
+  Vue
+} from './helpers'
+
+Vue.use(Vuefire)
+
+let vm, collection, a, b, first, second
+beforeEach(async () => {
+  a = db.collection().doc()
+  b = db.collection().doc()
+  await a.update({ isA: true })
+  await b.update({ isB: true })
+  collection = db.collection()
+  first = await collection.add({ ref: a })
+  second = await collection.add({ ref: b })
+
+  vm = new Vue({
+    data: () => ({
+      items: null
+    })
+  })
+  await tick()
+})
+
+test('binds refs on collections', async () => {
+  await vm.$bind('items', collection)
+
+  // XXX dirty hack until $bind resolves when all refs are bound
+  // NOTE should add option for it waitForRefs: true (by default)
+  await delay(5)
+
+  expect(vm.items).toEqual([
+    { ref: { isA: true }},
+    { ref: { isB: true }}
+  ])
+})
+
+test('binds refs when adding to collection', async () => {
+  await vm.$bind('items', collection)
+  const c = db.collection().doc()
+  await c.update({ isC: true })
+
+  await collection.add({ ref: c })
+  await delay(5)
+
+  expect(vm.items).toEqual([
+    { ref: { isA: true }},
+    { ref: { isB: true }},
+    { ref: { isC: true }}
+  ])
+})