Data type tree for DT page

waltz-ng/client/common/hierarchy-utils.js

@@ -292,9 +292,8 @@ export function determineExpandedNodes(hierarchy, maxDepth = 100) {
 }
 
 
-
 /**
- * Given a list of flat nodes and a starting node id will return a 'sliver' of the
+ * Given a list of flat nodes and a starting node id will return the direct lineage of the
  * tree with all parents and children of the starting node populated.  All other
  * nodes are omitted.
  *
@@ -325,7 +324,7 @@ export function directLineage(flatNodes,
 
     // recursively populate children
     const recurse = (node) => {
-        const kids = byParentId[idFn(node)];
+        const kids = byParentId[idFn(node)] || [];
         if (kids) {
             node.children = kids;
             _.each(kids, recurse);

waltz-ng/client/data-flow/components/svelte/flow-decorator-utils.js

@@ -11,7 +11,6 @@ const colors = {
     }
 };
 
-
 export function getNodeColors(kind) {
     const c = colors[kind];
 

waltz-ng/client/data-types/components/overview/DataTypeTreeNav.svelte

@@ -0,0 +1,25 @@
+<script>
+    import DataTypeTreeNode from "../../../common/svelte/DataTypeTreeNode.svelte";
+    import SubSection from "../../../common/svelte/SubSection.svelte";
+    import pageInfo from "../../../svelte-stores/page-navigation-store";
+    export let node = null;
+
+    function go(evt) {
+        pageInfo.set({
+            state: "main.data-type.view",
+            params: {id: evt.detail.id}
+        });
+    }
+</script>
+
+<SubSection>
+    <div slot="header">Hierarchy</div>
+    <div slot="content">
+        <DataTypeTreeNode nonConcreteSelectable={true}
+                          isRoot={false}
+                          {node}
+                          childNodes={node.children}
+                          expanded={true}
+                          on:select={go}/>
+    </div>
+</SubSection>

waltz-ng/client/data-types/components/overview/data-type-overview.html

@@ -63,44 +63,17 @@
             </div>
         </div>
 
-        <div class="row no-overflow"
-             ng-if="$ctrl.parents.length > 0 || $ctrl.dataType.children.length > 0"
-             style="padding: 1em">
-            <div class="col-sm-4"
-                 ng-if="$ctrl.parents.length > 0">
-                <h4>Parent dataTypes: </h4>
-                <ul>
-                    <li ng-repeat="parent in $ctrl.parents">
-                        <a ui-sref="main.data-type.view ({id: parent.id })"
-                           ng-bind="parent.name">
-                        </a>
-                        <span ng-if="!$last">&raquo;</span>
-                    </li>
-                </ul>
+        <div class="waltz-sub-section" name="Hierarchy">
+            <waltz-svelte-component component="$ctrl.DataTypeTreeNav"
+                                    node="$ctrl.sliver">
+            </waltz-svelte-component>
 
-                <span class="text-muted small "
-                      ng-bind="$ctrl.parent.description">
-                </span>
-            </div>
-
-            <div ng-if="$ctrl.dataType.children.length > 0"
-                 class="col-sm-8">
-
-                <h4>Child dataTypes</h4>
-                <ul>
-                    <li ng-repeat="child in $ctrl.dataType.children | orderBy:'name'">
-                        <a ui-sref="main.data-type.view ({id: child.id})"
-                           class="clickable"
-                           ng-bind="child.name">
-                        </a>
-                    </li>
-                </ul>
-            </div>
         </div>
+
     </div>
 
     <waltz-no-data ng-if="!$ctrl.dataType">
-                <message>No information for this Data Type</message>
+        <message>No information for this Data Type</message>
     </waltz-no-data>
 
 </div>

waltz-ng/client/data-types/components/overview/data-type-overview.js

@@ -16,23 +16,35 @@
  *
  */
 
-import {getParents} from "../../../common/hierarchy-utils";
+import {directLineage} from "../../../common/hierarchy-utils";
 import {CORE_API} from "../../../common/services/core-api-utils";
 import {mkSelectionOptions} from "../../../common/selector-utils";
