Upgrade to Angular 17 (#60)

* Upgrade to Java 21 and Spring Boot 3 * Update doc * angular 12 * material 12 * angular 13 * material 13 * angular 14 * material 14 * angular 15 * material 15 * update ts * Move to ktd * Remove fx * Angular 16 * material 16 * core 17 * core 17 * Fix test * Fix display and build * Fix CI and update readme * Fix 403
michelin · Jan 15, 2024 · 9951a58 · 9951a58
1 parent 5d90515
commit 9951a58
Show file tree

Hide file tree

Showing 76 changed files with 599 additions and 817 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -0,0 +1,51 @@
+{
+  "root": true,
+  "ignorePatterns": [],
+  "overrides": [
+    {
+      "files": [
+        "*.ts"
+      ],
+      "plugins": [
+        "deprecation"
+      ],
+      "parserOptions": {
+        "project": [
+          "tsconfig.json"
+        ],
+        "createDefaultProgram": true
+      },
+      "extends": [
+        "plugin:@angular-eslint/recommended",
+        "plugin:@angular-eslint/template/process-inline-templates"
+      ],
+      "rules": {
+        "@angular-eslint/component-selector": [
+          "error",
+          {
+            "prefix": "suricate",
+            "style": "kebab-case",
+            "type": "element"
+          }
+        ],
+        "@angular-eslint/directive-selector": [
+          "error",
+          {
+            "style": "camelCase",
+            "type": "attribute"
+          }
+        ],
+        "deprecation/deprecation": "warn"
+      }
+    },
+    {
+      "files": [
+        "*.html"
+      ],
+      "extends": [
+        "plugin:@angular-eslint/template/recommended"
+      ],
+      "rules": {}
+    }
+  ]
+}
diff --git a/.github/workflows/continuous_integration.yml b/.github/workflows/continuous_integration.yml
@@ -52,18 +52,18 @@ jobs:
         with:
           fetch-depth: 0
 
-      - name: Set up NodeJS 12.x
+      - name: Set up NodeJS 20.x
         uses: actions/setup-node@v4
         with:
-          node-version: '12.x'
+          node-version: '20.x'
 
       - name: Build with NPM
         run: |
           npm install --no-progress
-          npm run build -- --prod
+          npm run build -- --configuration production
 
-      - name: Lint with NPM
+      - name: Lint
         run: npm run lint
 
-      - name: Test with NPM
-        run: npm run test-headless-no-sandbox -- --watch=false --progress=false --code-coverage
+      - name: Test
+        run: npm run test-ci
diff --git a/.github/workflows/pull_request.yml b/.github/workflows/pull_request.yml
@@ -52,18 +52,18 @@ jobs:
         with:
           fetch-depth: 0
 
-      - name: Set up NodeJS 12.x
+      - name: Set up NodeJS 20.x
         uses: actions/setup-node@v4
         with:
-          node-version: '12.x'
+          node-version: '20.x'
 
       - name: Build
         run: |
           npm install --no-progress
-          npm run build -- --prod
+          npm run build -- --configuration production
 
       - name: Lint
         run: npm run lint
 
       - name: Test
-        run: npm run test-headless-no-sandbox -- --watch=false --progress=false --code-coverage
+        run: npm run test-ci
diff --git a/.github/workflows/tag.yml b/.github/workflows/tag.yml
@@ -25,10 +25,10 @@ jobs:
           distribution: 'temurin'
           cache: maven
 
-      - name: Set up NodeJS 12.x
+      - name: Set up NodeJS 20.x
         uses: actions/setup-node@v4
         with:
-          node-version: '12.x'
+          node-version: '20.x'
 
       - name: Import GPG key
         uses: crazy-max/ghaction-import-gpg@v6

diff --git a/.gitignore b/.gitignore
@@ -1,4 +1,5 @@
-.idea
+/.angular/cache
+.idea
 target
 *.iml
 node_modules

diff --git a/.huskyrc b/.huskyrc
@@ -1,6 +1,5 @@
 {
   "hooks": {
-    "pre-commit": "run-s prettyformat",
-    "pre-push": "run-s lint"
+    "pre-commit": "npx pretty-quick --staged"
   }
-}
+}
diff --git a/.prettierrc b/.prettierrc
@@ -1,9 +1,12 @@
 {
+  "arrowParens": "always",
+  "bracketSpacing": true,
+  "endOfLine": "auto",
   "printWidth": 140,
+  "quoteProps": "consistent",
+  "semi": true,
   "singleQuote": true,
-  "useTabs": false,
   "tabWidth": 2,
-  "semi": true,
-  "bracketSpacing": true,
-  "jsxBracketSameLine": true
+  "trailingComma": "none",
+  "useTabs": false
 }
