Updated to Angular 17 and fixed related issues

Fraunhofer-AISEC · Mar 19, 2024 · 2acb451 · 2acb451
1 parent 19d982f
commit 2acb451
Show file tree

Hide file tree

Showing 12 changed files with 1,972 additions and 2,761 deletions.
diff --git a/ids-webconsole/build.gradle.kts b/ids-webconsole/build.gradle.kts
@@ -88,7 +88,6 @@ node {
     // This is important for a hassle-free build without pre-installed yarn!
     // To disable, pass -PnodeDownload=false to gradle!
     download.set(findProperty("nodeDownload")?.toString()?.toBoolean() ?: true)
-    version.set("16.19.0")
 }
 
 val yarnInstall by tasks.registering(YarnTask::class) {
@@ -98,7 +97,7 @@ val yarnInstall by tasks.registering(YarnTask::class) {
     outputs.cacheIf { true }
 
     workingDir.set(file("src/main/angular"))
-    yarnCommand.set(listOf("install", "--ignore-optional"))
+    yarnCommand.set(listOf("install"))
     onlyIf { !rootProject.hasProperty("skipAngular") }
 }
 

diff --git a/ids-webconsole/src/main/angular/.eslintrc.json b/ids-webconsole/src/main/angular/.eslintrc.json
@@ -13,60 +13,12 @@
         "createDefaultProgram": true
       },
       "extends": [
-        "plugin:@angular-eslint/ng-cli-compat",
-        "plugin:@angular-eslint/ng-cli-compat--formatting-add-on",
+        "plugin:@angular-eslint/recommended",
         "plugin:@angular-eslint/template/process-inline-templates"
       ],
       "rules": {
         "@angular-eslint/component-selector": "off",
-        "@typescript-eslint/array-type": [
-          "error",
-          {
-            "default": "array"
-          }
-        ],
         "@typescript-eslint/member-ordering": "off",
-        "@typescript-eslint/naming-convention": [
-          "error",
-          {
-            "selector": "default",
-            "format": ["camelCase"]
-          },
-          {
-            "selector": "variable",
-            "format": ["camelCase"]
-          },
-          {
-            "selector": "variable",
-            "modifiers": ["const"],
-            "format": ["camelCase", "UPPER_CASE"]
-          },
-          {
-            "selector": "parameter",
-            "format": ["camelCase"],
-            "leadingUnderscore": "allow"
-          },
-          {
-            "selector": "memberLike",
-            "modifiers": ["private"],
-            "format": ["camelCase"],
-            "leadingUnderscore": "allow"
-          },
-          {
-            "selector": "typeLike",
-            "format": ["PascalCase"]
-          },
-          {
-            "selector": "enumMember",
-            "format": ["UPPER_CASE"]
-          },
-          {
-            "selector": "objectLiteralProperty",
-            "format": null
-          }
-        ],
-        "@typescript-eslint/no-empty-function": "error",
-        "@typescript-eslint/no-var-requires": "error",
         "comma-dangle": "error",
         "import/no-unassigned-import": "off",
         "max-classes-per-file": [
@@ -77,16 +29,6 @@
         "no-fallthrough": "off",
         "prefer-template": "off",
         "no-underscore-dangle": "off",
-        "no-unused-vars": [
-          "error",
-          {
-            "vars": "all",
-            "args": "after-used",
-            "ignoreRestSiblings": false,
-            "argsIgnorePattern": "ignored|^_",
-            "varsIgnorePattern": "ignored|^_"
-          }
-        ],
         "no-console": [
           "error", {
             "allow": [""]

diff --git a/ids-webconsole/src/main/angular/angular.json b/ids-webconsole/src/main/angular/angular.json
@@ -21,19 +21,17 @@
               "src/favicon.ico"
             ],
             "styles": [
+              "src/css/bootstrap-reboot.css",
               "src/fonts/fonts.css",
               "node_modules/material-design-lite/material.css",
-              "node_modules/bootstrap/dist/css/bootstrap.min.css",
               "src/css/material.teal-pink.min.css",
               "src/css/styles.css",
-              "src/css/fontawesome/all.css",
-              "node_modules/vis/dist/vis.css"
+              "src/css/fontawesome/all.css"
             ],
             "scripts": [
               "node_modules/viz.js/viz.js",
               "node_modules/viz.js/full.render.js",
-              "node_modules/svg-pan-zoom/dist/svg-pan-zoom.js",
-              "node_modules/vis/dist/vis.js"
+              "node_modules/svg-pan-zoom/dist/svg-pan-zoom.js"
             ],
             "vendorChunk": true,
             "extractLicenses": false,
@@ -70,19 +68,19 @@
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
           "options": {
-            "browserTarget": "trusted-connector-ui:build",
-            "proxyConfig": "proxy.conf.json"
+            "proxyConfig": "proxy.conf.json",
+            "buildTarget": "trusted-connector-ui:build"
           },
           "configurations": {
             "production": {
-              "browserTarget": "trusted-connector-ui:build:production"
+              "buildTarget": "trusted-connector-ui:build:production"
             }
           }
         },
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
           "options": {
-            "browserTarget": "trusted-connector-ui:build"
+            "buildTarget": "trusted-connector-ui:build"
           }
         },
         "lint": {

diff --git a/ids-webconsole/src/main/angular/package.json b/ids-webconsole/src/main/angular/package.json
@@ -8,50 +8,44 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^16.2.12",
-    "@angular/common": "^16.2.12",
-    "@angular/core": "^16.2.12",
-    "@angular/forms": "^16.2.12",
-    "@angular/platform-browser": "^16.2.12",
-    "@angular/platform-browser-dynamic": "^16.2.12",
-    "@angular/platform-server": "^16.2.12",
-    "@angular/router": "^16.2.12",
-    "bootstrap": "^4.2.1",
-    "core-js": "^3.28.0",
-    "deep-equal": "^2.0.1",
-    "jquery": "^3.5.1",
+    "@angular/animations": "^17.3.0",
+    "@angular/common": "^17.3.0",
+    "@angular/core": "^17.3.0",
+    "@angular/forms": "^17.3.0",
+    "@angular/platform-browser": "^17.3.0",
+    "@angular/platform-browser-dynamic": "^17.3.0",
+    "@angular/platform-server": "^17.3.0",
+    "@angular/router": "^17.3.0",
+    "core-js": "^3.36.0",
+    "deep-equal": "^2.2.3",
+    "jquery": "^3.7.1",
     "material-design-lite": "^1.3.0",
-    "ngx-logger": "^5.0.11",
-    "popper.js": "^1.16.1",
-    "rxjs": "^6.5.2",
-    "svg-pan-zoom": "^3.6.0",
-    "topojson": "^3.0.2",
-    "tslib": "^2.0.0",
-    "viz.js": "^2.1.1",
-    "zone.js": "~0.13.3"
+    "ngx-logger": "^5.0.12",
+    "rxjs": "^6.6.7",
+    "svg-pan-zoom": "^3.6.1",
+    "tslib": "^2.6.2",
+    "viz.js": "^2.1.2",
+    "zone.js": "~0.14.4"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^16.2.12",
-    "@angular-eslint/builder": "^15.2.1",
-    "@angular-eslint/eslint-plugin": "^15.2.1",
-    "@angular-eslint/eslint-plugin-template": "^15.2.1",
-    "@angular-eslint/schematics": "16",
-    "@angular-eslint/template-parser": "^15.2.1",
-    "@angular/cli": "^16.2.12",
-    "@angular/compiler": "^16.2.12",
-    "@angular/compiler-cli": "^16.2.12",
-    "@types/express": "^4.17.17",
-    "@types/node": "^18.14.0",
-    "@types/vis": "^4.21.9",
-    "@typescript-eslint/eslint-plugin": "^5.53.0",
-    "@typescript-eslint/parser": "^5.53.0",
-    "@typescript-eslint/typescript-estree": "^5.53.0",
-    "eslint": "^8.34.0",
-    "eslint-plugin-import": "^2.23.4",
-    "eslint-plugin-jsdoc": "^40.0.0",
-    "eslint-plugin-prefer-arrow": "latest",
-    "typescript": "4.9.5",
-    "vis": "^4.20.0"
+    "@angular-devkit/build-angular": "^17.3.0",
+    "@angular-eslint/builder": "^17.3.0",
+    "@angular-eslint/eslint-plugin": "^17.3.0",
+    "@angular-eslint/eslint-plugin-template": "^17.3.0",
+    "@angular-eslint/schematics": "^17.3.0",
+    "@angular-eslint/template-parser": "^17.3.0",
+    "@angular/cli": "^17.3.0",
+    "@angular/compiler": "^17.3.0",
+    "@angular/compiler-cli": "^17.3.0",
+    "@types/node": "^18.19.24",
+    "@typescript-eslint/eslint-plugin": "^5.62.0",
+    "@typescript-eslint/parser": "^5.62.0",
+    "@typescript-eslint/typescript-estree": "^5.62.0",
+    "eslint": "^8.57.0",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-jsdoc": "^40.3.0",
+    "eslint-plugin-prefer-arrow": "^1.2.3",
+    "typescript": "^5.4.2"
   },
   "packageManager": "[email protected]"
 }
