fix: sonar issue fixes and address comments

uiuniversal · Feb 17, 2024 · 1a52656 · 1a52656
1 parent eb71297
commit 1a52656
Show file tree

Hide file tree

Showing 13 changed files with 59 additions and 243 deletions.
diff --git a/projects/flow/src/lib/flow-child.component.ts b/projects/flow/src/lib/flow-child.component.ts
@@ -95,8 +95,6 @@ export class FlowChildComponent implements OnInit, OnChanges, OnDestroy {
     });
 
     this.positionChange.subscribe((x) => {
-      // const { left, top } = this.flow.zRect;
-      // if (!this.position) console.log(this.position);
       this.updatePosition(this.position.x, this.position.y);
     });
   }

diff --git a/projects/flow/src/lib/flow-interface.ts b/projects/flow/src/lib/flow-interface.ts
@@ -1,5 +1,3 @@
-import { FlowComponent } from './flow.component';
-
 export interface ChildInfo {
   position: FlowOptions;
   dots?: DOMRect[];
@@ -25,12 +23,6 @@ export interface DotOptions extends FlowOptions {
   dotIndex: number;
 }
 
-export class FlowConfig {
-  Arrows = true;
-  ArrowSize = 20;
-  Plugins: { [x: string]: FlowPlugin } = {};
-}
-
 export type FlowDirection = 'horizontal' | 'vertical';
 
 export type ArrowPathFn = (
@@ -39,10 +31,3 @@ export type ArrowPathFn = (
   arrowSize: number,
   strokeWidth: number
 ) => string;
-
-export interface FlowPlugin {
-  onInit?(data: FlowComponent): void;
-  afterInit?(data: FlowComponent): void;
-  beforeUpdate?(data: FlowComponent): void;
-  afterUpdate?(data: FlowComponent): void;
-}
diff --git a/projects/flow/src/lib/flow.component.ts b/projects/flow/src/lib/flow.component.ts
@@ -20,12 +20,9 @@ import {
   FlowOptions,
   ChildInfo,
   FlowDirection,
-  DotOptions,
   ArrowPathFn,
-  FlowConfig,
-  FlowPlugin,
 } from './flow-interface';
-import { blendCorners, flowPath, bezierPath, blendCorners1 } from './svg';
+import { FlowConfig, FlowPlugin } from './plugins/plugin';
 
 const BASE_SCALE_AMOUNT = 0.05;
 

diff --git a/projects/flow/src/lib/flow.service.ts b/projects/flow/src/lib/flow.service.ts
@@ -1,12 +1,8 @@
 import { Injectable, NgZone } from '@angular/core';
 import { BehaviorSubject, Subject } from 'rxjs';
-import {
-  ArrowPathFn,
-  FlowConfig,
-  FlowDirection,
-  FlowOptions,
-} from './flow-interface';
+import { ArrowPathFn, FlowDirection, FlowOptions } from './flow-interface';
 import { blendCorners } from './svg';
+import { FlowConfig } from './plugins/plugin';
 
 @Injectable()
 export class FlowService {

diff --git a/projects/flow/src/lib/plugins/arrangements.spec.ts b/projects/flow/src/lib/plugins/arrangements.spec.ts
@@ -1,4 +1,4 @@
-import { ArrangementsOld, Arrangements } from './arrangements';
+import { Arrangements } from './arrangements';
 import { ChildInfo } from '../flow-interface';
 import { FlowComponent } from '../flow.component';
 
@@ -14,33 +14,6 @@ export const FLOW_LIST = [
 ];
 
 describe('Arrangements', () => {
-  let arrangements: ArrangementsOld;
-
-  it('should be created', () => {
-    const childObj: ChildInfo[] = FLOW_LIST.map((x) => ({
-      position: x,
-      elRect: { width: 200, height: 200 } as any,
-    }));
-
-    arrangements = new ArrangementsOld(childObj);
-    arrangements.verticalPadding = 20;
-    arrangements.groupPadding = 100;
-    const expected = {
-      '1': { x: 0, y: 370, id: '1', deps: [] },
-      '2': { x: 300, y: 110, id: '2', deps: ['1'] },
-      '3': { x: 600, y: 0, id: '3', deps: ['2'] },
-      '4': { x: 600, y: 220, id: '4', deps: ['2'] },
-      '5': { x: 300, y: 630, id: '5', deps: ['1'] },
-      '6': { x: 600, y: 520, id: '6', deps: ['5'] },
-      '7': { x: 600, y: 740, id: '7', deps: ['5'] },
-      '8': { x: 900, y: 550, id: '8', deps: ['6', '7'] },
-    };
-    const actual = Object.fromEntries(arrangements.autoArrange());
-    expect(actual).toEqual(expected);
-  });
-});
-
-describe('Arrangements2', () => {
   let arrangements: Arrangements;
 
   it('should be created', () => {

diff --git a/projects/flow/src/lib/plugins/arrangements.ts b/projects/flow/src/lib/plugins/arrangements.ts
@@ -1,127 +1,6 @@
-import {
-  FlowOptions,
-  ChildInfo,
-  FlowDirection,
-  FlowPlugin,
-} from '../flow-interface';
+import { FlowOptions, ChildInfo, FlowDirection } from '../flow-interface';
 import { FlowComponent } from '../flow.component';
-
-export class ArrangementsOld {
-  constructor(
-    private list: ChildInfo[],
-    private direction: 'horizontal' | 'vertical' = 'horizontal',
-    public horizontalPadding = 100,
-    public verticalPadding = 20,
-    public groupPadding = 20
-  ) {}
-
-  public autoArrange(): Map<string, FlowOptions> {
-    const newItems = new Map<string, FlowOptions>();
-    let currentX = 0;
-    let currentY = 0;
-
-    // Handle both horizontal and vertical directions
-    const baseNodes = this.list.filter(
-      (node) => node.position.deps.length === 0
-    );
-
-    for (const baseNode of baseNodes) {
-      if (this.direction === 'horizontal') {
-        this.positionDependents(baseNode, 0, currentY, newItems);
-        currentY += baseNode.elRect.height + this.verticalPadding;
-      } else {
-        // Vertical arrangement
-        this.positionDependents(baseNode, 0, currentX, newItems);
-        currentX += baseNode.elRect.width + this.verticalPadding;
-      }
-    }
-
-    return newItems;
-  }
-
-  private positionDependents(
-    baseNode: ChildInfo,
-    baseX: number,
-    baseY: number,
-    newItems: Map<string, FlowOptions>,
-    config: { first: boolean; gp: number; maxDepLength: number } = {
-      first: true,
-      gp: -this.groupPadding * 2,
-      maxDepLength: 0,
-    }
-  ): { consumedSpace: number; dep: boolean } {
-    const dependents = this.list.filter((child) =>
-      child.position.deps.includes(baseNode.position.id)
-    );
-
-    const isV = this.direction === 'vertical';
-
-    let startY = baseY;
-    const { width: w, height: h } = baseNode.elRect;
-    let newX = baseX + (isV ? h : w) + this.horizontalPadding;
-    const height = isV ? w : h;
-
-    const childC: { first: boolean; gp: number; maxDepLength: number } = {
-      first: true,
-      gp: 0,
-      maxDepLength: 0,
-    };
-    for (let i = 0; i < dependents.length; i++) {
-      const depLast = i === dependents.length - 1;
-      childC.first = i === 0;
-      const dependent = dependents[i];
-      const { consumedSpace, dep } = this.positionDependents(
-        dependent,
-        newX,
-        startY,
-        newItems,
-        childC
-      );
-
-      startY = 0;
-
-      if (childC.maxDepLength > 1 && dep && !depLast) {
-        startY += this.groupPadding;
-        config.gp += this.groupPadding;
-      }
-      startY += consumedSpace + (!depLast ? this.verticalPadding : 0);
-    }
-
-    // baseY += childC.gp;
-    config.maxDepLength = Math.max(config.maxDepLength, childC.maxDepLength);
-
-    let y = 0;
-    if (dependents.length > 1) {
-      // find the first and last dependent and there y position
-      const firstDepId = dependents[0].position.id;
-      const lastDepId = dependents[dependents.length - 1].position.id;
-      const firstDep = newItems.get(firstDepId)!;
-      const lastDep = newItems.get(lastDepId)!;
-      // find the center of the first and last dependent
-      y = (isV ? firstDep.x + lastDep.x : firstDep.y + lastDep.y) / 2;
-    } else {
-      y = baseY + (dependents.length ? (startY - baseY) / 2 - height / 2 : 0);
-
-      // TODO: This is not working as expected
-      // If there are more than one dependency, We need to center the node based on the parents
-      if (baseNode.position.deps.length > 1) {
-        const len = baseNode.position.deps.length / 2;
-        const halfVerticalPadding = (this.verticalPadding * len) / 2;
-        y -= baseNode.elRect.height * len - halfVerticalPadding;
-      }
-    }
-    newItems.set(baseNode.position.id, {
-      ...baseNode.position,
-      x: isV ? y : baseX,
-      y: isV ? baseX : y,
-    });
-    // add groupPadding if there are more than one dependency
-    const groupPad =
-      dependents.length > 1 ? this.groupPadding - this.verticalPadding : 0;
-    const consumedSpace = startY + (dependents.length ? 0 : height) + groupPad;
-    return { consumedSpace, dep: dependents.length > 0 };
-  }
-}
+import { FlowPlugin } from './plugin';
 
 const ROOT_DATA = new Map<string, ArrangeNode>();
 const ROOT_DEPS = new Map<string, string[]>();
@@ -137,8 +16,6 @@ export class Arrangements implements FlowPlugin {
   public verticalPadding = 20;
   public groupPadding = 20;
 
-  constructor() {}
-
   onInit(data: FlowComponent): void {
     this.data = data;
   }
@@ -213,7 +90,7 @@ export class ArrangeNode {
 
   // we need to recursively call this method to get all the dependents of the node
   // and then we need to position them
-  arrange(x = 0, y = 0, direction: FlowDirection): Coordinates {
+  arrange(x: number, y: number, direction: FlowDirection): Coordinates {
     const dependents = ROOT_DEPS.get(this.position.id) || [];
     let startX = x;
     let startY = y;
@@ -225,7 +102,8 @@ export class ArrangeNode {
       } else {
         startY += this.elRect.height + HORIZONTAL_PADDING;
       }
-      let first, last: Coordinates;
+      let first: Coordinates = { x: 0, y: 0 };
+      let last: Coordinates = { x: 0, y: 0 };
       for (let i = 0; i < len; i++) {
         const dep = dependents[i];
         const dependent = ROOT_DATA.get(dep)!;
@@ -242,10 +120,10 @@ export class ArrangeNode {
       }
       if (direction === 'horizontal') {
         startY -= VERTICAL_PADDING + this.elRect.height;
-        y = first!.y + (last!.y - first!.y) / 2;
+        y = first.y + (last.y - first.y) / 2;
       } else {
         startX -= VERTICAL_PADDING + this.elRect.width;
-        x = first!.x + (last!.x - first!.x) / 2;
+        x = first.x + (last.x - first.x) / 2;
       }
     }
     this.position.x = x;

diff --git a/projects/flow/src/lib/plugins/connections.spec.ts b/projects/flow/src/lib/plugins/connections.spec.ts
@@ -15,7 +15,8 @@ describe('Connections', () => {
     ];
 
     check(list, [1, 3]);
-    check(list.reverse(), [3, 1]);
+    list.reverse();
+    check(list, [3, 1]);
 
     list = [
       t({ x: 300, y: -150, id: '2', deps: ['1'] }),
@@ -50,31 +51,20 @@ describe('Connections', () => {
     ];
 
     check(list, 0, '2', [1, 3]);
-    // connections = new Connections(list);
-    // let actual = connections.getClosestDotsSimplified(list[0], '2');
-    // expect(actual).toEqual([1, 3]);
     check(list, 1, '1', [3, 1]);
-    // actual = connections.getClosestDotsSimplified(list[1], '1');
-    // expect(actual).toEqual([3, 1]);
 
     list = [
       t({ x: 40, y: 40, id: '1', deps: [] }),
       t({ x: 173.203125, y: -33, id: '2', deps: ['1'] }),
     ];
     check(list, 0, '2', [1, 3]);
-    // connections = new Connections(list);
-    // actual = connections.getClosestDotsSimplified(list[0], '2');
-    // expect(actual).toEqual([1, 3]);
 
     list = [
       t({ x: 40, y: 40, id: '1', deps: [] }),
       t({ x: 142.203125, y: -33, id: '2', deps: ['1'] }),
     ];
     check(list, 0, '2', [1, 3]);
 
-    // actual = connections.getClosestDotsSimplified(list[0], '2');
-    // expect(actual).toEqual([1, 3]);
-
     function check(
       list: ChildInfo[],
       index: number,