Add graph parsing

Author: Daan van der Kallen

src/Model.js

@@ -192,7 +192,7 @@ export default class Model {
             }
         });
         if (options.relations) {
-            this.__parseRelations(options.relations);
+            this.__parseRelations(options.relations, options.relsFromCache);
         }
         if (data) {
             this.parse(data);
@@ -203,7 +203,7 @@ export default class Model {
     }
 
     @action
-    __parseRelations(activeRelations) {
+    __parseRelations(activeRelations, relsFromCache = {}) {
         this.__activeRelations = activeRelations;
         // TODO: No idea why getting the relations only works when it's a Function.
         const relations = this.relations && this.relations();
@@ -242,10 +242,20 @@ export default class Model {
                     RelModel,
                     `Specified relation "${relName}" does not exist on model.`
                 );
+
+                const cacheData = relsFromCache[relName];
+                if (cacheData && cacheData.model) {
+                    return cacheData.model;
+                }
+
                 const options = {
                     relations: otherRelNames,
                     linkRelations: this.__linkRelations,
                 };
+                if (cacheData && cacheData.rels) {
+                    options.relsFromCache = cacheData.rels;
+                }
+
                 if (RelModel.prototype instanceof Store) {
                     return new RelModel(options);
                 }

src/Store.js

@@ -11,7 +11,8 @@ import {
     result,
     uniqBy,
 } from 'lodash';
-import { invariant } from './utils';
+import { invariant, relationsToNestedKeys, camelToSnake } from './utils';
+import Model from './Model';
 const AVAILABLE_CONST_OPTIONS = [
     'relations',
     'limit',
@@ -21,6 +22,45 @@ const AVAILABLE_CONST_OPTIONS = [
     'linkRelations',
 ];
 
+function getRelsFromCache(record, rels, repos, relMapping, relPath, relCache) {
+    const relsFromCache = {};
+
+    for (const [rel, subRels] of Object.entries(rels)) {
+        // First we try to get the related id
+        const backendRel = camelToSnake(rel);
+        const relId = record[backendRel];
+        // We only care about numbers since that means that it
+        // is filled and is a direct relation.
+        if (typeof relId !== 'number') {
+            continue;
+        }
+
+        // Then we see if we can find the model in the cache.
+        const subRelPath = `${relPath}.${rel}`;
+        const cachedModel = relCache[`${subRelPath}:${relId}`];
+        if (cachedModel) {
+            relsFromCache[rel] = { model: cachedModel };
+            // If we found it we don't have to dive deeper.
+            continue;
+        }
+
+        // Then we search for the related data in the repos
+        const subRecord = repos[relMapping[subRelPath.slice('root.'.length)]].find(({ id }) => id === relId);
+        if (!subRecord) {
+            continue;
+        }
+
+        // Now we recurse to see if we can find relations in the cache for this model
+        relsFromCache[rel] = { rels: getRelsFromCache(
+            subRecord, subRels,
+            repos, relMapping,
+            subRelPath, relCache,
+        ) };
+    }
+
+    return relsFromCache;
+}
+
 export default class Store {
     // Holds all models
     @observable models = [];
@@ -128,19 +168,26 @@ export default class Store {
 
         this.models.replace(
             data.map(record => {
-                const relCacheKey = `${relPath}:${record.id}`
+                const options = {};
 
                 if (this.__linkRelations === 'graph') {
-                    const model = relCache[relCacheKey];
+                    // Return from cache if available
+                    const model = relCache[`${relPath}:${record.id}`];
                     if (model !== undefined) {
                         return model;
                     }
+
+                    options.relsFromCache = getRelsFromCache(
+                        record, relationsToNestedKeys(this.__activeRelations),
+                        repos, relMapping,
+                        relPath, relCache,
+                    );
                 }
 
                 // TODO: I'm not happy at all about how this looks.
                 // We'll need to finetune some things, but hey, for now it works.
 
-                const model = this._newModel(null);
+                const model = this._newModel(null, options);
                 model.fromBackend({
                     data: record,
                     repos,
@@ -151,7 +198,18 @@ export default class Store {
                 });
 
                 if (this.__linkRelations === 'graph') {
-                    relCache[relCacheKey] = model;
+                    const toAdd = [[relPath, model]];
+                    while (toAdd.length > 0) {
+                        const [relPath, model] = toAdd.pop();
+                        relCache[`${relPath}:${model.id}`] = model;
+
+                        for (const rel of model.__activeCurrentRelations) {
+                            const relModel = model[rel];
+                            if (relModel instanceof Model && !relModel.isNew) {
+                                toAdd.push([`${relPath}.${rel}`, relModel]);
+                            }
+                        }
+                    }
                 }
 
                 return model;

src/__tests__/Store.js

@@ -24,12 +24,14 @@ import customersWithTownRestaurantsUnbalanced from './fixtures/customers-with-to
 import townsWithRestaurantsAndCustomersNoIdList from './fixtures/towns-with-restaurants-and-customers-no-id-list.json';
 import customersWithOldTowns from './fixtures/customers-with-old-towns.json';
 import animalsData from './fixtures/animals.json';
+import animalsGraphData from './fixtures/animals-graph.json';
 import pagination0Data from './fixtures/pagination/0.json';
 import pagination1Data from './fixtures/pagination/1.json';
 import pagination2Data from './fixtures/pagination/2.json';
 import pagination3Data from './fixtures/pagination/3.json';
 import pagination4Data from './fixtures/pagination/4.json';
 
+
 const simpleData = [
     {
         id: 2,
@@ -1010,3 +1012,34 @@ describe('Pagination', () => {
             });
     });
 });
+
+describe('Graph parse', () => {
+    let mock;
+    beforeEach(() => {
+        mock = new MockAdapter(axios);
+    });
+    afterEach(() => {
+        if (mock) {
+            mock.restore();
+            mock = null;
+        }
+    });
+
+    test('animals with owner & town', () => {
+        mock.onAny().replyOnce(() => [200, animalsGraphData]);
+
+        const animalStore = new AnimalStore({
+            linkRelations: 'graph',
+            relations: ['owner.town'],
+        });
+
+        return animalStore.fetch().then(() => {
+            expect(animalStore.map('id')).toEqual([1, 2, 3]);
+
+            expect(animalStore.at(0).owner).toBe(animalStore.at(1).owner);
+            expect(animalStore.at(0).owner).not.toBe(animalStore.at(2).owner);
+
+            expect(animalStore.at(0).owner.town).toBe(animalStore.at(2).owner.town);
+        });
+    });
+});

src/__tests__/fixtures/animals-graph.json

@@ -0,0 +1,46 @@
+{
+  "data": [
+    {
+      "id": 1,
+      "name": "Foo",
+      "owner": 1
+    },
+    {
+      "id": 2,
+      "name": "Bar",
+      "owner": 1
+    },
+    {
+      "id": 3,
+      "name": "Baz",
+      "owner": 2
+    }
+  ],
+  "with": {
+    "person": [
+      {
+        "id": 1,
+        "name": "FOO",
+        "town": 1
+      },
+      {
+        "id": 2,
+        "name": "BAR",
+        "town": 1
+      }
+    ],
+    "town": [
+      {
+        "id": 1,
+        "name": "Eindhoven"
+      }
+    ]
+  },
+  "with_mapping": {
+    "owner": "person",
+    "owner.town": "town"
+  },
+  "meta": {
+    "total_records": 3
+  }
+}