chore: angular 17 new syntax

* Fixes order pid extract. * Fixes bucket name button. * Fixes request button. * Simplifies eslint configuration files. Co-Authored-by: Bertrand Zuchuat <[email protected]> Co-Authored-by: Bertrand Zuchuat <[email protected]>
Garfield-fr · Feb 20, 2024 · d4d6ea8 · d4d6ea8
1 parent 56c4bab
commit d4d6ea8
Show file tree

Hide file tree

Showing 398 changed files with 10,089 additions and 9,339 deletions.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -8,13 +8,6 @@
       "files": [
         "*.ts"
       ],
-      "parserOptions": {
-        "project": [
-          "tsconfig.json",
-          "e2e/tsconfig.json"
-        ],
-        "createDefaultProgram": true
-      },
       "extends": [
         "plugin:@angular-eslint/recommended",
         "plugin:@angular-eslint/template/process-inline-templates"

diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
@@ -9,17 +9,17 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [14.x, 16.x]
+        node-version: [18.x, 20.x]
 
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v3
+      uses: actions/setup-node@v4
       with:
         node-version: ${{ matrix.node-version }}
     - name: install package
       run: |
-        npm install -g @angular/cli@14
+        npm install -g @angular/cli@17
         npm ci
     - name: run tests
       run: |

diff --git a/angular.json b/angular.json
@@ -157,7 +157,6 @@
             "main": "projects/public-holdings-items/src/main.ts",
             "polyfills": "projects/public-holdings-items/src/polyfills.ts",
             "tsConfig": "projects/public-holdings-items/tsconfig.app.json",
-            "aot": true,
             "assets": [
               {
                 "glob": "**/*.json",
@@ -171,6 +170,11 @@
               }
             ],
             "styles": [
+              "node_modules/primeng/resources/themes/lara-light-blue/theme.css",
+              "node_modules/primeng/resources/primeng.min.css",
+              "node_modules/primeicons/primeicons.css",
+              "node_modules/primeflex/primeflex.min.css",
+              "node_modules/ngx-spinner/animations/ball-zig-zag.css",
               "projects/public-search/src/app/scss/styles.scss",
               "projects/shared/src/scss/styles.scss"
             ],
@@ -188,7 +192,6 @@
               "outputHashing": "all",
               "sourceMap": false,
               "namedChunks": false,
-              "aot": true,
               "extractLicenses": true,
               "vendorChunk": false,
               "buildOptimizer": true,
@@ -368,8 +371,8 @@
           "builder": "@angular-eslint/builder:lint",
           "options": {
             "lintFilePatterns": [
-              "projects/public-search/src/**/*.ts",
-              "projects/public-search/src/**/*.html"
+              "projects/public-search/**/*.ts",
+              "projects/public-search/**/*.html"
             ]
           }
         }
@@ -391,7 +394,6 @@
             "main": "projects/search-bar/src/main.ts",
             "polyfills": "projects/search-bar/src/polyfills.ts",
             "tsConfig": "projects/search-bar/tsconfig.app.json",