-import {hierarchyQueryScope} from '../../../common/services/enums/hierarchy-query-scope';
-import {lifecycleStatus} from '../../../common/services/enums/lifecycle-status';
+import {hierarchyQueryScope} from "../../../common/services/enums/hierarchy-query-scope";
+import {lifecycleStatus} from "../../../common/services/enums/lifecycle-status";
+import DataTypeTreeNav from "./DataTypeTreeNav.svelte";
+import _ from "lodash";
 
 import template from "./data-type-overview.html";
+import {initialiseData} from "../../../common";
 
 
 const bindings = {
     filters: "<",
-    parentEntityRef: "<"
+    parentEntityRef: "<",
+};
+
+
+const initialState = {
+    DataTypeTreeNav,
+    sliver: null,
+    dataType: null,
+    apps: [],
+    usageStats: []
 };
 
 
 function controller(serviceBroker) {
-    const vm = this;
+    const vm = initialiseData(this, initialState);
 
     const loadAll = () => {
         const selector = mkSelectionOptions(
@@ -45,10 +57,9 @@ function controller(serviceBroker) {
             .loadAppData(CORE_API.DataTypeStore.findAll)
             .then(r => {
                 const dataTypes = r.data;
-                const dataTypesById = _.keyBy(dataTypes, "id");
-                const dataType = dataTypesById[vm.parentEntityRef.id];
+                const dataType = _.find(dataTypes, d => d.id === vm.parentEntityRef.id);
                 vm.dataType = dataType;
-                vm.parents = getParents(dataType, n => dataTypesById[n.parentId]);
+                vm.sliver = directLineage(dataTypes, dataType.id);
             });
 
         serviceBroker
@@ -68,7 +79,6 @@ function controller(serviceBroker) {
         loadAll();
     };
 
-
     vm.$onChanges = (changes) => {
         if(changes.filters) {
             loadAll();

waltz-ng/client/measurable/components/overview/measurable-overview.js

@@ -88,7 +88,7 @@ function controller(serviceBroker, $state) {
                             vm.relevantHierarchy = relevantHierarchy;
                             vm.hierarchy = vm.relevantHierarchy;
                             vm.expandedNodes = parents;
-                        })
+                        });
                 }
             });
 

waltz-ng/client/playpen/1/playpen1.html

@@ -28,5 +28,14 @@
     </waltz-page-header>
 
 
+    <div class="row">
+        <div class="col-md-3">
+            <waltz-svelte-component component="$ctrl.DataTypeTreeSelector" selection-filter="$ctrl.filter">
+
+            </waltz-svelte-component>
+        </div>
+    </div>
+
+
 
 </div>

waltz-ng/client/playpen/1/playpen1.js

@@ -20,6 +20,7 @@
 import template from "./playpen1.html";
 import {initialiseData} from "../../common";
 import {CORE_API} from "../../common/services/core-api-utils";
+import {directLineage} from "../../common/hierarchy-utils";
 
 const initData = {
     taxonomy: []
@@ -35,17 +36,21 @@ function controller($q,
 
         serviceBroker
             .loadViewData(
-                CORE_API.DataTypeStore.findAll,
-                //CORE_API.MeasurableStore.findAll,
+                CORE_API.MeasurableStore.findAll,
                 [])
             .then(r => {
-                console.log(r);
-                vm.taxonomy = r.data; // _.filter(r.data, m => m.categoryId === 12);
-                vm.linkStem = "data-types"; // data-types or measurable
+                vm.taxonomy = _.filter(r.data, m => m.categoryId === 6);
+
+                console.log({
+                    taxonomy: vm.taxonomy,
+                    sliver: directLineage(vm.taxonomy, 117)
+                });
             });
 
     }
 
+
+
 }
 
 controller.$inject = ["$q", "ServiceBroker", "UserService"];

waltz-web/src/main/java/org/finos/waltz/web/Main.java

@@ -44,6 +44,7 @@
 import java.util.TimeZone;
 
 import static java.lang.String.format;
+import static org.finos.waltz.web.WebUtilities.reportException;
 import static org.finos.waltz.common.DateTimeUtilities.UTC;
 import static org.finos.waltz.web.WebUtilities.reportException;
 import static spark.Spark.after;