Upgrade helix-front to Angular 11.2 (#2130)

Fix security vulnerabilities in helix-front dependencies.
Upgrade helix-front dependencies to improve contributor productivity.
diff --git a/helix-front/angular.json b/helix-front/angular.json
index b16e896..adc7e35 100644
--- a/helix-front/angular.json
+++ b/helix-front/angular.json
@@ -38,7 +38,6 @@
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
-              "extractCss": true,
               "namedChunks": false,
               "aot": true,
               "extractLicenses": true,
diff --git a/helix-front/client/app/app-routing.module.ts b/helix-front/client/app/app-routing.module.ts
index 7cb10c8..b087fbf 100644
--- a/helix-front/client/app/app-routing.module.ts
+++ b/helix-front/client/app/app-routing.module.ts
@@ -145,4 +145,4 @@
   }
 ];
 
-export const AppRoutingModule: ModuleWithProviders<RouterModule> = RouterModule.forRoot(HELIX_ROUTES);
+export const AppRoutingModule: ModuleWithProviders<RouterModule> = RouterModule.forRoot(HELIX_ROUTES, { relativeLinkResolution: 'legacy' });
diff --git a/helix-front/client/app/resource/shared/resource.model.ts b/helix-front/client/app/resource/shared/resource.model.ts
index 4591346..3b682c2 100644
--- a/helix-front/client/app/resource/shared/resource.model.ts
+++ b/helix-front/client/app/resource/shared/resource.model.ts
@@ -39,6 +39,8 @@
   readonly idealState: any;
   readonly externalView: any;
 
+  readonly partitions: Partition[];
+
   get enabled(): boolean {
     // there are two cases meaning enabled both:
     //   HELIX_ENABLED: true or no such item in idealState
@@ -49,8 +51,6 @@
      return !_.isEmpty(this.externalView);
   }
 
-  readonly partitions: Partition[];
-
   constructor(cluster: string, name: string, config: any, idealState: any, externalView: any) {
     this.cluster = cluster;
     this.name = name;
diff --git a/helix-front/client/app/shared/input-inline/input-inline.component.ts b/helix-front/client/app/shared/input-inline/input-inline.component.ts
index e2ef25f..211077e 100644
--- a/helix-front/client/app/shared/input-inline/input-inline.component.ts
+++ b/helix-front/client/app/shared/input-inline/input-inline.component.ts
@@ -7,16 +7,6 @@
   styleUrls: ['./input-inline.component.scss']
 })
 export class InputInlineComponent implements ControlValueAccessor, OnInit {
-  @Input()
-  get value(): any {
-    return this._value;
-  }
-  set value(v: any) {
-    if (v !== this._value) {
-      this._value = v;
-      this.onChange(v);
-    }
-  }
 ;
 
   @ViewChild('inputControl', {static: true}) inputControl: ElementRef;
@@ -44,6 +34,16 @@
   // Required forControlValueAccessor interface
   public onChange: any = Function.prototype;
   public onTouched: any = Function.prototype;
+  @Input()
+  get value(): any {
+    return this._value;
+  }
+  set value(v: any) {
+    if (v !== this._value) {
+      this._value = v;
+      this.onChange(v);
+    }
+  }
   @Input() focus: Function = _ => { };
   @Input() blur: Function = _ => { };
   public registerOnChange(fn: (_: any) => {}): void { this.onChange = fn; }
diff --git a/helix-front/client/app/shared/node-viewer/node-viewer.component.ts b/helix-front/client/app/shared/node-viewer/node-viewer.component.ts
index 4abb7a0..05c829f 100644
--- a/helix-front/client/app/shared/node-viewer/node-viewer.component.ts
+++ b/helix-front/client/app/shared/node-viewer/node-viewer.component.ts
@@ -32,18 +32,6 @@
   @Output('delete')
   delete: EventEmitter<Node> = new EventEmitter<Node>();
 
-  // MODE 1: use directly in components
-  @Input()
-  set obj(value: any) {
-    if (value != null) {
-      this._obj = value;
-      this.node = new Node(value);
-    }
-  }
-  get obj(): any {
-    return this._obj;
-  }
-
   @Input()
   unlockable = false;
 
@@ -51,14 +39,6 @@
   loadingIndicator = false;
 
   private _editable = false;
-  set editable(value: boolean) {
-    this._editable = value;
-    this.columns.simpleConfigs[1].editable = this._editable;
-    this.columns.listConfigs[0].editable = this._editable;
-  }
-  get editable() {
-    return this._editable;
-  }
 
   protected _obj: any;
   protected node: Node;
@@ -89,14 +69,36 @@
   };
 
   _simpleConfigs: any[];
