Moved graph reducer from graph store to graph components

Change-Id: If0e14068d350a823758d702b0dd0de315351a37d
diff --git a/src/app/service-graph/components/coarse/coarse.component.ts b/src/app/service-graph/components/coarse/coarse.component.ts
index cfbfc32..d02bb23 100644
--- a/src/app/service-graph/components/coarse/coarse.component.ts
+++ b/src/app/service-graph/components/coarse/coarse.component.ts
@@ -1,12 +1,14 @@
 import './coarse.component.scss';
 import * as d3 from 'd3';
 import * as $ from 'jquery';
+import * as _ from 'lodash';
 import {IXosServiceGraphStore} from '../../services/graph.store';
 import {IXosServiceGraph, IXosServiceGraphNode, IXosServiceGraphLink} from '../../interfaces';
 import {XosServiceGraphConfig as config} from '../../graph.config';
 import {IXosDebouncer} from '../../../core/services/helpers/debounce.helper';
 import {Subscription} from 'rxjs';
 import {IXosGraphHelpers} from '../../services/d3-helpers/graph.helpers';
+import {IXosServiceGraphReducer, IXosServiceGraphExtender} from '../../services/graph.extender';
 
 class XosCoarseTenancyGraphCtrl {
 
@@ -14,7 +16,8 @@
     '$log',
     'XosServiceGraphStore',
     'XosDebouncer',
-    'XosGraphHelpers'
+    'XosGraphHelpers',
+    'XosServiceGraphExtender'
   ];
 
   public graph: IXosServiceGraph;
@@ -34,7 +37,8 @@
     private $log: ng.ILogService,
     private XosServiceGraphStore: IXosServiceGraphStore,
     private XosDebouncer: IXosDebouncer,
-    private XosGraphHelpers: IXosGraphHelpers
+    private XosGraphHelpers: IXosGraphHelpers,
+    private XosServiceGraphExtender: IXosServiceGraphExtender
   ) {
 
   }
