Measurable Category ordering and icons

#CTCTOWALTZ-2723 finos#6590
deutschebank · May 19, 2023 · 6e9c33b · 6e9c33b
1 parent dd1ea68
commit 6e9c33b
Show file tree

Hide file tree

Showing 8 changed files with 69 additions and 31 deletions.
diff --git a/waltz-ng/client/measurable-rating/components/app-section/measurable-rating-app-section.html b/waltz-ng/client/measurable-rating/components/app-section/measurable-rating-app-section.html
@@ -151,8 +151,10 @@
                    popover-append-to-body="true"
                    popover-placement="bottom"
                    popover-popup-delay="300"
-                   ng-repeat-end
-                   ng-bind="tab.category.name">
+                   ng-repeat-end>
+                <waltz-icon name="{{tab.category.icon}}"></waltz-icon>
+                <span ng-bind="tab.category.name">
+                </span>
             </label>
 
             <div ng-repeat="tab in $ctrl.tabs"

diff --git a/waltz-ng/client/measurable-rating/components/app-section/measurable-rating-app-section.js b/waltz-ng/client/measurable-rating/components/app-section/measurable-rating-app-section.js
@@ -73,10 +73,10 @@ function controller($q, serviceBroker, settingsService, userService) {
             .then((r) => {
                 Object.assign(vm, r);
                 vm.tabs = mkTabs(vm, false);
-                const firstNonEmptyTab = determineStartingTab(vm.tabs);
-                if (firstNonEmptyTab) {
-                    vm.visibility.tab = firstNonEmptyTab.category.id;
-                    vm.onTabChange(firstNonEmptyTab);
+                const startingTab = determineStartingTab(vm.tabs, vm.lastViewedCategoryId);
+                if (startingTab) {
+                    vm.visibility.tab = startingTab.category.id;
+                    vm.onTabChange(startingTab);
                 }
             });
     };

diff --git a/...easurable-rating/components/browser-tree-panel/measurable-ratings-browser-tree-panel.html b/...easurable-rating/components/browser-tree-panel/measurable-ratings-browser-tree-panel.html
@@ -22,6 +22,7 @@
             <waltz-measurable-ratings-browser rating-tallies="$ctrl.ratingTallies"
                                               measurables="$ctrl.measurables"
                                               categories="$ctrl.measurableCategories"
+                                              last-viewed-category-id="$ctrl.lastViewedCategoryId"
                                               scroll-height="500"
                                               on-select="$ctrl.onSelect"
                                               on-select-unmapped="$ctrl.onSelectUnmapped"

diff --git a/.../measurable-rating/components/browser-tree-panel/measurable-ratings-browser-tree-panel.js b/.../measurable-rating/components/browser-tree-panel/measurable-ratings-browser-tree-panel.js
@@ -24,6 +24,7 @@ import {CORE_API} from "../../../common/services/core-api-utils";
 import {indexRatingSchemes} from "../../../ratings/rating-utils";
 
 import template from "./measurable-ratings-browser-tree-panel.html";
+import {lastViewedMeasurableCategoryKey} from "../../../user";
 
 /**
  * @name waltz-measurable-ratings-browser-tree-panel
@@ -198,6 +199,18 @@ function loadMeasurableCategories(serviceBroker, holder) {
 }
 
 
+function loadLastViewedCategory(serviceBroker, holder) {
+    return serviceBroker
+        .loadAppData(CORE_API.UserPreferenceStore.findAllForUser, [], {force: true})
+        .then(r => {
+            const lastViewed = _.find(r.data, d => d.key === lastViewedMeasurableCategoryKey);
+            return holder.lastViewedCategoryId = lastViewed
+                ? Number(lastViewed.value)
+                : null;
+        });
+}
+
+
 function loadApps(serviceBroker, selector, holder) {
     return serviceBroker
         .loadViewData(CORE_API.ApplicationStore.findBySelector, [selector])
@@ -234,7 +247,8 @@ function controller($q, serviceBroker) {
             loadMeasurables(serviceBroker, vm.selector, vm),
             loadRatingSchemes(serviceBroker, vm),
             loadMeasurableRatings(serviceBroker, vm.selector, vm),
-            loadApps(serviceBroker, vm.selector, vm)
+            loadApps(serviceBroker, vm.selector, vm),
+            loadLastViewedCategory(serviceBroker, vm)
         ]);
     };
 

diff --git a/waltz-ng/client/measurable-rating/components/browser/measurable-ratings-browser.html b/waltz-ng/client/measurable-rating/components/browser/measurable-ratings-browser.html
@@ -29,7 +29,9 @@
         <label class="wt-label"
                for="{{ tab.category.id + '_' + $id}}"
                ng-repeat-end>
-            <div ng-bind="tab.category.name"></div>
+            <waltz-icon name="{{tab.category.icon}}"></waltz-icon>
+            <span ng-bind="tab.category.name">
+            </span>
         </label>
 
         <div ng-repeat="tab in $ctrl.tabs track by tab.category.id"

diff --git a/waltz-ng/client/measurable-rating/components/browser/measurable-ratings-browser.js b/waltz-ng/client/measurable-rating/components/browser/measurable-ratings-browser.js
@@ -33,13 +33,14 @@ import template from "./measurable-ratings-browser.html";
 
 
 const bindings = {
-    measurables: '<',
-    categories: '<',
-    ratingTallies: '<',
-    onSelect: '<',
-    onSelectUnmapped: '<?',
-    onCategorySelect: '<',
-    scrollHeight: '<'
+    measurables: "<",
+    categories: "<",
+    ratingTallies: "<",
+    lastViewedCategoryId: "<?",
+    onSelect: "<",
+    onSelectUnmapped: "<?",
+    onCategorySelect: "<",
+    scrollHeight: "<"
 };
 
 
@@ -50,15 +51,15 @@ const initialState = {
     treeOptions: {
         nodeChildren: "children",
         dirSelectable: true,
-        equality: function(node1, node2) {
+        equality: function (node1, node2) {
             if (node1 && node2) {
                 return node1.id === node2.id;
             } else {
                 return false;
             }
         }
     },
-    onSelect: (d) => console.log('wmrb: default on-select', d),
+    onSelect: (d) => console.log("wmrb: default on-select", d),
     onSelectUnmapped: null, // This will cause the 'view unmapped measurables' label not to render
     visibility: {
         tab: null
@@ -95,15 +96,15 @@ function prepareTreeData(data = []) {
 
 
 function prepareTabs(categories = [], measurables = [], ratingSchemesById = {}) {
-    const measurablesByCategory = _.groupBy(measurables, 'categoryId');
+    const measurablesByCategory = _.groupBy(measurables, "categoryId");
     return _
         .chain(categories)
         .filter(category => _.get(measurablesByCategory, category.id, []).length > 0)
         .map(category => {
             const measurablesForCategory = measurablesByCategory[category.id];
             const treeData = prepareTreeData(measurablesForCategory);
             const maxSize = _.chain(treeData)
-                .map('totalRatings.total')
+                .map("totalRatings.total")
                 .max()
                 .value();
 
@@ -127,7 +128,7 @@ function findFirstNonEmptyTab(tabs = []) {
 
 
 function initialiseRatingTalliesMap(ratingTallies = [], measurables = []) {
-    const talliesById = _.groupBy(ratingTallies, 'id');
+    const talliesById = _.groupBy(ratingTallies, "id");
 
     const reducer = (acc, m) => {
         const talliesForMeasurable = talliesById[m.id];
@@ -146,7 +147,7 @@ function initialiseRatingTalliesMap(ratingTallies = [], measurables = []) {
 
 
 function mkRatingTalliesMap(ratingTallies = [], measurables = []) {
-    const measurablesById = _.keyBy(measurables, 'id');
+    const measurablesById = _.keyBy(measurables, "id");
     const talliesMap = initialiseRatingTalliesMap(ratingTallies, measurables);
     _.each(measurables, m => {
         const rs = talliesMap[m.id];
@@ -178,7 +179,8 @@ function controller(serviceBroker) {
             }
         } else {
             const tabs = prepareTabs(vm.categories, vm.measurables, vm.ratingSchemesById);
-            const tab = findFirstNonEmptyTab(tabs);
+            const lastViewedCategory = _.find(tabs, t => t.category.id === vm.lastViewedCategoryId);
+            const tab = lastViewedCategory || findFirstNonEmptyTab(tabs);
 
             vm.tabs = tabs;
 
@@ -188,7 +190,7 @@ function controller(serviceBroker) {
                     _.values(vm.ratingsMap),
                     r => _.get(r, ["compound", "total"], [0])));
 
-            if (! vm.visibility.tab) {
+            if (!vm.visibility.tab) {
                 // no tab selected, select the first
                 vm.visibility.tab = _.get(tab, ["category", "id"]);
                 vm.onTabChange(tab);
@@ -222,7 +224,7 @@ function controller(serviceBroker) {
 
 
 controller.$inject = [
-    'ServiceBroker'
+    "ServiceBroker"
 ];
 
 

diff --git a/waltz-ng/client/measurable-rating/measurable-rating-utils.js b/waltz-ng/client/measurable-rating/measurable-rating-utils.js
@@ -20,6 +20,7 @@ import moment from "moment";
 import {CORE_API} from "../common/services/core-api-utils";
 import {mkSelectionOptions} from "../common/selector-utils";
 import {formats} from "../common";
+import {lastViewedMeasurableCategoryKey} from "../user";
 
 
 export function loadDecommData(
@@ -133,14 +134,26 @@ export function loadAllData(
         .loadViewData(
             CORE_API.AllocationStore.findByEntity,
             [parentEntityRef],
-            { force })
+            {force})
         .then(r => ({
             allocations: r.data,
             allocationTotalsByScheme: _
                 .chain(r.data)
                 .groupBy(d => d.schemeId)
                 .mapValues(xs => _.sumBy(xs, x => x.percentage))
-                .value()}));
+                .value()
+        }));
+
+    const lastViewedCategoryPromise = serviceBroker
+        .loadAppData(CORE_API.UserPreferenceStore.findAllForUser, [], {force: true})
+        .then(r => {
+            const lastViewed = _.find(r.data, d => d.key === lastViewedMeasurableCategoryKey);
+            return {
+                lastViewedCategoryId: lastViewed
+                    ? Number(lastViewed.value)
+                    : null
+            };
+        });
 
     const decommPromise = loadDecommData(
         $q,
@@ -157,7 +170,8 @@ export function loadAllData(
             allocationsPromise,
             allocationSchemesPromise,
             decommPromise,
-            roadmapsPromise])
+            roadmapsPromise,
+            lastViewedCategoryPromise])
         .then(results => Object.assign({}, ...results));
 }
 
@@ -197,8 +211,10 @@ export function mkTabs(ctx, includeEmpty = false) {
 }
 
 
-export function determineStartingTab(tabs = []) {
-    // first with ratings, or simply first if no ratings
-    return _.find(tabs, t => t.ratings.length > 0 ) || tabs[0];
+export function determineStartingTab(tabs = [], lastViewedCategoryId) {
+    // category last viewed or first with ratings, or simply first if no ratings
+    const tabForLastCategoryViewed = _.find(tabs, t => t.category.id === lastViewedCategoryId);
+    const firstTabWithRatings = _.find(tabs, t => t.ratings.length > 0);
+    return tabForLastCategoryViewed || firstTabWithRatings || tabs[0];
 }
 
diff --git a/waltz-ng/client/navbar/components/nav-viewpoints/navbar-viewpoints.html b/waltz-ng/client/navbar/components/nav-viewpoints/navbar-viewpoints.html
@@ -5,7 +5,8 @@
         <a ui-sref="main.measurable-category.list ({id: $ctrl.visibleCategory.id})"
            class="btn-split">
             <waltz-icon size="lg"
-                        name="puzzle-piece">
+                        fixed-width="true"
+                        name="{{$ctrl.visibleCategory.icon}}">
             </waltz-icon>
             <span class="navbar-title"
                   ng-bind="$ctrl.visibleCategory.name"></span>