Do not overwrite existing types

* previous versions of d3.HierarchyNode did not have a type definition for
  x and y at all.
* we added a type definition for the type and defined x and y as
  `number`. This worked because the new and old type definitions were
  compatible.
* type library got an update ans also added the type for x and y, but
  they added `number | undefined` as type
* typescript now found two different type definitions for the same
  attribute, and threw an error:
  `TS2687: All declarations of 'x' must have identical modifiers.`

We now declare a new local type definition and cast the official
d3.HierarchyNode to our extended, internal one at some critical places.

CMK-17220

Change-Id: Ifd569a87d8f569a755e5373b2d29460ee75e9090

Author: BenediktSeidl

packages/cmk-frontend/package-lock.json

@@ -60,7 +60,6 @@
     "@types/d3-flextree": "^2.1.1",
     "@types/d3-hexbin": "^0.2.3",
     "@types/d3-sankey": "^0.12.1",
-    "@types/d3-hierarchy": "=3.1.6",
     "@types/dc": "^4.2.1",
     "@types/jquery": "^3.5.13",
     "@types/lodash": "^4.14.191",

packages/cmk-frontend/package.json

@@ -474,7 +474,7 @@ export class LayoutStyleExampleGenerator {
 
         _add_hierarchy_children(hierarchy_raw, cancel_delta, 1);
 
-        const hierarchy = d3.hierarchy<NodeData>(hierarchy_raw);
+        const hierarchy = d3.hierarchy<NodeData>(hierarchy_raw) as NodevisNode;
         hierarchy.descendants().forEach(node => {
             node.x = 50;
             node.y = 50;

packages/cmk-frontend/src/js/modules/nodevis/example_generator.ts

@@ -320,18 +320,15 @@ export interface ContextMenuElement {
     children?: ContextMenuElement[];
 }
 
-declare module "d3" {
-    export interface HierarchyNode<Datum> {
-        data: Datum;
-        _children?: this[] | undefined | null;
-        x: number;
-        y: number;
-        fx: number | null;
-        fy: number | null;
-        force?: number;
-        use_transition?: boolean;
-        children_backup?: this[];
-    }
+export interface NodeVisHierarchyNode<Datum> extends HierarchyNode<Datum> {
+    _children?: this[] | undefined | null;
+    x: number; // can also be undefined in original type definition
+    y: number; // can also be undefined in original type definition
+    fx: number | null;
+    fy: number | null;
+    force?: number;
+    use_transition?: boolean;
+    children_backup?: this[];
 }
 
 // TODO: add class
@@ -343,9 +340,9 @@ export interface LayoutSettings {
 }
 
 export class NodeConfig {
-    hierarchy: d3.HierarchyNode<NodeData>;
+    hierarchy: NodeVisHierarchyNode<NodeData>;
     link_info: NodevisLink[];
-    nodes_by_id: Record<string, d3.HierarchyNode<NodeData>>;
+    nodes_by_id: Record<string, NodeVisHierarchyNode<NodeData>>;
     constructor(serialized_node_config: SerializedNodeConfig) {
         this.hierarchy = this._create_hierarchy(serialized_node_config);
         this.nodes_by_id = this._create_nodes_by_id_lookup(this.hierarchy);
@@ -364,10 +361,10 @@ export class NodeConfig {
 
     _create_hierarchy(
         serialized_node_config: SerializedNodeConfig
-    ): d3.HierarchyNode<NodeData> {
+    ): NodeVisHierarchyNode<NodeData> {
         const hierarchy = d3.hierarchy<NodeData>(
             serialized_node_config.hierarchy
-        );
+        ) as NodeVisHierarchyNode<NodeData>;
         // Initialize default info of each node
         hierarchy.descendants().forEach(node => {
             node._children = node.children;
@@ -379,8 +376,8 @@ export class NodeConfig {
         return hierarchy;
     }
 
-    _create_nodes_by_id_lookup(hierarchy: d3.HierarchyNode<NodeData>) {
-        const nodes_by_id: Record<string, d3.HierarchyNode<NodeData>> = {};
+    _create_nodes_by_id_lookup(hierarchy: NodeVisHierarchyNode<NodeData>) {
+        const nodes_by_id: Record<string, NodeVisHierarchyNode<NodeData>> = {};
         hierarchy.descendants().forEach(node => {
             nodes_by_id[node.data.id] = node;
         });
@@ -396,8 +393,8 @@ export class NodeConfig {
             link_info.forEach(link => {
                 // Reference by id:string
                 links.push({
-                    source: this.nodes_by_id[link.source],
-                    target: this.nodes_by_id[link.target],
+                    source: this.nodes_by_id[link.source] as NodevisNode,
+                    target: this.nodes_by_id[link.target] as NodevisNode,
                     config: link.config,
                 });
             });
@@ -409,13 +406,13 @@ export class NodeConfig {
         this.hierarchy.descendants().forEach(node => {
             if (!node.parent || node.data.invisible) return;
             links.push({
-                source: node,
-                target: node.parent,
+                source: node as NodevisNode,
+                target: node.parent as NodevisNode,
                 config: {type: "default"},
             });
         });
         return links;
     }
 }
 
-export type NodevisNode = HierarchyNode<NodeData>;
+export type NodevisNode = NodeVisHierarchyNode<NodeData>;