WEB-215 Merge angular-update-19 into dev to upgrade Angular from v18 to v19 (#2530)

src/app/home/dashboard/amount-collected-pie/amount-collected-pie.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
-import { UntypedFormControl } from '@angular/forms';
+import { UntypedFormControl, ReactiveFormsModule } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
 
 /** Custom Services */
@@ -8,6 +8,10 @@ import { HomeService } from '../../home.service';
 
 /** Charting Imports */
 import Chart from 'chart.js';
+import { MatCard, MatCardHeader, MatCardContent } from '@angular/material/card';
+import { FaIconComponent } from '@fortawesome/angular-fontawesome';
+import { NgFor, NgStyle, NgIf } from '@angular/common';
+import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 
 /**
  * Amount Collected Pie Chart Component
@@ -15,7 +19,13 @@ import Chart from 'chart.js';
 @Component({
   selector: 'mifosx-amount-collected-pie',
   templateUrl: './amount-collected-pie.component.html',
-  styleUrls: ['./amount-collected-pie.component.scss']
+  styleUrls: ['./amount-collected-pie.component.scss'],
+  imports: [
+    ...STANDALONE_SHARED_IMPORTS,
+    MatCardHeader,
+    FaIconComponent,
+    NgStyle
+  ]
 })
 export class AmountCollectedPieComponent implements OnInit {
   /** Static Form control for office Id */

src/app/home/dashboard/amount-disbursed-pie/amount-disbursed-pie.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
-import { UntypedFormControl } from '@angular/forms';
+import { UntypedFormControl, ReactiveFormsModule } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
 
 /** Custom Services */
@@ -8,6 +8,10 @@ import { HomeService } from '../../home.service';
 
 /** Charting Imports */
 import Chart from 'chart.js';
+import { MatCard, MatCardHeader, MatCardContent } from '@angular/material/card';
+import { FaIconComponent } from '@fortawesome/angular-fontawesome';
+import { NgFor, NgStyle, NgIf } from '@angular/common';
+import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 
 /**
  * Amount Disbursed Pie Chart Component
@@ -15,7 +19,13 @@ import Chart from 'chart.js';
 @Component({
   selector: 'mifosx-amount-disbursed-pie',
   templateUrl: './amount-disbursed-pie.component.html',
-  styleUrls: ['./amount-disbursed-pie.component.scss']
+  styleUrls: ['./amount-disbursed-pie.component.scss'],
+  imports: [
+    ...STANDALONE_SHARED_IMPORTS,
+    MatCardHeader,
+    FaIconComponent,
+    NgStyle
+  ]
 })
 export class AmountDisbursedPieComponent implements OnInit {
   /** Static Form control for office Id */

src/app/home/dashboard/client-trends-bar/client-trends-bar.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
-import { UntypedFormControl } from '@angular/forms';
+import { UntypedFormControl, ReactiveFormsModule } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
 
 /** rxjs Imports */
@@ -13,6 +13,11 @@ import { HomeService } from '../../home.service';
 /** Charting Imports */
 import { Dates } from 'app/core/utils/dates';
 import Chart from 'chart.js';
+import { MatCard, MatCardHeader, MatCardContent } from '@angular/material/card';
+import { FaIconComponent } from '@fortawesome/angular-fontawesome';
+import { NgFor, NgStyle } from '@angular/common';
+import { MatButtonToggleGroup, MatButtonToggle } from '@angular/material/button-toggle';
+import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 
 /**
  * Client Trends Bar Chart Component.
@@ -20,7 +25,15 @@ import Chart from 'chart.js';
 @Component({
   selector: 'mifosx-client-trends-bar',
   templateUrl: './client-trends-bar.component.html',
-  styleUrls: ['./client-trends-bar.component.scss']
+  styleUrls: ['./client-trends-bar.component.scss'],
+  imports: [
+    ...STANDALONE_SHARED_IMPORTS,
+    MatCardHeader,
+    FaIconComponent,
+    NgStyle,
+    MatButtonToggleGroup,
+    MatButtonToggle
+  ]
 })
 export class ClientTrendsBarComponent implements OnInit {
   /** Static Form control for office Id */

src/app/home/dashboard/dashboard.component.ts

@@ -1,17 +1,32 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
-import { UntypedFormControl } from '@angular/forms';
-import { Router } from '@angular/router';
+import { UntypedFormControl, ReactiveFormsModule } from '@angular/forms';
+import { Router, RouterLink } from '@angular/router';
 import { Observable } from 'rxjs';
 import { map } from 'rxjs/operators';
 import { activities } from '../activities';
+import { MatAutocompleteTrigger, MatAutocomplete, MatOption } from '@angular/material/autocomplete';
+import { NgFor, AsyncPipe } from '@angular/common';
+import { ClientTrendsBarComponent } from './client-trends-bar/client-trends-bar.component';
+import { AmountDisbursedPieComponent } from './amount-disbursed-pie/amount-disbursed-pie.component';
+import { AmountCollectedPieComponent } from './amount-collected-pie/amount-collected-pie.component';
+import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 /**
  * Dashboard component.
  */
 @Component({
   selector: 'mifosx-dashboard',
   templateUrl: './dashboard.component.html',
-  styleUrls: ['./dashboard.component.scss']
+  styleUrls: ['./dashboard.component.scss'],
+  imports: [
+    ...STANDALONE_SHARED_IMPORTS,
+    MatAutocompleteTrigger,
+    MatAutocomplete,
+    ClientTrendsBarComponent,
+    AmountDisbursedPieComponent,
+    AmountCollectedPieComponent,
+    AsyncPipe
+  ]
 })
 export class DashboardComponent implements OnInit {
   /** Array of all user activities */

src/app/home/home.component.ts

@@ -1,7 +1,7 @@
 /** Angular Imports */
 import { Component, OnInit, TemplateRef, ElementRef, ViewChild, AfterViewInit } from '@angular/core';
-import { ActivatedRoute, Router, NavigationEnd } from '@angular/router';
-import { UntypedFormControl } from '@angular/forms';
+import { ActivatedRoute, Router, NavigationEnd, RouterLink } from '@angular/router';
+import { UntypedFormControl, ReactiveFormsModule } from '@angular/forms';
 import { MatDialog } from '@angular/material/dialog';
 
 /** rxjs Imports */
@@ -19,6 +19,11 @@ import { ConfigurationWizardService } from '../configuration-wizard/configuratio
 
 /** Custom Components */
 import { NextStepDialogComponent } from '../configuration-wizard/next-step-dialog/next-step-dialog.component';
+import { FaIconComponent } from '@fortawesome/angular-fontawesome';
+import { MatCard, MatCardHeader, MatCardTitle, MatCardContent, MatCardImage } from '@angular/material/card';
+import { MatAutocompleteTrigger, MatAutocomplete, MatOption } from '@angular/material/autocomplete';
+import { NgFor, NgIf, AsyncPipe } from '@angular/common';
+import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 
 /**
  * Home component.
@@ -26,7 +31,17 @@ import { NextStepDialogComponent } from '../configuration-wizard/next-step-dialo
 @Component({
   selector: 'mifosx-home',
   templateUrl: './home.component.html',
-  styleUrls: ['./home.component.scss']
+  styleUrls: ['./home.component.scss'],
+  imports: [
+    ...STANDALONE_SHARED_IMPORTS,
+    FaIconComponent,
+    MatCardHeader,
+    MatCardTitle,
+    MatAutocompleteTrigger,
+    MatAutocomplete,
+    MatCardImage,
+    AsyncPipe
+  ]
 })
 export class HomeComponent implements OnInit, AfterViewInit {
   /** Username of authenticated user. */

src/app/home/home.module.ts

@@ -28,9 +28,7 @@ import { SessionTimeoutDialogComponent } from './timeout-dialog/session-timeout-
     SharedModule,
     PipesModule,
     HomeRoutingModule,
-    TranslateModule
-  ],
-  declarations: [
+    TranslateModule,
     HomeComponent,
     DashboardComponent,
     AmountCollectedPieComponent,

src/app/home/timeout-dialog/idle-timeout.service.ts

@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import { environment } from 'environments/environment';
+import { environment } from '../../../environments/environment';
 import { interval, merge, fromEvent, Observable } from 'rxjs';
 import { takeUntil, repeat, map } from 'rxjs/operators';
 
@@ -27,7 +27,7 @@ export class IdleTimeoutService {
     const $signal = merge(...events.map((eventName) => fromEvent(document, eventName)));
     this.$onSessionTimeout = interval(this.timeoutDelay).pipe(
       takeUntil($signal),
-      map(() => undefined),
+      map((): void => undefined),
       repeat()
     );
   }

src/app/home/timeout-dialog/session-timeout-dialog.component.ts

@@ -1,10 +1,26 @@
 import { Component } from '@angular/core';
-import { MatDialogRef } from '@angular/material/dialog';
+import {
+  MatDialogRef,
+  MatDialogTitle,
+  MatDialogContent,
+  MatDialogActions,
+  MatDialogClose
+} from '@angular/material/dialog';
+import { CdkScrollable } from '@angular/cdk/scrolling';
+import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 
 @Component({
   selector: 'mifosx-session-timeout-dialog',
   templateUrl: './session-timeout-dialog.component.html',
-  styleUrls: ['./session-timeout-dialog.component.scss']
+  styleUrls: ['./session-timeout-dialog.component.scss'],
+  imports: [
+    ...STANDALONE_SHARED_IMPORTS,
+    MatDialogTitle,
+    CdkScrollable,
+    MatDialogContent,
+    MatDialogActions,
+    MatDialogClose
+  ]
 })
 export class SessionTimeoutDialogComponent {
   constructor(public dialogRef: MatDialogRef<SessionTimeoutDialogComponent>) {}

src/app/home/warning-dialog/warning-dialog.component.ts

@@ -1,11 +1,27 @@
 import { Component } from '@angular/core';
-import { MatDialogRef } from '@angular/material/dialog';
+import {
+  MatDialogRef,
+  MatDialogTitle,
+  MatDialogContent,
+  MatDialogActions,
+  MatDialogClose
+} from '@angular/material/dialog';
 import { environment } from '../../../environments/environment';
+import { CdkScrollable } from '@angular/cdk/scrolling';
+import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
 
 @Component({
   selector: 'mifosx-warning-dialog',
   templateUrl: './warning-dialog.component.html',
-  styleUrls: ['./warning-dialog.component.scss']
+  styleUrls: ['./warning-dialog.component.scss'],
+  imports: [
+    ...STANDALONE_SHARED_IMPORTS,
+    MatDialogTitle,
+    CdkScrollable,
+    MatDialogContent,
+    MatDialogActions,
+    MatDialogClose
+  ]
 })
 export class WarningDialogComponent {
   title: string;