Upgrading to Angular 20:

Replaced checked in package-lock.json by regenerated one.
Ran ng update @angular/core@20 @angular/cli@20
Ran npm install @angular-builders/jest@^20.0.0 @fortawesome/angular-fontawesome@^3.0.0 @swimlane/ngx-graph@^11
Ran npm install ngx-mat-select-search@^8.0.2.
Ran ng update @angular/material@20.
Updated all eslint and typescript to the latest versions.
Removed @angular-devkit/schematics.
Updated fontawesome.
Updated rxjs and tslib.
Moved required node version from 16 to 20.
Updated jest-preset-angular.
Set preserveWhitespaces to false.
Corrected two type declarations in two typescript files to make ng serve run without errors.
Removed unused angular-devkit/schematics from view-user.component.ts .
Updated list of supported browsers.
Upgraded prettier.
Ran prettier . --write the first time.
Ran prettier . --write the second time.
Ran ng generate @angular/core:inject with defaults, excepted a handful of files.
Fixed remaining eslint problems.
Added dist directory to ignores in eslint.config.js.
Let prettier fix formatting, almost everything is just line breaks.
Made htmlhint ignore @if and @for Angular constructs.
Updated node version in Github workflow to 22.12.0 (build.yml).
Updated .env.ts.
Updated Angular datetime format strings from YYYY-MM-DD to yyyy-MM-dd.
Merged changes from dev into angular20 branch.

src/app/savings/common-resolvers/saving-documents.resolver.ts

@@ -1,4 +1,4 @@
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 import { Observable } from 'rxjs';
 import { SavingsService } from '../savings.service';