diff --git a/.readme/dashboard.png b/.readme/dashboard.png
diff --git a/README.md b/README.md
@@ -1,5 +1,9 @@
 # Suricate Widget Tester
 
+<div align="center">
+  <img src="src/main/webapp/assets/images/logo.png" height="100"  alt="suricate logo"/>
+</div>
+
 [![GitHub Build](https://img.shields.io/github/actions/workflow/status/michelin/suricate-widget-tester/continuous_integration.yml?branch=master&logo=github&style=for-the-badge)](https://img.shields.io/github/actions/workflow/status/michelin/suricate-widget-tester/continuous_integration.yml)
 [![GitHub release](https://img.shields.io/github/v/release/michelin/suricate-widget-tester?logo=github&style=for-the-badge)](https://github.com/michelin/suricate-widget-tester/releases)
 [![GitHub commits since latest release (by SemVer)](https://img.shields.io/github/commits-since/michelin/suricate-widget-tester/latest?logo=github&style=for-the-badge)](https://github.com/michelin/suricate-widget-tester/commits/master)
@@ -11,7 +15,7 @@
 
 This repository contains the source code of the Suricate Widget Tester application.
 
-![Suricate widget tester](src/main/webapp/assets/images/widget-tester.png)
+![Suricate widget tester](.readme/dashboard.png)
 
 ## Table of Contents
 

diff --git a/angular.json b/angular.json
@@ -3,39 +3,45 @@
   "version": 1,
   "newProjectRoot": "projects",
   "projects": {
-    "widget-tester-front": {
+    "widget-tester-frontend": {
       "projectType": "application",
-      "schematics": {
-        "@schematics/angular:component": {
-          "style": "scss"
-        },
-        "@schematics/angular:application": {
-          "strict": true
-        }
-      },
       "root": "src/main/webapp",
       "sourceRoot": "src/main/webapp",
-      "prefix": "app",
       "architect": {
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
             "outputPath": "target/dist/public",
             "index": "src/main/webapp/index.html",
             "main": "src/main/webapp/main.ts",
-            "polyfills": "src/main/webapp/polyfills.ts",
             "tsConfig": "src/main/webapp/tsconfig.app.json",
-            "aot": false,
-            "assets": ["src/main/webapp/assets"],
+            "polyfills": [
+              "zone.js",
+              "src/main/webapp/polyfills.ts"
+            ],
+            "assets": [
+              "src/main/webapp/assets"
+            ],
             "stylePreprocessorOptions": {
               "includePaths": [
                 "node_modules/normalize-scss/sass",
-                "node_modules/material-design-icons-iconfont/src",
                 "node_modules/@fortawesome/fontawesome-free/scss"
               ]
             },
-            "styles": ["src/main/webapp/sass/styles.scss"],
-            "scripts": ["node_modules/jquery/dist/jquery.min.js", "node_modules/moment/min/moment-with-locales.min.js"]
+            "styles": [
+              "src/main/webapp/sass/styles.scss"
+            ],
+            "scripts": [
+              "node_modules/jquery/dist/jquery.min.js",
+              "node_modules/moment/min/moment-with-locales.min.js"
+            ],
+            "optimization": false,
+            "sourceMap": true,
+            "namedChunks": false,
+            "aot": true,
+            "extractLicenses": false,
+            "vendorChunk": true,
+            "buildOptimizer": true
           },
           "configurations": {
             "production": {
@@ -45,80 +51,105 @@
                   "with": "src/main/webapp/environments/environment.prod.ts"
                 }
               ],
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "4mb",
+                  "maximumError": "4mb"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "6kb",
+                  "maximumError": "8kb"
+                }
+              ],
               "optimization": true,
               "outputHashing": "all",
-              "sourceMap": false,
+              "sourceMap": true,
               "namedChunks": false,
               "aot": true,
               "extractLicenses": true,
-              "vendorChunk": false,
-              "buildOptimizer": true,
-              "budgets": [
-                {
-                  "type": "anyComponentStyle",
-                  "maximumWarning": "6kb"
-                }
-              ]
+              "vendorChunk": true,
+              "buildOptimizer": true
             }
-          }
+          },
+          "defaultConfiguration": ""
         },
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
           "options": {
-            "browserTarget": "widget-tester-front:build"
+            "buildTarget": "widget-tester-frontend:build"
           },
           "configurations": {
             "production": {
-              "browserTarget": "widget-tester-front:build:production"
+              "buildTarget": "widget-tester-frontend:build:production"
             }
           }
         },
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
           "options": {
-            "browserTarget": "widget-tester-front:build"
+            "buildTarget": "widget-tester-frontend:build"
           }
         },
         "test": {
           "builder": "@angular-devkit/build-angular:karma",
           "options": {
-            "main": "src/main/webapp/test.ts",
-            "polyfills": "src/main/webapp/polyfills.ts",
+            "polyfills": [
+              "zone.js",
+              "zone.js/testing",
+              "src/main/webapp/polyfills.ts"
+            ],
             "tsConfig": "src/main/webapp/tsconfig.spec.json",
-            "karmaConfig": "karma.conf.js",
-            "assets": ["src/main/webapp/assets"],
+            "assets": [
+              "src/main/webapp/assets"
+            ],
             "stylePreprocessorOptions": {
               "includePaths": [
                 "node_modules/normalize-scss/sass",
-                "node_modules/material-design-icons-iconfont/src",
                 "node_modules/@fortawesome/fontawesome-free/scss"
               ]
             },
-            "styles": ["src/main/webapp/sass/styles.scss"],
-            "scripts": ["node_modules/jquery/dist/jquery.min.js", "node_modules/moment/min/moment-with-locales.min.js"]
+            "styles": [
+              "src/main/webapp/sass/styles.scss"
+            ],
+            "scripts": [
+              "node_modules/jquery/dist/jquery.min.js",
+              "node_modules/moment/min/moment-with-locales.min.js"
+            ]
           }
         },
         "lint": {
-          "builder": "@angular-devkit/build-angular:tslint",
-          "options": {
-            "tsConfig": ["src/main/webapp/tsconfig.app.json", "src/main/webapp/tsconfig.spec.json"],
-            "exclude": ["**/node_modules/**"]
-          }
-        },
-        "e2e": {
-          "builder": "@angular-devkit/build-angular:protractor",
+          "builder": "@angular-eslint/builder:lint",
           "options": {
-            "protractorConfig": "protractor.conf.js",
-            "devServerTarget": "widget-tester-front:serve"
-          },
-          "configurations": {
-            "production": {
-              "devServerTarget": "widget-tester-front:serve:production"
-            }
+            "lintFilePatterns": [
+              "src/main/webapp/**/*.ts",
+              "src/main/webapp/**/*.html"
+            ]
           }
         }
       }
     }
   },
-  "defaultProject": "widget-tester-front"
+  "schematics": {
+    "@schematics/angular:component": {
+      "prefix": "suricate",
+      "style": "scss"
+    },
+    "@schematics/angular:application": {
+      "strict": true
+    },
+    "@angular-eslint/schematics:application": {
+      "setParserOptionsProject": true
+    },
+    "@angular-eslint/schematics:library": {
+      "setParserOptionsProject": true
+    }
+  },
+  "cli": {
+    "schematicCollections": [
+      "@angular-eslint/schematics"
+    ],
+    "analytics": false
+  }
 }