upgraded angular to 18

src/Client/Logistics.OfficeApp/package.json

@@ -12,47 +12,47 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^17.0.1",
-    "@angular/common": "^17.0.1",
-    "@angular/compiler": "^17.0.1",
-    "@angular/core": "^17.0.1",
-    "@angular/forms": "^17.0.1",
-    "@angular/platform-browser": "^17.0.1",
-    "@angular/platform-browser-dynamic": "^17.0.1",
-    "@angular/router": "^17.0.1",
-    "@microsoft/signalr": "^7.0.11",
-    "angular-auth-oidc-client": "^16.0.1",
-    "bootstrap": "^5.3.2",
-    "bootstrap-icons": "^1.11.1",
-    "chart.js": "^4.4.0",
+    "@angular/animations": "^18.0.0",
+    "@angular/common": "^18.0.0",
+    "@angular/compiler": "^18.0.0",
+    "@angular/core": "^18.0.0",
+    "@angular/forms": "^18.0.0",
+    "@angular/platform-browser": "^18.0.0",
+    "@angular/platform-browser-dynamic": "^18.0.0",
+    "@angular/router": "^18.0.0",
+    "@microsoft/signalr": "^8.0.0",
+    "angular-auth-oidc-client": "^17.0.0",
+    "bootstrap": "^5.3.3",
+    "bootstrap-icons": "^1.11.3",
+    "chart.js": "^4.4.3",
     "jspdf": "^2.5.1",
     "ngx-mapbox-gl": "^10.0.0",
-    "primeicons": "^6.0.1",
-    "primeng": "^16.7.2",
+    "primeicons": "^7.0.0",
+    "primeng": "^17.17.0",
     "rxjs": "^7.8.1",
     "tslib": "^2.6.2",
-    "zone.js": "^0.14.2"
+    "zone.js": "^0.14.6"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^17.0.0",
-    "@angular-eslint/builder": "^17.0.0",
-    "@angular-eslint/eslint-plugin": "^17.0.0",
-    "@angular-eslint/eslint-plugin-template": "^17.0.0",
-    "@angular-eslint/schematics": "^17.0.0",
-    "@angular-eslint/template-parser": "^17.0.0",
-    "@angular/cli": "^17.0.0",
-    "@angular/compiler-cli": "^17.0.1",
-    "@types/jasmine": "^5.1.2",
-    "@types/mapbox-gl": "^2.7.18",
-    "@typescript-eslint/eslint-plugin": "^6.10.0",
-    "@typescript-eslint/parser": "^6.10.0",
-    "eslint": "^8.53.0",
-    "jasmine-core": "^5.1.1",
-    "karma": "^6.4.2",
+    "@angular-devkit/build-angular": "^18.0.1",
+    "@angular-eslint/builder": "^17.5.1",
+    "@angular-eslint/eslint-plugin": "^17.5.1",
+    "@angular-eslint/eslint-plugin-template": "^17.5.1",
+    "@angular-eslint/schematics": "^17.5.1",
+    "@angular-eslint/template-parser": "^17.5.1",
+    "@angular/cli": "^18.0.1",
+    "@angular/compiler-cli": "^18.0.0",
+    "@types/jasmine": "^5.1.4",
+    "@types/mapbox-gl": "^3.1.0",
+    "@typescript-eslint/eslint-plugin": "^7.10.0",
+    "@typescript-eslint/parser": "^7.10.0",
+    "eslint": "^9.3.0",
+    "jasmine-core": "^5.1.2",
+    "karma": "^6.4.3",
     "karma-chrome-launcher": "^3.2.0",
     "karma-coverage": "^2.2.1",
     "karma-jasmine": "^5.1.0",
     "karma-jasmine-html-reporter": "^2.1.0",
-    "typescript": "^5.2.2"
+    "typescript": "^5.4.5"
   }
-}
+}

src/Client/Logistics.OfficeApp/src/app/pages/accounting/edit-payroll/edit-payroll.component.ts

@@ -5,7 +5,7 @@ import {FormGroup, FormControl, Validators, ReactiveFormsModule} from '@angular/
 import {ActivatedRoute, Router, RouterModule} from '@angular/router';
 import {CardModule} from 'primeng/card';
 import {DropdownModule} from 'primeng/dropdown';
