Angular 13 -> 16 + prettier + remove primeng

.eslintrc.json

@@ -15,8 +15,11 @@
         "createDefaultProgram": true
       },
       "extends": [
+        "eslint:recommended",
+        "plugin:@typescript-eslint/recommended",
         "plugin:@angular-eslint/recommended",
-        "plugin:@angular-eslint/template/process-inline-templates"
+        "plugin:@angular-eslint/template/process-inline-templates",
+        "plugin:prettier/recommended"
       ],
       "rules": {
         "@angular-eslint/directive-selector": [
@@ -34,15 +37,19 @@
             "prefix": "arig",
             "style": "kebab-case"
           }
-        ]
+        ],
+        "@typescript-eslint/no-explicit-any": "off",
+        "@typescript-eslint/no-unused-vars": "off",
+        "@typescript-eslint/ban-ts-comment": "off"
       }
     },
     {
       "files": [
         "*.html"
       ],
       "extends": [
-        "plugin:@angular-eslint/template/recommended"
+        "plugin:@angular-eslint/template/recommended",
+        "plugin:prettier/recommended"
       ],
       "rules": {}
     }

.prettierrc

@@ -0,0 +1,14 @@
+{
+    "tabWidth": 4,
+    "singleQuote": true,
+    "printWidth": 120,
+    "quoteProps": "consistent",
+    "overrides": [
+        {
+            "files": "*.html",
+            "options": {
+                "parser": "angular"
+            }
+        }
+    ]
+}

angular.json

@@ -33,6 +33,11 @@
             "allowedCommonJsDependencies": [
               "konva"
             ],
+            "stylePreprocessorOptions": {
+              "includePaths": [
+                "node_modules"
+              ]
+            },
             "vendorChunk": true,
             "extractLicenses": false,
             "buildOptimizer": false,
@@ -109,7 +114,8 @@
     "cache": {
       "enabled": false
     },
-    "defaultCollection": "@angular-eslint/schematics"
-  },
-  "defaultProject": "robots-supervisor"
+    "schematicCollections": [
+      "@angular-eslint/schematics"
+    ]
+  }
 }

package.json

@@ -7,50 +7,52 @@
     "start": "ng serve --watch",
     "start:mock": "ng serve --watch --configuration=mock",
     "build": "ng build --configuration production",
-    "lint": "ng lint"
+    "lint": "ng lint --fix"
   },
   "dependencies": {
-    "@angular/animations": "^13.3.5",
-    "@angular/common": "^13.3.5",
-    "@angular/compiler": "^13.3.5",
-    "@angular/core": "^13.3.5",
-    "@angular/forms": "^13.3.5",
-    "@angular/localize": "^13.3.5",
-    "@angular/platform-browser": "^13.3.5",
-    "@angular/platform-browser-dynamic": "^13.3.5",
-    "@angular/platform-server": "^13.3.5",
-    "@angular/router": "^13.3.5",
-    "@fortawesome/angular-fontawesome": "^0.10.2",
-    "@fortawesome/fontawesome-svg-core": "^6.1.1",
-    "@fortawesome/free-regular-svg-icons": "^6.1.1",
-    "@fortawesome/free-solid-svg-icons": "^6.1.1",
-    "@ng-bootstrap/ng-bootstrap": "^12.1.1",
-    "@ngrx/effects": "^13.1.0",
-    "@ngrx/store": "^13.1.0",
-    "@popperjs/core": "^2.11.5",
-    "bootstrap": "^5.1.3",
-    "bootswatch": "5.1.3",
-    "core-js": "^3.22.3",
-    "konva": "^8.3.6",
+    "@angular/animations": "^16.2.5",
+    "@angular/common": "^16.2.5",
+    "@angular/compiler": "^16.2.5",
+    "@angular/core": "^16.2.5",
+    "@angular/forms": "^16.2.5",
+    "@angular/localize": "^16.2.5",
+    "@angular/platform-browser": "^16.2.5",
+    "@angular/platform-browser-dynamic": "^16.2.5",
+    "@angular/platform-server": "^16.2.5",
+    "@angular/router": "^16.2.5",
+    "@fortawesome/angular-fontawesome": "^0.13.0",
+    "@fortawesome/fontawesome-svg-core": "^6.4.2",
+    "@fortawesome/free-regular-svg-icons": "^6.4.2",
+    "@fortawesome/free-solid-svg-icons": "^6.4.2",
+    "@ng-bootstrap/ng-bootstrap": "^15.1.1",
+    "@ngrx/effects": "^16.2.0",
+    "@ngrx/store": "^16.2.0",
+    "@popperjs/core": "^2.11.8",
+    "bootstrap": "~5.2.3",
+    "bootswatch": "~5.2.3",
+    "core-js": "^3.32.2",
+    "konva": "^9.2.1",
     "lodash": "^4.17.21",
-    "primeng": "^13.3.3",
-    "rxjs": "^7.5.5",
-    "tslib": "^2.4.0",
-    "zone.js": "~0.11.5"
+    "rxjs": "^7.8.1",
+    "tslib": "^2.3.2",
+    "zone.js": "~0.13.3"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~13.3.11",
-    "@angular-devkit/core": "13.3.4",
-    "@angular-eslint/builder": "13.2.1",
-    "@angular-eslint/eslint-plugin": "13.2.1",
-    "@angular-eslint/eslint-plugin-template": "13.2.1",
-    "@angular-eslint/schematics": "13.2.1",
-    "@angular-eslint/template-parser": "13.2.1",
-    "@angular/cli": "^13.3.4",
-    "@angular/compiler-cli": "^13.3.5",
-    "@typescript-eslint/eslint-plugin": "5.17.0",
-    "@typescript-eslint/parser": "5.17.0",
-    "eslint": "^8.12.0",
-    "typescript": "~4.6.4"
+    "@angular-devkit/build-angular": "^16.2.2",
+    "@angular-devkit/core": "^16.2.2",
+    "@angular-eslint/builder": "^16.1.2",
+    "@angular-eslint/eslint-plugin": "^16.1.2",
+    "@angular-eslint/eslint-plugin-template": "^16.1.2",
+    "@angular-eslint/schematics": "^16.1.2",
+    "@angular-eslint/template-parser": "^16.1.2",
+    "@angular/cli": "^16.2.2",
+    "@angular/compiler-cli": "^16.2.5",
+    "@typescript-eslint/eslint-plugin": "^6.7.0",
+    "@typescript-eslint/parser": "^6.7.0",
+    "eslint": "^8.49.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-prettier": "^5.0.0",
+    "prettier": "^3.0.3",
+    "typescript": "~5.1.6"
   }
 }

src/app/app.component.ts

@@ -1,12 +1,10 @@
 import { Component, HostBinding } from '@angular/core';
 
 @Component({
-  selector   : 'arig-app',
-  templateUrl: './app.component.html',
+    selector: 'arig-app',
+    templateUrl: './app.component.html',
 })
 export class AppComponent {
-
-  @HostBinding('class')
-  cssClass = 'd-flex flex-column';
-
+    @HostBinding('class')
+    cssClass = 'd-flex flex-column';
 }