Upgrade/angular 14 (#1853)

* Fix Loan product Payment Allocation

* Upgrade to Angular 14

---------

Co-authored-by: Jose Alberto Hernandez <alberto@blue-daemon.local>

src/app/groups/create-group/create-group.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit, AfterViewInit } from '@angular/core';
-import { FormGroup, FormBuilder, FormControl, Validators } from '@angular/forms';
+import { UntypedFormGroup, UntypedFormBuilder, UntypedFormControl, Validators } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
 
 /** Custom Services */
@@ -24,7 +24,7 @@ export class CreateGroupComponent implements OnInit, AfterViewInit {
   /** Maximum date allowed. */
   maxDate = new Date();
   /** Group form. */
-  groupForm: FormGroup;
+  groupForm: UntypedFormGroup;
   /** Office data. */
   officeData: any;
   /** Client data. */
@@ -34,7 +34,7 @@ export class CreateGroupComponent implements OnInit, AfterViewInit {
   /** Client Members. */
   clientMembers: any[] = [];
   /** ClientChoice. */
-  clientChoice = new FormControl('');
+  clientChoice = new UntypedFormControl('');
 
   /**
    * Retrieves the offices data from `resolve`.
@@ -46,7 +46,7 @@ export class CreateGroupComponent implements OnInit, AfterViewInit {
    * @param {Dates} dateUtils Date Utils to format date.
    * @param {SettingsService} settingsService SettingsService
    */
-  constructor(private formBuilder: FormBuilder,
+  constructor(private formBuilder: UntypedFormBuilder,
               private route: ActivatedRoute,
               private router: Router,
               private clientsService: ClientsService,
@@ -112,7 +112,7 @@ export class CreateGroupComponent implements OnInit, AfterViewInit {
     });
     this.groupForm.get('active').valueChanges.subscribe((bool: boolean) => {
       if (bool) {
-        this.groupForm.addControl('activationDate', new FormControl('', Validators.required));
+        this.groupForm.addControl('activationDate', new UntypedFormControl('', Validators.required));
       } else {
         this.groupForm.removeControl('activationDate');
       }

src/app/groups/edit-group/edit-group.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormBuilder, FormControl, Validators } from '@angular/forms';
+import { UntypedFormGroup, UntypedFormBuilder, UntypedFormControl, Validators } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
 
 /** Custom Services */
@@ -23,7 +23,7 @@ export class EditGroupComponent implements OnInit {
   /** Maximum date allowed. */
   maxDate = new Date();
   /** Edit Group form. */
-  editGroupForm: FormGroup;
+  editGroupForm: UntypedFormGroup;
   /** Staff data. */
   staffData: any;
   /** Group Data */
@@ -40,7 +40,7 @@ export class EditGroupComponent implements OnInit {
    * @param {Dates} dateUtils Date Utils to format date.
    * @param {SettingsService} settingsService SettingsService
    */
-  constructor(private formBuilder: FormBuilder,
+  constructor(private formBuilder: UntypedFormBuilder,
               private route: ActivatedRoute,
               private router: Router,
               private groupService: GroupsService,
@@ -85,7 +85,7 @@ export class EditGroupComponent implements OnInit {
    */
   buildDependencies() {
     if (this.groupData.active) {
-      this.editGroupForm.addControl('activationDate', new FormControl('', Validators.required));
+      this.editGroupForm.addControl('activationDate', new UntypedFormControl('', Validators.required));
       this.editGroupForm.get('activationDate').patchValue(this.groupData.activationDate && new Date(this.groupData.activationDate));
     } else {
       this.editGroupForm.removeControl('activationDate');

src/app/groups/groups-view/add-role/add-role.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { UntypedFormGroup, UntypedFormBuilder, Validators } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
@@ -17,7 +17,7 @@ import { GroupsService } from '../../groups.service';
 export class AddRoleComponent implements OnInit {
 
   /** Groups Add Role Form */
-  groupsAddRoleForm: FormGroup;
+  groupsAddRoleForm: UntypedFormGroup;
   /** Client Member Data */
   clientMemberData: any;
   /** Role Data */
@@ -31,7 +31,7 @@ export class AddRoleComponent implements OnInit {
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
    */
-  constructor(private formBuilder: FormBuilder,
+  constructor(private formBuilder: UntypedFormBuilder,
               private groupsService: GroupsService,
               private route: ActivatedRoute,
               private router: Router) {

src/app/groups/groups-view/general-tab/general-tab.component.html

@@ -252,7 +252,7 @@
 
       <ng-container matColumnDef="GLIM Id">
         <th mat-header-cell *matHeaderCellDef> GLIM Id </th>
-        <td mat-cell *matCellDef="let element"> 
+        <td mat-cell *matCellDef="let element">
           {{element.glimId}} </td>
       </ng-container>
 

src/app/groups/groups-view/group-actions/activate-group/activate-group.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { UntypedFormGroup, UntypedFormBuilder, Validators } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
 import { Dates } from 'app/core/utils/dates';
 
@@ -23,7 +23,7 @@ export class ActivateGroupComponent implements OnInit {
   /** Maximum date allowed. */
   maxDate = new Date();
   /** Activate group form. */
-  activateGroupForm: FormGroup;
+  activateGroupForm: UntypedFormGroup;
   /** Group Id */
   groupId: any;
 
@@ -35,7 +35,7 @@ export class ActivateGroupComponent implements OnInit {
    * @param {Router} router Router
    * @param {SettingsService} settingsService SettingsService
    */
-  constructor(private formBuilder: FormBuilder,
+  constructor(private formBuilder: UntypedFormBuilder,
               private groupsService: GroupsService,
               private dateUtils: Dates,
               private route: ActivatedRoute,

src/app/groups/groups-view/group-actions/attach-group-meeting/attach-group-meeting.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms';
+import { UntypedFormGroup, UntypedFormBuilder, Validators, UntypedFormControl } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
 import { Dates } from 'app/core/utils/dates';
 
@@ -23,7 +23,7 @@ export class AttachGroupMeetingComponent implements OnInit {
   /** Maximum date allowed. */
   maxDate = new Date();
   /** Group Meeting form. */
-  groupMeetingForm: FormGroup;
+  groupMeetingForm: UntypedFormGroup;
   /** Calnedar Template Data */
   calendarTemplate: any;
   /** Group Id */
@@ -44,7 +44,7 @@ export class AttachGroupMeetingComponent implements OnInit {
    * @param {Router} router Router
    * @param {SettingsService} settingsService SettingsService
    */
-  constructor(private formBuilder: FormBuilder,
+  constructor(private formBuilder: UntypedFormBuilder,
               private groupsService: GroupsService,
               private dateUtils: Dates,
               private route: ActivatedRoute,
@@ -80,8 +80,8 @@ export class AttachGroupMeetingComponent implements OnInit {
   buildDependencies() {
     this.groupMeetingForm.get('repeating').valueChanges.subscribe((value: boolean) => {
       if (value) {
-        this.groupMeetingForm.addControl('frequency', new FormControl());
-        this.groupMeetingForm.addControl('interval', new FormControl());
+        this.groupMeetingForm.addControl('frequency', new UntypedFormControl());
+        this.groupMeetingForm.addControl('interval', new UntypedFormControl());
         this.groupMeetingForm.get('frequency').valueChanges.subscribe((frequency: any) => {
           this.groupMeetingForm.removeControl('repeatsOnDay');
           switch (frequency) {
@@ -90,7 +90,7 @@ export class AttachGroupMeetingComponent implements OnInit {
             break;
             case 2: // Weekly
               this.repetitionIntervals = ['1', '2', '3'];
-              this.groupMeetingForm.addControl('repeatsOnDay', new FormControl('', Validators.required));
+              this.groupMeetingForm.addControl('repeatsOnDay', new UntypedFormControl('', Validators.required));
             break;
             case 3: // Monthly
               this.repetitionIntervals = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11'];

src/app/groups/groups-view/group-actions/close-group/close-group.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { UntypedFormGroup, UntypedFormBuilder, Validators } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
 import { Dates } from 'app/core/utils/dates';
 
@@ -23,7 +23,7 @@ export class CloseGroupComponent implements OnInit {
   /** Maximum date allowed. */
   maxDate = new Date();
   /** Close Group form. */
-  closeGroupForm: FormGroup;
+  closeGroupForm: UntypedFormGroup;
   /** Group Closure Data */
   closureData: any;
   /** Group Id */
@@ -37,7 +37,7 @@ export class CloseGroupComponent implements OnInit {
    * @param {Router} router Router
    * @param {SettingsService} settingsService SettingsService
    */
-  constructor(private formBuilder: FormBuilder,
+  constructor(private formBuilder: UntypedFormBuilder,
               private groupsService: GroupsService,
               private dateUtils: Dates,
               private route: ActivatedRoute,

src/app/groups/groups-view/group-actions/edit-group-meeting-schedule/edit-group-meeting-schedule.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms';
+import { UntypedFormGroup, UntypedFormBuilder, Validators, FormControl } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
 import { Dates } from 'app/core/utils/dates';
 
@@ -23,7 +23,7 @@ export class EditGroupMeetingScheduleComponent implements OnInit {
   /** Maximum date allowed. */
   maxDate = new Date();
   /** Group Meeting form. */
-  groupEditMeetingScheduleForm: FormGroup;
+  groupEditMeetingScheduleForm: UntypedFormGroup;
   /** Calendar Template Data */
   calendarTemplate: any;
   /** Group Id */
@@ -42,7 +42,7 @@ export class EditGroupMeetingScheduleComponent implements OnInit {
    * @param {Router} router Router
    * @param {SettingsService} settingsService SettingsService
    */
-  constructor(private formBuilder: FormBuilder,
+  constructor(private formBuilder: UntypedFormBuilder,
               private groupsService: GroupsService,
               private dateUtils: Dates,
               private route: ActivatedRoute,

src/app/groups/groups-view/group-actions/edit-group-meeting/edit-group-meeting.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms';
+import { UntypedFormGroup, UntypedFormBuilder, Validators, UntypedFormControl } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
 import { Dates } from 'app/core/utils/dates';
 
@@ -23,7 +23,7 @@ export class EditGroupMeetingComponent implements OnInit {
   /** Maximum date allowed. */
   maxDate = new Date();
   /** Group Meeting form. */
-  groupEditMeetingForm: FormGroup;
+  groupEditMeetingForm: UntypedFormGroup;
   /** Calendar Template Data */
   calendarTemplate: any;
   /** Group Id */
@@ -46,7 +46,7 @@ export class EditGroupMeetingComponent implements OnInit {
    * @param {Router} router Router
    * @param {SettingsService} settingsService SettingsService
    */
-  constructor(private formBuilder: FormBuilder,
+  constructor(private formBuilder: UntypedFormBuilder,
               private groupsService: GroupsService,
               private dateUtils: Dates,
               private route: ActivatedRoute,
@@ -90,7 +90,7 @@ export class EditGroupMeetingComponent implements OnInit {
         break;
         case 2: // Weekly
           this.repetitionIntervals = ['1', '2', '3'];
-          this.groupEditMeetingForm.addControl('repeatsOnDay', new FormControl('', Validators.required));
+          this.groupEditMeetingForm.addControl('repeatsOnDay', new UntypedFormControl('', Validators.required));
           this.groupEditMeetingForm.get('repeatsOnDay').patchValue(this.calendarTemplate.repeatsOnDay.id);
         break;
         case 3: // Monthly

src/app/groups/groups-view/group-actions/group-assign-staff/group-assign-staff.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormBuilder } from '@angular/forms';
+import { UntypedFormGroup, UntypedFormBuilder } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
@@ -17,7 +17,7 @@ import { GroupsService } from 'app/groups/groups.service';
 export class GroupAssignStaffComponent implements OnInit {
 
   /** Group Assign Staff form. */
-  groupAssignStaffForm: FormGroup;
+  groupAssignStaffForm: UntypedFormGroup;
   /** Staff Data */
   staffData: any;
   /** Group Data */
@@ -30,7 +30,7 @@ export class GroupAssignStaffComponent implements OnInit {
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
    */
-  constructor(private formBuilder: FormBuilder,
+  constructor(private formBuilder: UntypedFormBuilder,
               private groupsService: GroupsService,
               private route: ActivatedRoute,
               private router: Router) {

src/app/groups/groups-view/group-actions/group-attendance/group-attendance.component.ts

@@ -2,7 +2,7 @@
 import { Component, OnInit } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { ActivatedRoute, Router } from '@angular/router';
-import { FormControl } from '@angular/forms';
+import { UntypedFormControl } from '@angular/forms';
 
 /** Custom Services */
 import { GroupsService } from 'app/groups/groups.service';
@@ -35,7 +35,7 @@ export class GroupAttendanceComponent implements OnInit {
   /** Columns to be displayed in member's attendance table. */
   displayedColumns: string[] = ['name', 'attendance'];
   /** Start Date Form Control */
-  meetingDate = new FormControl();
+  meetingDate = new UntypedFormControl();
   /** Meeting Dates Data */
   meetingDates: any[];
   /** Data source for client members table. */

src/app/groups/groups-view/group-actions/group-transfer-clients/group-transfer-clients.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit, AfterViewInit } from '@angular/core';
-import { FormGroup, FormBuilder, FormControl, Validators } from '@angular/forms';
+import { UntypedFormGroup, UntypedFormBuilder, FormControl, Validators } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
 
 /** Custom Services */
@@ -18,7 +18,7 @@ import { SettingsService } from 'app/settings/settings.service';
 export class GroupTransferClientsComponent implements OnInit, AfterViewInit {
 
   /** Transfer Clients form. */
-  transferClientsForm: FormGroup;
+  transferClientsForm: UntypedFormGroup;
   /** Group Data */
   groupData: any;
   /** Group data. */
@@ -36,7 +36,7 @@ export class GroupTransferClientsComponent implements OnInit, AfterViewInit {
    * @param {GroupsService} groupsService GroupsService.
    * @param {SettingsService} settingsService SettingsService
    */
-  constructor(private formBuilder: FormBuilder,
+  constructor(private formBuilder: UntypedFormBuilder,
               private route: ActivatedRoute,
               private router: Router,
               private groupsService: GroupsService,

src/app/groups/groups-view/group-actions/manage-group-members/manage-group-members.component.ts

@@ -1,6 +1,6 @@
 /** Angular Imports */
 import { Component, OnInit, AfterViewInit } from '@angular/core';
-import { FormGroup, FormBuilder, FormControl, Validators } from '@angular/forms';
+import { FormGroup, FormBuilder, UntypedFormControl, Validators } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
 
 /** Custom Dialogs */
@@ -28,7 +28,7 @@ export class ManageGroupMembersComponent implements AfterViewInit {
   /** Client Members. */
   clientMembers: any[] = [];
   /** Client Choice. */
-  clientChoice = new FormControl('');
+  clientChoice = new UntypedFormControl('');
 
   /**
    * Fetches group action data from `resolve`

src/app/groups/groups.component.ts

@@ -3,7 +3,7 @@ import { Component, OnInit, ViewChild, AfterViewInit } from '@angular/core';
 import { MatCheckbox } from '@angular/material/checkbox';
 import { MatPaginator } from '@angular/material/paginator';
 import { MatSort } from '@angular/material/sort';
-import { FormControl } from '@angular/forms';
+import { UntypedFormControl } from '@angular/forms';
 
 /** rxjs Imports */
 import { merge } from 'rxjs';
@@ -27,7 +27,7 @@ export class GroupsComponent implements OnInit, AfterViewInit {
   @ViewChild('showClosedGroups', { static: true }) showClosedGroups: MatCheckbox;
 
   /** Name form control. */
-  name = new FormControl();
+  name = new UntypedFormControl();
   /** Columns to be displayed in groups table. */
   displayedColumns =  ['name', 'accountNo', 'externalId', 'status', 'officeName'];
   /** Data source for groups table. */