-import {AutoCompleteModule, AutoCompleteOnSelectEvent} from 'primeng/autocomplete';
+import {AutoCompleteModule, AutoCompleteSelectEvent} from 'primeng/autocomplete';
 import {ProgressSpinnerModule} from 'primeng/progressspinner';
 import {CalendarModule} from 'primeng/calendar';
 import {ButtonModule} from 'primeng/button';
@@ -28,7 +28,6 @@ import {DateUtils} from '@shared/utils';
   selector: 'app-edit-payroll',
   standalone: true,
   templateUrl: './edit-payroll.component.html',
-  styleUrls: [],
   imports: [
     CommonModule,
     CardModule,
@@ -108,7 +107,7 @@ export class EditPayrollComponent implements OnInit {
     });
   }
 
-  handleAutoCompleteSelectEvent(event: AutoCompleteOnSelectEvent) {
+  handleAutoCompleteSelectEvent(event: AutoCompleteSelectEvent) {
     this.calculatePayrollForEmployee(event.value);
   }
 

src/Client/Logistics.OfficeApp/src/app/pages/load/components/search-customer/search-customer.component.ts

@@ -1,7 +1,7 @@
 import {Component, EventEmitter, Input, Output, forwardRef} from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR} from '@angular/forms';
-import {AutoCompleteModule, AutoCompleteOnSelectEvent} from 'primeng/autocomplete';
+import {AutoCompleteModule, AutoCompleteSelectEvent} from 'primeng/autocomplete';
 import {ApiService} from '@core/services';
 import {Customer} from '@core/models';
 
@@ -40,7 +40,7 @@ export class SearchCustomerComponent implements ControlValueAccessor {
     });
   }
 
-  changeSelectedCustomer(event: AutoCompleteOnSelectEvent) {
+  changeSelectedCustomer(event: AutoCompleteSelectEvent) {
     this.selectedCustomerChange.emit(event.value);
     this.onChange(event.value);
   }

src/Client/Logistics.OfficeApp/src/app/pages/load/components/search-truck/search-truck.component.ts

@@ -1,7 +1,7 @@
 import {Component, EventEmitter, Input, Output, forwardRef} from '@angular/core';
 import {CommonModule} from '@angular/common';
 import {ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR} from '@angular/forms';
-import {AutoCompleteModule, AutoCompleteOnSelectEvent} from 'primeng/autocomplete';
+import {AutoCompleteModule, AutoCompleteSelectEvent} from 'primeng/autocomplete';
 import {ApiService} from '@core/services';
 import {TruckData, TruckHelper} from '../../shared';
 
@@ -45,7 +45,7 @@ export class SearchTruckComponent implements ControlValueAccessor {
     });
   }
 
-  changeSelectedTruck(event: AutoCompleteOnSelectEvent) {
+  changeSelectedTruck(event: AutoCompleteSelectEvent) {
     this.selectedTruckChange.emit(event.value);
     this.onChange(event.value);
   }

src/Client/Logistics.OfficeApp/src/app/pages/load/list-loads/list-loads.component.ts

@@ -83,7 +83,7 @@ export class ListLoadComponent {
     return LoadStatusEnum.getValue(enumValue).description;
   }
 
-  getLoadStatusSeverity(status: LoadStatus): string {
+  getLoadStatusSeverity(status: LoadStatus): 'success' | 'info' {
     return status === LoadStatus.Delivered ? 'success' : 'info';
   }
 

src/Client/Logistics.OfficeApp/src/app/shared/components/directions-map/directions-map.component.ts

@@ -1,4 +1,4 @@
-import {Component, Input, OnChanges, SimpleChanges, Output, EventEmitter} from '@angular/core';
+import {Component, Input, OnChanges, Output, EventEmitter} from '@angular/core';
 import {NgIf} from '@angular/common';
 import {HttpClient} from '@angular/common/http';
 import {NgxMapboxGLModule} from 'ngx-mapbox-gl';

src/Client/Logistics.OfficeApp/src/app/shared/components/payment-status-tag/payment-status-tag.component.ts

@@ -20,7 +20,7 @@ export class PaymentStatusTagComponent {
     return PaymentStatusEnum.getValue(enumValue).description;
   }
 
-  getPaymentStatusTagSeverity(paymentStatus: PaymentStatus): string {
+  getPaymentStatusTagSeverity(paymentStatus: PaymentStatus): 'success' | 'warning' {
     return paymentStatus === PaymentStatus.Paid ? 'success' : 'warning';
   }
 }