diff --git a/ids-webconsole/src/main/angular/src/app/_interceptors/jwt.interceptor.ts b/ids-webconsole/src/main/angular/src/app/_interceptors/jwt.interceptor.ts
@@ -15,7 +15,6 @@ export class JwtInterceptor implements HttpInterceptor {
         if (currentUser) {
             request = request.clone({
                 setHeaders: {
-                    /* eslint-disable @typescript-eslint/naming-convention */
                     Authorization: `Bearer ${currentUser}`
                 }
             });

diff --git a/ids-webconsole/src/main/angular/src/app/app.module.ts b/ids-webconsole/src/main/angular/src/app/app.module.ts
@@ -65,8 +65,6 @@ import { ESTService } from './keycerts/est-service';
         LoggerModule.forRoot({
             level: NgxLoggerLevel.DEBUG
         })
-//    ModalModule.forRoot(),
-//    BootstrapModalModule
     ],
     declarations: [
         AppComponent,

diff --git a/ids-webconsole/src/main/angular/src/app/apps/cml.ts b/ids-webconsole/src/main/angular/src/app/apps/cml.ts
@@ -1,4 +1,3 @@
 export class Cml {
-  // eslint-disable-next-line @typescript-eslint/naming-convention, no-underscore-dangle, id-blacklist, id-match
   public cml_version: string;
 }
diff --git a/ids-webconsole/src/main/angular/src/app/routes/zoom-viz/zoom-viz.component.ts b/ids-webconsole/src/main/angular/src/app/routes/zoom-viz/zoom-viz.component.ts
@@ -3,7 +3,6 @@ import { from, Subject } from 'rxjs';
 import { switchMap } from 'rxjs/operators';
 import 'svg-pan-zoom';
 
-/* eslint-disable @typescript-eslint/naming-convention */
 declare const Viz: any;
 
 @Component({