Org unit view page shares pies with other pages

#86

Author: davidwatkins73

waltz-ng/client/org-units/directives/org-unit-overview.html

@@ -36,35 +36,28 @@ <h3 style="margin-top: 10px; padding-bottom: 4px; border-bottom: 1px solid #eee;
             <br>
 
             <div class="container-fluid">
+
                 <div class="row">
                     <div class="col-sm-4">
-                        <waltz-pie-table data="ctrl.pies.appPhase.data"
-                                         config="ctrl.pies.appPhase.config"
-                                         class="clickable"
-                                         waltz-jump-to="apps-section"
-                                         title="Apps By Lifecycle Phase"
-                                         icon="desktop">
-                        </waltz-pie-table>
+                        <waltz-apps-by-investment-pie applications="ctrl.apps"
+                                                      size="80">
+                        </waltz-apps-by-investment-pie>
                     </div>
+
                     <div class="col-sm-4">
-                        <waltz-pie-table data="ctrl.pies.appInvestment.data"
-                                         config="ctrl.pies.appInvestment.config"
-                                         class="clickable"
-                                         waltz-jump-to="apps-section"
-                                         icon="money"
-                                         title="Apps By Investment Status">
-                        </waltz-pie-table>
+                        <waltz-apps-by-lifecycle-phase-pie applications="ctrl.apps"
+                                                           size="80">
+                        </waltz-apps-by-lifecycle-phase-pie>
                     </div>
+
                     <div class="col-sm-4">
-                        <waltz-pie-table data="ctrl.pies.appConnections.data"
-                                         config="ctrl.pies.appConnections.config"
-                                         class="clickable"
-                                         waltz-jump-to="flows-section"
-                                         icon="random"
-                                         title="Application Connections">
-                        </waltz-pie-table>
+                        <waltz-data-flows-by-direction-pie applications='ctrl.apps'
+                                                           flows="ctrl.flows.flows"
+                                                           size="80">
+                        </waltz-data-flows-by-direction-pie>
                     </div>
                 </div>
+
                 <div class="row">
                     <div class="col-sm-3">
                         <waltz-basic-info-tile name="Portfolio Cost"

waltz-ng/client/org-units/directives/org-unit-overview.js

@@ -19,51 +19,6 @@ import { calcPortfolioCost } from '../../asset-cost/services/asset-cost-utilitie
 import { calcComplexitySummary } from '../../complexity/services/complexity-utilities';
 
 
-import {
-    lifecyclePhaseColorScale,
-    capabilityColorScale,
-    flowDirectionColorScale,
-    ragColorScale } from '../../common/colors';
-
-
-
-function calcAppPhasePieStats(apps) {
-    return _.chain(apps)
-            .countBy('lifecyclePhase')
-            .map((v, k) => ({ key: k, count: v }))
-            .value();
-}
-
-
-function calcAppInvestmentPieStats(apps) {
-    return _.chain(apps)
-            .countBy('overallRating')
-            .map((v, k) => ({ key: k, count: v }))
-            .value();
-}
-
-
-function calcAppConnectionPieStats(flows, apps) {
-    const logicalFlows = flows.flows;
-
-    const orgMemberAppIds = _.map(apps, 'id');
-
-    return _.chain(logicalFlows)
-        .uniq(false, f => f.source.id + '.' + f.target.id)
-        .map(f => {
-            const sourceIsMember = _.contains(orgMemberAppIds, f.source.id);
-            const targetIsMember = _.contains(orgMemberAppIds, f.target.id);
-            if (sourceIsMember && targetIsMember) return 'INTRA';
-            if (sourceIsMember) return 'INBOUND';
-            if (targetIsMember) return 'OUTBOUND';
-            return 'UNKNOWN';
-        })
-        .countBy()
-        .map((v, k) => ({ key: k, count: v }))
-        .value();
-}
-
-
 function calcCapabilityStats(ratings) {
     const caps = _.chain(ratings)
         .map("capability")
@@ -90,53 +45,12 @@ function controller($scope, orgUnitStore) {
     vm.saveDescriptionFn = (newValue, oldValue) =>
             orgUnitStore.updateDescription(vm.unit.id, newValue, oldValue);
 
-    const investmentLabels = {
-        'R' : 'Disinvest',
-        'A' : 'Maintain',
-        'G' : 'Invest'
-    };
-
-    const pies = {
-        appPhase: {
-            config: {
-                colorProvider: (d) => lifecyclePhaseColorScale(d.data.key),
-                size: 80
-            }
-        },
-        appConnections: {
-            config: {
-                colorProvider: (d) => flowDirectionColorScale(d.data.key),
-                size: 80
-            }
-        },
-        appInvestment: {
-            config: {
-                colorProvider: (d) => ragColorScale(d.data.key),
-                size: 80,
-                labelProvider: (k) => investmentLabels[k] || 'Unknown'
-            }
-        }
-    };
-
-    vm.pies = pies;
-
-    $scope.$watch('ctrl.apps', apps => {
-        if (!apps) return;
-        vm.pies.appPhase.data = calcAppPhasePieStats(apps);
-        vm.pies.appInvestment.data = calcAppInvestmentPieStats(apps);
-    });
 
     $scope.$watch('ctrl.ratings', ratings => {
         if (!ratings) return;
         vm.capabilityStats = calcCapabilityStats(ratings);
     });
 
-    $scope.$watch('ctrl.flows', flows => {
-        if (!flows) return;
-        vm.pies.appConnections.data = calcAppConnectionPieStats(flows, this.apps);
-    });
-
-
     $scope.$watch('ctrl.costs', cs => vm.portfolioCostStr = calcPortfolioCost(cs));
 
     $scope.$watch('ctrl.orgServerStats', stats => {