-            "aot": true,
             "assets": [
               {
                 "glob": "**/*.json",
@@ -419,7 +421,6 @@
               "outputHashing": "all",
               "sourceMap": false,
               "namedChunks": false,
-              "aot": true,
               "extractLicenses": true,
               "vendorChunk": false,
               "buildOptimizer": true,
@@ -646,7 +647,6 @@
             "main": "projects/public-user-profile-edit/src/main.ts",
             "polyfills": "projects/public-user-profile-edit/src/polyfills.ts",
             "tsConfig": "projects/public-user-profile-edit/tsconfig.app.json",
-            "aot": true,
             "assets": [
               {
                 "glob": "**/*.json",
@@ -755,7 +755,6 @@
             "main": "projects/public-user-password-change/src/main.ts",
             "polyfills": "projects/public-user-password-change/src/polyfills.ts",
             "tsConfig": "projects/public-user-password-change/tsconfig.app.json",
-            "aot": true,
             "assets": [
               {
                 "glob": "**/*.json",
@@ -848,5 +847,10 @@
         }
       }
     }
+  },
+  "cli": {
+    "schematicCollections": [
+      "@angular-eslint/schematics"
+    ]
   }
 }
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
 
 {
   "name": "@rero/rero-ils-ui",
-  "version": "14.8.0",
+  "version": "17.2.0",
   "license": "AGPL-3.0-only",
   "author": {
     "name": "RERO",

diff --git a/projects/admin/.eslintrc.json b/projects/admin/.eslintrc.json
@@ -8,12 +8,6 @@
       "files": [
         "*.ts"
       ],
-      "parserOptions": {
-        "project": [
-          "projects/admin/tsconfig.eslint.json"
-        ],
-        "createDefaultProgram": false
-      },
       "rules": {
         "@angular-eslint/directive-selector": [
           "error",

diff --git a/projects/admin/e2e/tsconfig.json b/projects/admin/e2e/tsconfig.json
@@ -3,7 +3,7 @@
   "compilerOptions": {
     "outDir": "../../../out-tsc/e2e",
     "module": "commonjs",
-    "target": "es2018",
+    "target": "es2022",
     "types": [
       "jasmine",
       "jasminewd2",

diff --git a/...c/app/acquisition/components/account/account-brief-view/account-brief-view.component.html b/...c/app/acquisition/components/account/account-brief-view/account-brief-view.component.html
@@ -1,6 +1,6 @@
 <!--
   RERO ILS UI
-  Copyright (C) 2021 RERO
+  Copyright (C) 2021-2024 RERO
   Copyright (C) 2021 UCLouvain
 
   This program is free software: you can redistribute it and/or modify
@@ -15,76 +15,78 @@
   You should have received a copy of the GNU Affero General Public License
   along with this program.  If not, see <http://www.gnu.org/licenses/>.
 -->
-<div class="row account" *ngIf="account && permissions else loading">
-  <!-- NAME ================================================================= -->
-  <div class="col-5 account-name depth-padding-{{ account.depth }}">
-    <a [routerLink]="[detailUrl]">{{ account.name }}</a>
-  </div>
-  <div class="col-1 account-number">
-    <ng-container *ngIf="account.number">[{{ account.number }}]</ng-container>
-  </div>
-  <!-- ACCOUNTING INFORMATIONS ============================================== -->
-  <div class="col-1 amount">
-    {{ account.allocated_amount | currency: organisation.default_currency }}
-  </div>
-  <ng-container *ngVar="account | accountAvailableAmount as available_amount">
+@defer (when account && permissions) {
+  <div class="row account">
+    <!-- NAME -->
+    <div class="col-5 account-name depth-padding-{{ account.depth }}">
+      <a [routerLink]="[detailUrl]">{{ account.name }}</a>
+    </div>
+    <div class="col-1 account-number">
+      @if (account.number) {
+        [{{ account.number }}]
+      }
+    </div>
+    <!-- ACCOUNTING INFORMATION'S -->
+    <div class="col-1 amount">
+      {{ account.allocated_amount | currency: organisation.default_currency }}
+    </div>
+    <ng-container *ngVar="account | accountAvailableAmount as available_amount">
+      <div class="col-1 amount" [class]="{
+        'text-success': available_amount > 0,
+        'text-muted': available_amount === 0,
+        'text-warning': available_amount < 0
+      }">
+        {{ available_amount | currency: organisation.default_currency }}
+      </div>
+    </ng-container>
     <div class="col-1 amount" [class]="{
-      'text-success': available_amount > 0,
-      'text-muted': available_amount === 0,
-      'text-warning': available_amount < 0
+      'text-danger': account.encumbrance_amount.self > 0,
+      'text-muted': account.encumbrance_amount.self <= 0
     }">
-      {{ available_amount | currency: organisation.default_currency }}
+      {{ account.encumbrance_amount.self | currency: organisation.default_currency }}
+    </div>
+    <div class="col-1 amount" [class]="{
+      'text-danger': account.expenditure_amount.self > 0,
+      'text-muted': account.expenditure_amount.self <= 0
+    }">
+      {{ account.expenditure_amount.self | currency: organisation.default_currency}}
+    </div>
+    <div class="col-1 amount" [class]="{
+      'text-muted': account.remaining_balance.self === 0,
+      'text-warning': account.remaining_balance.self < 0
+    }">
+      {{ account.remaining_balance.self | currency: organisation.default_currency }}
+    </div>
+    <!-- ACTION BUTTONS -->
+    <div class="col-1 pr-0 text-right">
+      @if (permissions.update.can) {
+        <button type="button" class="btn btn-outline-primary btn-sm"
+                [routerLink]="['/records', 'acq_accounts', 'edit', account.pid]">
+          <i class="fa fa-pencil"></i>
+        </button>
+      }
+      @if (permissions.delete.can) {
+        <button type="button" class="btn btn-outline-danger btn-sm ml-1" (click)="delete()">
+          <i class="fa fa-trash"></i>
+        </button>
+      } @else {
+        <button type="button" class="btn btn-sm btn-outline-danger disabled ml-1"
+                title="{{ 'Delete' | translate}}"
+                [popover]="tolTemplate" triggers="mouseenter:mouseleave">
+          <i class="fa fa-trash"></i>
+        </button>
+        <ng-template #tolTemplate><div [innerHtml]="deleteInfoMessage | nl2br"></div></ng-template>
+      }
     </div>
-  </ng-container>
-  <div class="col-1 amount" [class]="{
-    'text-danger': account.encumbrance_amount.self > 0,
-    'text-muted': account.encumbrance_amount.self <= 0
-  }">
-    {{ account.encumbrance_amount.self | currency: organisation.default_currency }}
-  </div>
-  <div class="col-1 amount" [class]="{
-    'text-danger': account.expenditure_amount.self > 0,
-    'text-muted': account.expenditure_amount.self <= 0
-  }">
-    {{ account.expenditure_amount.self | currency: organisation.default_currency}}
-  </div>
-  <div class="col-1 amount" [class]="{
-    'text-muted': account.remaining_balance.self === 0,
-    'text-warning': account.remaining_balance.self < 0
-  }">
-    {{ account.remaining_balance.self | currency: organisation.default_currency }}
-  </div>
-  <!-- ACTION BUTTONS ======================================================= -->
-  <div class="col-1 pr-0 text-right">
-    <button *ngIf="permissions.update.can"
-            type="button" class="btn btn-outline-primary btn-sm"
-            [routerLink]="['/records', 'acq_accounts', 'edit', account.pid]">
-      <i class="fa fa-pencil"></i>
-    </button>
-    <button *ngIf="permissions.delete.can; else notDelete"
-            type="button" class="btn btn-outline-danger btn-sm ml-1"
-            (click)="delete()">
-      <i class="fa fa-trash"></i>
-    </button>
-    <ng-template #notDelete>
-      <button type="button" class="btn btn-sm btn-outline-danger disabled ml-1"
-              title="{{ 'Delete' | translate}}"
-              [popover]="tolTemplate" triggers="mouseenter:mouseleave">
-        <i class="fa fa-trash"></i>
-      </button>
-      <ng-template #tolTemplate><div [innerHtml]="deleteInfoMessage | nl2br"></div></ng-template>
-    </ng-template>
   </div>
-</div>
-<admin-account-brief-view
-  *ngFor="let child_account of children"
-  [account]="child_account"
-  [loadChildren]="loadChildren"
-  (deleteAccount)="accountDeleted($event)"
->
-</admin-account-brief-view>
-
-
-<ng-template #loading>
+} @placeholder {
   <i class="fa fa-spinner"></i>
-</ng-template>
+}
+
+@for (childAccount of children; track childAccount) {
+  <admin-account-brief-view
+    [account]="childAccount"
+    [loadChildren]="loadChildren"
+    (deleteAccount)="accountDeleted($event)"
+  ></admin-account-brief-view>
+}