Externalize cache updates to object (#104)

Follows new approach from aerogear/aerogear-js-sdk#292
Requires to link js-SDK for the moment.

ticket:
https://issues.jboss.org/browse/AEROGEAR-8333

## Verification steps

1. Add new item when offline
2. Restart mobile app (do not work in website version)
3. See item that was added. 
4. Restore network - see that item is still there

package.json

@@ -19,7 +19,7 @@
     "@aerogear/cordova-plugin-aerogear-metrics": "2.3.0",
     "@aerogear/push": "2.3.0",
     "@aerogear/security": "2.3.0",
-    "@aerogear/voyager-client": "2.3.0",
+    "@aerogear/voyager-client": "2.3.1-dev.2",
     "@angular/common": "7.2.7",
     "@angular/core": "7.2.7",
     "@angular/forms": "7.2.7",

src/app/services/sync/cache.updates.ts

@@ -0,0 +1,71 @@
+import { GET_TASKS } from './graphql.queries';
+
+export const taskCacheUpdates = {
+    createTask: (cache, { data }) => {
+        data = data.createTask;
+        try {
+            let { allTasks } = cache.readQuery({ query: GET_TASKS });
+            if (allTasks) {
+                if (!allTasks.find((task) => task.id === data.id)) {
+                    allTasks.push(data);
+                }
+            } else {
+                allTasks = [data];
+            }
+            cache.writeQuery({
+                query: GET_TASKS,
+                data: {
+                    'allTasks': allTasks
+                }
+            });
+        } catch (e) {
+            // ignore as cache may not be populated at this point
+        }
+    },
+
+    updateTask: (cache, { data }) => {
+        data = data.updateTask;
+        try {
+            const { allTasks } = cache.readQuery({ query: GET_TASKS });
+            if (allTasks) {
+                const index = allTasks.findIndex((task) => {
+                    return data.id === task.id;
+                });
+                allTasks[index] = data;
+            }
+            cache.writeQuery({
+                query: GET_TASKS,
+                data: {
+                    'allTasks': allTasks
+                }
+            });
+        } catch (e) {
+            // ignore as cache may not be populated at this point
+        }
+    },
+
+    deleteTask: (cache, { data }) => {
+        data = data.deleteTask;
+        let deletedId;
+        if (data.optimisticResponse) {
+            // Map optimistic response field
+            deletedId = data.id;
+        } else {
+            deletedId = data;
+        }
+        try {
+            const { allTasks } = cache.readQuery({ query: GET_TASKS, });
+            const newData = allTasks.filter((item) => {
+                return deletedId !== item.id;
+            });
+            cache.writeQuery({
+                query: GET_TASKS,
+                data: {
+                    'allTasks': newData
+                }
+            });
+        } catch (e) {
+            // ignore as cache may not be populated at this point
+        }
+    }
+};

src/app/services/sync/item.service.ts

@@ -9,6 +9,7 @@ import {
 import { AllTasks, Task, MutationType } from './types';
 import { VoyagerService } from './voyager.service';
 import { VoyagerClient, createOptimisticResponse } from '@aerogear/voyager-client';
+import { taskCacheUpdates } from './cache.updates';
 
 @Injectable({
   providedIn: 'root'
@@ -81,15 +82,15 @@ export class ItemService {
       variables: item,
       optimisticResponse:
         createOptimisticResponse('createTask', 'Task', item),
-      update: this.updateCacheOnAdd
+      update: taskCacheUpdates.createTask
     });
   }
 
   updateItem(item) {
     return this.apollo.mutate<Task>({
       mutation: UPDATE_TASK,
       variables: item,
-      update: this.updateCacheOnEdit,
+      update: taskCacheUpdates.updateTask,
       optimisticResponse:
         createOptimisticResponse('updateTask', 'Task', item, false)
     });
@@ -99,67 +100,10 @@ export class ItemService {
     return this.apollo.mutate<Task>({
       mutation: DELETE_TASK,
       variables: { id: item.id },
-      update: this.updateCacheOnDelete,
+      update: taskCacheUpdates.deleteTask,
       optimisticResponse:
         createOptimisticResponse('deleteTask', 'Task', { id: item.id }, false)
     });
   }
 
-  // Local cache updates for CRUD operations
-  updateCacheOnAdd(cache, { data }) {
-    data = data.createTask;
-    let { allTasks } = cache.readQuery({ query: GET_TASKS });
-    if (allTasks) {
-      if (!allTasks.find((task) => task.id === data.id)) {
-        allTasks.push(data);
-      }
-    } else {
-      allTasks = [data];
-    }
-    cache.writeQuery({
-      query: GET_TASKS,
-      data: {
-        'allTasks': allTasks
-      }
-    });
-  }
-
-  updateCacheOnEdit(cache, { data }) {
-    data = data.updateTask;
-    const { allTasks } = cache.readQuery({ query: GET_TASKS });
-    if (allTasks) {
-      const index = allTasks.findIndex((task) => {
-        return data.id === task.id;
-      });
-      allTasks[index] = data;
-    }
-    cache.writeQuery({
-      query: GET_TASKS,
-      data: {
-        'allTasks': allTasks
-      }
-    });
-  }
-
-  updateCacheOnDelete(cache, { data }) {
-    data = data.deleteTask;
-    let deletedId;
-    if (data.optimisticResponse) {
-      // Map optimistic response field
-      deletedId = data.id;
-    } else {
-      deletedId = data;
-    }
-
-    const { allTasks } = cache.readQuery({ query: GET_TASKS });
-    const newData = allTasks.filter((item) => {
-      return deletedId !== item.id;
-    });
-    cache.writeQuery({
-      query: GET_TASKS,
-      data: {
-        'allTasks': newData
-      }
-    });
-  }
 }

src/app/services/sync/voyager.service.ts

@@ -6,6 +6,7 @@ import { Injectable } from '@angular/core';
 import { OpenShiftService } from '../openshift.service';
 import { AlertController } from '@ionic/angular';
 import { AuthService } from '../auth.service';
+import { taskCacheUpdates } from './cache.updates';
 
 /**
  * Class used to log data conflicts in server
@@ -62,10 +63,13 @@ export class VoyagerService {
         }
       }
     };
+    // Merget all cache updates functions (currently only single)
+    const mergedCacheUpdates = taskCacheUpdates;
     const options: DataSyncConfig = {
       offlineQueueListener: numberOfOperationsProvider,
       conflictListener: new ConflictLogger(this.alertCtrl),
-      fileUpload: true
+      fileUpload: true,
+      mutationCacheUpdates: mergedCacheUpdates
     };
     if (!this.openShift.hasSyncConfig()) {
       // Use default localhost urls when OpenShift config is missing