@@ -44,14 +48,18 @@
 
     this.CoarseGraphSubscription = this.XosServiceGraphStore.getCoarse()
       .subscribe(
-        (res: IXosServiceGraph) => {
-          this.$log.debug(`[XosCoarseTenancyGraph] Coarse Event and render`, res);
+        (graph: IXosServiceGraph) => {
+          this.$log.debug(`[XosCoarseTenancyGraph] Coarse Event and render`, graph);
 
           // id there are no data, do nothing
-          if (!res) {
+          if (graph.nodes.length === 0) {
             return;
           }
-          this.graph = res;
+          this.graph = graph;
+
+          _.forEach(this.XosServiceGraphExtender.getCoarse(), (r: IXosServiceGraphReducer) => {
+            graph = r.reducer(graph);
+          });
           this.renderGraph();
         },
         err => {
diff --git a/src/app/service-graph/components/fine-grained/fine-grained.component.ts b/src/app/service-graph/components/fine-grained/fine-grained.component.ts
index 0fbf411..64955ae 100644
--- a/src/app/service-graph/components/fine-grained/fine-grained.component.ts
+++ b/src/app/service-graph/components/fine-grained/fine-grained.component.ts
@@ -2,6 +2,7 @@
 import './fine-grained.component.scss';
 import * as d3 from 'd3';
 import * as $ from 'jquery';
+import * as _ from 'lodash';
 import {Subscription} from 'rxjs';
 import {XosServiceGraphConfig as config} from '../../graph.config';
 import {IXosDebouncer} from '../../../core/services/helpers/debounce.helper';
@@ -9,6 +10,7 @@
 import {IXosModelDiscovererService} from '../../../datasources/helpers/model-discoverer.service';
 import {IXosSidePanelService} from '../../../core/side-panel/side-panel.service';
 import {IXosGraphHelpers} from '../../services/d3-helpers/graph.helpers';
+import {IXosServiceGraphExtender, IXosServiceGraphReducer} from '../../services/graph.extender';
 
 class XosFineGrainedTenancyGraphCtrl {
   static $inject = [
@@ -17,7 +19,8 @@
     'XosDebouncer',
     'XosModelDiscoverer',
     'XosSidePanel',
-    'XosGraphHelpers'
+    'XosGraphHelpers',
+    'XosServiceGraphExtender'
   ];
 
   public graph: IXosServiceGraph;
@@ -40,12 +43,13 @@
     private XosDebouncer: IXosDebouncer,
     private XosModelDiscoverer: IXosModelDiscovererService,
     private XosSidePanel: IXosSidePanelService,
-    private XosGraphHelpers: IXosGraphHelpers
+    private XosGraphHelpers: IXosGraphHelpers,
+    private XosServiceGraphExtender: IXosServiceGraphExtender
   ) {
     this.handleSvg();
     this.loadDefs();
     this.setupForceLayout();
-    this.renderGraph = this.XosDebouncer.debounce(this._renderGraph, 500, this);
+    this.renderGraph = this.XosDebouncer.debounce(this._renderGraph, 1000, this);
 
     $(window).on('resize', () => {
       this.setupForceLayout();
@@ -61,6 +65,10 @@
             return;
           }
 
+          _.forEach(this.XosServiceGraphExtender.getFinegrained(), (r: IXosServiceGraphReducer) => {
+            graph = r.reducer(graph);
+          });
+
           this.graph = graph;
           this.renderGraph();
         },
diff --git a/src/app/service-graph/services/graph.store.spec.ts b/src/app/service-graph/services/graph.store.spec.ts
index 6d50a5a..da389e1 100644
--- a/src/app/service-graph/services/graph.store.spec.ts
+++ b/src/app/service-graph/services/graph.store.spec.ts
@@ -91,8 +91,8 @@
         );
     });
 
-    describe('when a reducer is register', () => {
-
+    xdescribe('when a reducer is registered', () => {
+      // NOTE the reducer appliance has been moved in the component
       beforeEach((done) => {
         extender.register('coarse', 'test', (graph: IXosServiceGraph) => {
           graph.nodes = graph.nodes.map(n => {
diff --git a/src/app/service-graph/services/graph.store.ts b/src/app/service-graph/services/graph.store.ts
index 7908440..7c6e552 100644
--- a/src/app/service-graph/services/graph.store.ts
+++ b/src/app/service-graph/services/graph.store.ts
@@ -6,7 +6,6 @@
   IXosServiceGraphNode, IXosServiceGraphLink, IXosFineGrainedGraphData
 } from '../interfaces';
 import {IXosDebouncer} from '../../core/services/helpers/debounce.helper';
-import {IXosServiceGraphExtender, IXosServiceGraphReducer} from './graph.extender';
 export interface IXosServiceGraphStore {
   get(): Observable<IXosServiceGraph>;
   getCoarse(): Observable<IXosServiceGraph>;
@@ -16,8 +15,7 @@
   static $inject = [
     '$log',
     'XosModelStore',
-    'XosDebouncer',
-    'XosServiceGraphExtender'
+    'XosDebouncer'
   ];
 
   // graph data store
@@ -58,8 +56,7 @@
   constructor (
     private $log: ng.ILogService,
     private XosModelStore: IXosModelStoreService,
-    private XosDebouncer: IXosDebouncer,
-    private XosServiceGraphExtender: IXosServiceGraphExtender
+    private XosDebouncer: IXosDebouncer
   ) {
 
     this.$log.info(`[XosServiceGraphStore] Setup`);
@@ -249,10 +246,6 @@
         links
       };
 
-      _.forEach(this.XosServiceGraphExtender.getCoarse(), (r: IXosServiceGraphReducer) => {
-        graph = r.reducer(graph);
-      });
-
       this.d3CoarseGraph.next(graph);
     } catch (e) {
       this.d3CoarseGraph.error(e);
@@ -286,8 +279,7 @@
       const links = _.reduce(data.tenants, (links: IXosServiceGraphLink[], tenant: IXosTenantModel) => {
         const sourceId = this.getSourceId(tenant);
         const targetId = this.getTargetId(tenant);
-
-        if (!angular.isDefined(targetId)) {
+        if (!angular.isDefined(targetId) || !angular.isDefined(sourceId)) {
           // if the tenant is not pointing to anything, don't draw links
           return links;
         }
@@ -306,8 +298,12 @@
           model: tenant
         };
 
-        links.push(tenantToProvider);
-        links.push(tenantToSubscriber);
+        if (angular.isDefined(tenantToProvider.source) && angular.isDefined(tenantToProvider.target)) {
+          links.push(tenantToProvider);
+        }
+        if (angular.isDefined(tenantToSubscriber.source) && angular.isDefined(tenantToSubscriber.target)) {
+          links.push(tenantToSubscriber);
+        }
         return links;
       }, []);
 
@@ -320,9 +316,6 @@
         links
       };
 
-      _.forEach(this.XosServiceGraphExtender.getFinegrained(), (r: IXosServiceGraphReducer) => {
-        graph = r.reducer(graph);
-      });
       this.d3FineGrainedGraph.next(graph);
     } catch (e) {
      this.d3FineGrainedGraph.error(e);