Ádding middlewares to our network interface

client/coral-framework/helpers/storage.js

@@ -10,22 +10,17 @@ function storageAvailable(type) {
     error = e;
     return (
       e instanceof DOMException &&
-
       // everything except Firefox
       (e.code === 22 ||
+        // Firefox
 
-      // Firefox
-
-      e.code === 1014 ||
-
-      // test name field too, because code might not be present
-
-      // everything except Firefox
-      e.name === 'QuotaExceededError' ||
-
-      // Firefox
-      e.name === 'NS_ERROR_DOM_QUOTA_REACHED') &&
+        e.code === 1014 ||
+        // test name field too, because code might not be present
 
+        // everything except Firefox
+        e.name === 'QuotaExceededError' ||
+        // Firefox
+        e.name === 'NS_ERROR_DOM_QUOTA_REACHED') &&
       // acknowledge QuotaExceededError only if there's something already stored
       storage.length !== 0
     );
@@ -39,12 +34,15 @@ function lazyCheckStorage() {
 }
 
 export function getItem(item = '') {
+  console.log(`asking for item ${item}`);
   lazyCheckStorage();
 
   if (available) {
     return localStorage.getItem(item);
   } else {
-    console.error(`Cannot get from localStorage. localStorage is not available. ${error}`);
+    console.error(
+      `Cannot get from localStorage. localStorage is not available. ${error}`
+    );
   }
 }
 
@@ -54,7 +52,9 @@ export function setItem(item = '', value) {
   if (available) {
     return localStorage.setItem(item, value);
   } else {
-    console.error(`Cannot set localStorage. localStorage is not available. ${error}`);
+    console.error(
+      `Cannot set localStorage. localStorage is not available. ${error}`
+    );
   }
 }
 
@@ -64,7 +64,9 @@ export function removeItem(item = '') {
   if (available) {
     return localStorage.removeItem(item);
   } else {
-    console.error(`Cannot remove item from localStorage. localStorage is not available. ${error}`);
+    console.error(
+      `Cannot remove item from localStorage. localStorage is not available. ${error}`
+    );
   }
 }
 
@@ -74,6 +76,13 @@ export function clear() {
   if (available) {
     return localStorage.clear();
   } else {
-    console.error(`Cannot clear localStorage. localStorage is not available. ${error}`);
+    console.error(
+      `Cannot clear localStorage. localStorage is not available. ${error}`
+    );
   }
 }
+
+window.addEventListener('storage', function(e) {
+  const msg = `${e.key} " was changed in page ${e.url} from ${e.oldValue} to ${e.newValue}`;
+  console.log(msg);
+});

client/coral-framework/services/client.js

@@ -1,5 +1,5 @@
 import ApolloClient, {addTypename} from 'apollo-client';
-import getNetworkInterface from './transport';
+import {networkInterface} from './transport';
 
 // import {SubscriptionClient, addGraphQLSubscriptions} from 'subscriptions-transport-ws';
 
@@ -11,8 +11,6 @@ import getNetworkInterface from './transport';
 //   getNetworkInterface(),
 //   wsClient,
 // );
-const networkInterface = getNetworkInterface();
-
 export const client = new ApolloClient({
   connectToDevTools: true,
   queryTransformer: addTypename,

client/coral-framework/services/transport.js

@@ -1,18 +1,31 @@
-import {createNetworkInterface} from 'apollo-client';
+import ApolloClient, {createNetworkInterface} from 'apollo-client';
 import * as Storage from '../helpers/storage';
 
-export default function getNetworkInterface(
-  apiUrl = '/api/v1/graph/ql',
-  headers = {}
-) {
-  return new createNetworkInterface({
-    uri: apiUrl,
-    opts: {
-      credentials: 'same-origin',
-      headers: {
-        Authorization: `Bearer ${Storage.getItem('token')}`,
-        ...headers
-      }
+//==============================================================================
+// NETWORK INTERFACE
+//==============================================================================
+
+const networkInterface = createNetworkInterface({
+  uri: '/api/v1/graph/ql',
+  opts: {
+    credentials: 'same-origin'
+  }
+});
+
+//==============================================================================
+// MIDDLEWARES
+//==============================================================================
+
+networkInterface.use([{
+  applyMiddleware(req, next) {
+    if (!req.options.headers) {
+      req.options.headers = {};  // Create the header object if needed.
     }
-  });
-}
+    req.options.headers['authorization'] = `Bearer ${Storage.getItem('token')}`;
+    next();
+  }
+}]);
+
+export {
+  networkInterface
+};