@@ -7,10 +7,7 @@ import { SavingsService } from '../savings.service';
   providedIn: 'root'
 })
 export class SavingDocumentsResolver {
-  /**
-   * @param {SavingsService} savingsService Savings service.
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
 
   /**
    * Returns the Savings data.

src/app/savings/common-resolvers/saving-notes.resolver.ts

@@ -1,4 +1,4 @@
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 import { Observable } from 'rxjs';
 import { SavingsService } from '../savings.service';
@@ -7,10 +7,7 @@ import { SavingsService } from '../savings.service';
   providedIn: 'root'
 })
 export class SavingNotesResolver {
-  /**
-   * @param {SavingsService} savingsService Savings service.
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
 
   /**
    * Returns the Savings data.

src/app/savings/common-resolvers/savings-account-actions.resolver.ts

@@ -1,5 +1,5 @@
 /** Angular Imports */
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 
 /** rxjs Imports */
@@ -13,10 +13,7 @@ import { SavingsService } from '../savings.service';
  */
 @Injectable()
 export class SavingsAccountActionsResolver {
-  /**
-   * @param {SavingsService} SavingsService Savings service.
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
 
   /**
    * Returns the Savings account actions data.
@@ -39,7 +36,8 @@ export class SavingsAccountActionsResolver {
       case 'Close':
         return forkJoin([
           this.savingsService.getSavingsTransactionTemplateResource(savingAccountId),
-          this.savingsService.getSavingsAccountData(savingAccountId)]);
+          this.savingsService.getSavingsAccountData(savingAccountId)
+        ]);
       case 'Apply Annual Fees':
         return this.savingsService.getSavingsAccountData(savingAccountId);
       default:

src/app/savings/common-resolvers/savings-account-and-template.resolver.ts

@@ -1,5 +1,5 @@
 /** Angular Imports */
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 
 /** rxjs Imports */
@@ -13,10 +13,7 @@ import { SavingsService } from '../savings.service';
  */
 @Injectable()
 export class SavingsAccountAndTemplateResolver {
-  /**
-   * @param {SavingsService} SavingsService Savings service.
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
 
   /**
    * Returns the Savings Account data and template.

src/app/savings/common-resolvers/savings-account-charge.resolver.ts

@@ -1,5 +1,5 @@
 /** Angular Imports */
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 
 /** rxjs Imports */
@@ -13,10 +13,7 @@ import { SavingsService } from '../savings.service';
  */
 @Injectable()
 export class SavingsAccountChargeResolver {
-  /**
-   * @param {SavingsService} SavingsService Savings service.
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
 
   /**
    * Returns the Savings Account Charge data.

src/app/savings/common-resolvers/savings-account-template.resolver.ts

@@ -1,5 +1,5 @@
 /** Angular Imports */
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 
 /** rxjs Imports */
@@ -13,10 +13,7 @@ import { SavingsService } from '../savings.service';
  */
 @Injectable()
 export class SavingsAccountTemplateResolver {
-  /**
-   * @param {savingsService} SavingsService Savings service.
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
 
   /**
    * Returns the Shares Account Template.

src/app/savings/common-resolvers/savings-account-transaction-template.resolver.ts

@@ -1,5 +1,5 @@
 /** Angular Imports */
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 
 /** rxjs Imports */
@@ -13,10 +13,7 @@ import { SavingsService } from '../savings.service';
  */
 @Injectable()
 export class SavingsAccountTransactionTemplateResolver {
-  /**
-   * @param {SavingsService} SavingsService Savings service.
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
 
   /**
    * Returns the Savings Account Transaction Template data.

src/app/savings/common-resolvers/savings-account-transaction.resolver.ts

@@ -1,5 +1,5 @@
 /** Angular Imports */
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 
 /** rxjs Imports */
@@ -13,10 +13,7 @@ import { SavingsService } from '../savings.service';
  */
 @Injectable()
 export class SavingsAccountTransactionResolver {
-  /**
-   * @param {SavingsService} SavingsService Savings service.
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
 
   /**
    * Returns the Savings Account Transaction data.

src/app/savings/common-resolvers/savings-account-view.resolver.ts

@@ -1,5 +1,5 @@
 /** Angular Imports */
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 
 /** rxjs Imports */
@@ -13,10 +13,7 @@ import { SavingsService } from '../savings.service';
  */
 @Injectable()
 export class SavingsAccountViewResolver {
-  /**
-   * @param {SavingsService} SavingsService Savings service.
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
 
   /**
    * Returns the Savings Account data.

src/app/savings/common-resolvers/savings-datatable.resolver.ts

@@ -1,5 +1,5 @@
 /** Angular Imports */
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 
 /** rxjs Imports */
@@ -13,10 +13,7 @@ import { SavingsService } from '../savings.service';
  */
 @Injectable()
 export class SavingsDatatableResolver {
-  /**
-   * @param {SavingsService} SavingsService Savings service.
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
 
   /**
    * Returns the Savings Account's Datatable data.

src/app/savings/common-resolvers/savings-datatables.resolver.ts

@@ -1,5 +1,5 @@
 /** Angular Imports */
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 
 /** rxjs Imports */
@@ -13,10 +13,7 @@ import { SavingsService } from '../savings.service';
  */
 @Injectable()
 export class SavingsDatatablesResolver {
-  /**
-   * @param {SavingsService} SavingsService Savings service.
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
 
   /**
    * Returns the Saving Account's Datatables data.

src/app/savings/common-resolvers/savings-transaction-reciept.resolver.ts

@@ -1,5 +1,5 @@
 /** Angular Imports */
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 
 /** rxjs Imports */
@@ -14,14 +14,8 @@ import { SettingsService } from 'app/settings/settings.service';
  */
 @Injectable()
 export class SavingsTransactionRecieptResolver {
-  /**
-   * @param {ReportsService} reportsService Reports service.
-   * @param {SettingsService} settingsService Settings Service.
-   */
-  constructor(
-    private reportsService: ReportsService,
-    private settingsService: SettingsService
-  ) {}
+  private reportsService = inject(ReportsService);
+  private settingsService = inject(SettingsService);
 
   /**
    * Returns the Savings Transaction Reciept

src/app/savings/common-resolvers/transaction-datatable.resolver.ts

@@ -1,5 +1,5 @@
 // Angular Imports
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 
 // rxjs Imports
@@ -10,11 +10,8 @@ import { SavingsService } from '../savings.service';
 
 @Injectable()
 export class TransactionDatatableResolver {
-  /**
-   *
-   * @param {SavingsService} savingsService
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
+
   /**
    * Returns the Transactions Account's Datatable data.
    * @returns {Observable<any>}

src/app/savings/common-resolvers/transaction-datatables.resolver.ts

@@ -1,5 +1,5 @@
 // Angular Imports
-import { Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { ActivatedRouteSnapshot } from '@angular/router';
 
 // rxjs Imports
@@ -10,11 +10,8 @@ import { SavingsService } from '../savings.service';
 
 @Injectable()
 export class TransactionDatatablesResolver {
-  /**
-   *
-   * @param savingsService Savings Service
-   */
-  constructor(private savingsService: SavingsService) {}
+  private savingsService = inject(SavingsService);
+
   /**
    *
    * @param route