+
+  _listConfigs: any[];
+
+  _mapConfigs: any[];
+
+  // MODE 1: use directly in components
+  @Input()
+  set obj(value: any) {
+    if (value != null) {
+      this._obj = value;
+      this.node = new Node(value);
+    }
+  }
+  get obj(): any {
+    return this._obj;
+  }
+  set editable(value: boolean) {
+    this._editable = value;
+    this.columns.simpleConfigs[1].editable = this._editable;
+    this.columns.listConfigs[0].editable = this._editable;
+  }
+  get editable() {
+    return this._editable;
+  }
   get simpleConfigs(): any[] {
     return this.node ? _.filter(this.node.simpleFields, config => {
       return config.name.toLowerCase().indexOf(this.keyword) >= 0
         || config.value.toLowerCase().indexOf(this.keyword) >= 0;
     }) : [];
   }
-
-  _listConfigs: any[];
   get listConfigs(): any[] {
     return this.node ?  _.filter(this.node.listFields, config => {
       return config.name.toLowerCase().indexOf(this.keyword) >= 0
@@ -105,8 +107,6 @@
         });
     }) : [];
   }
-
-  _mapConfigs: any[];
   get mapConfigs(): any[] {
     return this.node ?  _.filter(this.node.mapFields, config => {
       return config.name.toLowerCase().indexOf(this.keyword) >= 0
diff --git a/helix-front/package.json b/helix-front/package.json
index 14b0723..6547e81 100644
--- a/helix-front/package.json
+++ b/helix-front/package.json
@@ -31,22 +31,22 @@
     "npm": "6.14.11"
   },
   "dependencies": {
-    "@angular/animations": "10.2.5",
-    "@angular/cdk": "10.2.7",
-    "@angular/common": "10.2.5",
-    "@angular/compiler": "10.2.5",
-    "@angular/core": "10.2.5",
-    "@angular/flex-layout": "^10.0.0-beta.32",
-    "@angular/forms": "10.2.5",
-    "@angular/material": "^10.2.7",
-    "@angular/platform-browser": "10.2.5",
-    "@angular/platform-browser-dynamic": "10.2.5",
-    "@angular/platform-server": "10.2.5",
-    "@angular/router": "10.2.5",
+    "@angular/animations": "11.2.14",
+    "@angular/cdk": "11.2.13",
+    "@angular/common": "11.2.14",
+    "@angular/compiler": "11.2.14",
+    "@angular/core": "11.2.14",
+    "@angular/flex-layout": "^11.0.0-beta.33",
+    "@angular/forms": "11.2.14",
+    "@angular/material": "^11.2.13",
+    "@angular/platform-browser": "11.2.14",
+    "@angular/platform-browser-dynamic": "11.2.14",
+    "@angular/platform-server": "11.2.14",
+    "@angular/router": "11.2.14",
     "@egjs/hammerjs": "^2.0.17",
     "@swimlane/ngx-charts": "^16.0.0",
-    "@swimlane/ngx-datatable": "^18.0.0",
-    "@swimlane/ngx-graph": "^7.2.0",
+    "@swimlane/ngx-datatable": "^19.0.0",
+    "@swimlane/ngx-graph": "^8.0.0-rc.2",
     "ajv": "^6.9.1",
     "angulartics2": "^10.1.0",
     "body-parser": "^1.17.2",
@@ -65,9 +65,10 @@
     "ngx-json-viewer": "^2.3.0",
     "ngx-vis": "^3.1.0",
     "request": "^2.81.0",
-    "rxjs": "^6.5.5",
+    "rxjs": "^6.6.3",
     "rxjs-compat": "^6.0.0-rc.0",
     "sass": "^1.51.0",
+    "timsort": "^0.3.0",
     "tsickle": "github:angular/tsickle#fdf6e86717648f1b9603752cb83486fa6dcac38f",
     "tslib": "^2.0.0",
     "uuid": "^7.0.3",
@@ -78,19 +79,19 @@
     "zone.js": "~0.10.2"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.1002.4",
-    "@angular/cli": "10.2.4",
-    "@angular/compiler-cli": "10.2.5",
+    "@angular-devkit/build-angular": "~0.1102.19",
+    "@angular/cli": "11.2.19",
+    "@angular/compiler-cli": "11.2.14",
     "@types/hammerjs": "^2.0.34",
-    "@types/jasmine": "2.5.38",
+    "@types/jasmine": "~3.6.0",
     "@types/lodash": "4.14.120",
     "@types/node": "^12.11.1",
     "@types/request": "^2.0.0",
-    "codelyzer": "^6.0.2",
+    "codelyzer": "^6.0.0",
     "concurrently": "^3.5.0",
     "jasmine-core": "^3.8.0",
     "jasmine-spec-reporter": "~5.0.0",
-    "karma": "~5.0.0",
+    "karma": "~6.3.20",
     "karma-chrome-launcher": "~3.1.0",
     "karma-cli": "~1.0.1",
     "karma-coverage-istanbul-reporter": "~3.0.2",
@@ -101,7 +102,7 @@
     "protractor": "~7.0.0",
     "rxjs-tslint": "^0.1.8",
     "ts-node": "~2.0.0",
-    "tslint": "^5.20.1",
+    "tslint": "^6.1.3",
     "typescript": "4.0.8"
   }
 }