Format date fields without patch form

src/app/clients/client-stepper/client-family-members-step/client-family-member-dialog/client-family-member-dialog.component.ts

@@ -2,10 +2,10 @@
 import { Component, OnInit, Inject } from '@angular/core';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
-import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { SettingsService } from 'app/settings/settings.service';
+import { Dates } from 'app/core/utils/dates';
 
 /**
  * Client Family Members Dialog
@@ -28,13 +28,13 @@ export class ClientFamilyMemberDialogComponent implements OnInit {
   /**
    * @param {MatDialogRef} dialogRef Client Family Member Dialog Reference
    * @param {FormBuilder} formBuilder Form Builder
-   * @param {DatePipe} datePipe Date Pipe
+   * @param {Dates} dateUtils Date Utils
    * @param {any} data Dialog Data
    * @param {SettingsService} settingsService Setting service
    */
   constructor(public dialogRef: MatDialogRef<ClientFamilyMemberDialogComponent>,
               private formBuilder: FormBuilder,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               @Inject(MAT_DIALOG_DATA) public data: any,
               private settingsService: SettingsService) { }
 
@@ -80,11 +80,14 @@ export class ClientFamilyMemberDialogComponent implements OnInit {
    * Returns Formatted Family Member
    */
   get familyMember() {
+    const familyMemberFormData = this.familyMemberForm.value;
     const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
-    // TODO: Update once language and date settings are setup
+    if (familyMemberFormData.dateOfBirth instanceof Date) {
+      familyMemberFormData.dateOfBirth = this.dateUtils.formatDate(familyMemberFormData.dateOfBirth, dateFormat);
+    }
     const familyMember = {
-      ...this.familyMemberForm.value,
+      ...familyMemberFormData,
       dateFormat,
       locale
     };
@@ -93,9 +96,6 @@ export class ClientFamilyMemberDialogComponent implements OnInit {
         delete familyMember[key];
       }
     }
-    if (familyMember.dateOfBirth) {
-      familyMember.dateOfBirth = this.datePipe.transform(familyMember.dateOfBirth, dateFormat);
-    }
     return familyMember;
   }
 

src/app/clients/client-stepper/client-general-step/client-general-step.component.ts

@@ -1,7 +1,7 @@
 /** Angular Imports */
 import { Component, OnInit, Input } from '@angular/core';
 import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms';
-import { DatePipe } from '@angular/common';
+import { Dates } from 'app/core/utils/dates';
 
 /** Custom Services */
 import { SettingsService } from 'app/settings/settings.service';
@@ -47,11 +47,11 @@ export class ClientGeneralStepComponent implements OnInit {
 
   /**
    * @param {FormBuilder} formBuilder Form Builder
-   * @param {DatePipe} datePipe Date Pipe
+   * @param {Dates} dateUtils Date Utils
    * @param {SettingsService} settingsService Setting service
    */
   constructor(private formBuilder: FormBuilder,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private settingsService: SettingsService) {
     this.setClientForm();
   }
@@ -148,26 +148,25 @@ export class ClientGeneralStepComponent implements OnInit {
     const generalDetails = this.createClientForm.value;
     const dateFormat = this.settingsService.dateFormat;
     const locale = this.settingsService.language.code;
-    // TODO: Update once language and date settings are setup
     for (const key in generalDetails) {
       if (generalDetails[key] === '' || key === 'addSavings') {
         delete generalDetails[key];
       }
     }
-    if (generalDetails.submittedOnDate) {
-      generalDetails.submittedOnDate = this.datePipe.transform(generalDetails.submittedOnDate, dateFormat);
+    if (generalDetails.submittedOnDate instanceof Date) {
+      generalDetails.submittedOnDate = this.dateUtils.formatDate(generalDetails.submittedOnDate, dateFormat);
     }
-    if (generalDetails.activationDate) {
-      generalDetails.activationDate = this.datePipe.transform(generalDetails.activationDate, dateFormat);
+    if (generalDetails.activationDate instanceof Date) {
+      generalDetails.activationDate = this.dateUtils.formatDate(generalDetails.activationDate, dateFormat);
     }
-    if (generalDetails.dateOfBirth) {
-      generalDetails.dateOfBirth = this.datePipe.transform(generalDetails.dateOfBirth, dateFormat);
+    if (generalDetails.dateOfBirth instanceof Date) {
+      generalDetails.dateOfBirth = this.dateUtils.formatDate(generalDetails.dateOfBirth, dateFormat);
     }
 
     if (generalDetails.clientNonPersonDetails && generalDetails.clientNonPersonDetails.incorpValidityTillDate) {
       generalDetails.clientNonPersonDetails = {
         ...generalDetails.clientNonPersonDetails,
-        incorpValidityTillDate: this.datePipe.transform(generalDetails.dateOfBirth, dateFormat),
+        incorpValidityTillDate: this.dateUtils.formatDate(generalDetails.dateOfBirth, dateFormat),
         dateFormat,
         locale
       };

src/app/clients/clients-view/charges/client-pay-charges/client-pay-charges.component.ts

@@ -2,10 +2,10 @@
 import { Component, OnInit } from '@angular/core';
 import { FormBuilder, Validators } from '@angular/forms';
 import { ActivatedRoute, Router } from '@angular/router';
-import { DatePipe } from '@angular/common';
 
 /** Custom Services. */
 import { ClientsService } from 'app/clients/clients.service';
+import { Dates } from 'app/core/utils/dates';
 import { SettingsService } from 'app/settings/settings.service';
 
 /**
@@ -38,7 +38,7 @@ export class ClientPayChargesComponent implements OnInit {
     private formBuilder: FormBuilder,
     private route: ActivatedRoute,
     private router: Router,
-    private datePipe: DatePipe,
+    private dateUtils: Dates,
     private settingsService: SettingsService
   ) {
     this.route.data.subscribe((data: { transactionData: any }) => {
@@ -64,15 +64,19 @@ export class ClientPayChargesComponent implements OnInit {
    * Submits Transaction form.
    */
   submit() {
-    const transactionDate = this.transactionForm.value.transactionDate;
-    const dateFormat = 'yyyy-MM-dd';
-    this.transactionForm.patchValue({
-      transactionDate: this.datePipe.transform(transactionDate, dateFormat)
-    });
-    const transactions = this.transactionForm.value;
-    transactions.locale = this.settingsService.language.code;
-    transactions.dateFormat = dateFormat;
-    this.clientsService.payClientCharge(this.transactionData.clientId, this.transactionData.id, transactions).subscribe(() => {
+    const transactionFormData = this.transactionForm.value;
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
+    const prevTransactionDate = this.transactionForm.value.transactionDate;
+    if (transactionFormData.transactionDate instanceof Date) {
+      transactionFormData.transactionDate = this.dateUtils.formatDate(prevTransactionDate, dateFormat);
+    }
+    const data = {
+      ...transactionFormData,
+      dateFormat,
+      locale
+    };
+    this.clientsService.payClientCharge(this.transactionData.clientId, this.transactionData.id, data).subscribe(() => {
       this.router.navigate(['../', 'general']);
     });
   }

src/app/clients/clients-view/client-actions/accept-client-transfer/accept-client-transfer.component.ts

@@ -5,6 +5,8 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { ClientsService } from 'app/clients/clients.service';
+import { Dates } from 'app/core/utils/dates';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Accept Client Transfer Component
@@ -26,11 +28,15 @@ export class AcceptClientTransferComponent implements OnInit {
   /**
    * @param {FormBuilder} formBuilder Form Builder
    * @param {ClientsService} clientsService Clients Service
+   * @param {SettingsService} settingsService Settings Service.
+   * @param {Dates} dateUtils Date Utils
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
    */
   constructor(private formBuilder: FormBuilder,
               private clientsService: ClientsService,
+              private settingsService: SettingsService,
+              private dateUtils: Dates,
               private route: ActivatedRoute,
               private router: Router) {
     this.route.data.subscribe((data: { clientActionData: any }) => {
@@ -61,8 +67,17 @@ export class AcceptClientTransferComponent implements OnInit {
    * if successful redirects to the client.
    */
   submit() {
+    const acceptClientTransferFormData = this.acceptClientTransferForm.value;
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
+    const prevTransferDate: Date = this.acceptClientTransferForm.value.transferDate;
+    if (acceptClientTransferFormData.transferDate instanceof Date) {
+      acceptClientTransferFormData.transferDate = this.dateUtils.formatDate(prevTransferDate, dateFormat);
+    }
     const data = {
-      ...this.acceptClientTransferForm.value,
+      ...acceptClientTransferFormData,
+      dateFormat,
+      locale
     };
     this.clientsService.executeClientCommand(this.clientId, 'acceptTransfer', data).subscribe(() => {
       this.router.navigate(['../../'], { relativeTo: this.route });

src/app/clients/clients-view/client-actions/activate-client/activate-client.component.ts

@@ -1,11 +1,11 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
-import { DatePipe } from '@angular/common';
 import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { ClientsService } from 'app/clients/clients.service';
+import { Dates } from 'app/core/utils/dates';
 import { SettingsService } from 'app/settings/settings.service';
 
 /**
@@ -30,14 +30,14 @@ export class ActivateClientComponent implements OnInit {
   /**
    * @param {FormBuilder} formBuilder Form Builder
    * @param {clientsService} clientsService Cliens Service
-   * @param {DatePipe} datePipe Date Pipe
+   * @param {DatePipe} datePipe Date Utils
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
    * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
               private clientsService: ClientsService,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
@@ -65,15 +65,15 @@ export class ActivateClientComponent implements OnInit {
    * if successful redirects to the client.
    */
   submit() {
-    // TODO: Update once language and date settings are setup
+    const activateClientFormData = this.activateClientForm.value;
     const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
     const prevActivationDate: Date = this.activateClientForm.value.activationDate;
-    this.activateClientForm.patchValue({
-      activationDate: this.datePipe.transform(prevActivationDate, dateFormat),
-    });
+    if (activateClientFormData.activationDate instanceof Date) {
+      activateClientFormData.activationDate = this.dateUtils.formatDate(prevActivationDate, dateFormat);
+    }
     const data = {
-      ...this.activateClientForm.value,
+      ...activateClientFormData,
       dateFormat,
       locale
     };

src/app/clients/clients-view/client-actions/add-client-charge/add-client-charge.component.html

@@ -23,7 +23,7 @@
 
             <mat-form-field>
               <mat-label>Amount</mat-label>
-              <input type=number required matInput formControlName="amount" />
+              <input type="number" required matInput formControlName="amount" />
               <mat-error *ngIf="clientChargeForm.controls.amount.hasError('required')">
                 Amount is <strong>required</strong>
               </mat-error>

src/app/clients/clients-view/client-actions/add-client-charge/add-client-charge.component.ts

@@ -2,10 +2,10 @@
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
-import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { ClientsService } from 'app/clients/clients.service';
+import { Dates } from 'app/core/utils/dates';
 import { SettingsService } from 'app/settings/settings.service';
 
 /**
@@ -36,7 +36,7 @@ export class AddClientChargeComponent implements OnInit {
    * @param {FormBuilder} formBuilder Form Builder
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
-   * @param {DatePipe} datePipe Date Pipe
+   * @param {DatePipe} datePipe Date Utils
    * @param {ClientsService} clientsService Clients Service
    * @param {SettingsService} settingsService Setting service
    */
@@ -44,7 +44,7 @@ export class AddClientChargeComponent implements OnInit {
     private formBuilder: FormBuilder,
     private route: ActivatedRoute,
     private router: Router,
-    private datePipe: DatePipe,
+    private dateUtils: Dates,
     private clientsService: ClientsService,
     private settingsService: SettingsService
   ) {
@@ -124,14 +124,14 @@ export class AddClientChargeComponent implements OnInit {
         clientCharge.monthDayFormat = monthDayFormat;
         if (clientCharge.feeOnMonthDay) {
           const prevDate = this.clientChargeForm.value.feeOnMonthDay;
-          clientCharge.feeOnMonthDay = this.datePipe.transform(prevDate, monthDayFormat);
+          clientCharge.feeOnMonthDay = this.dateUtils.formatDate(prevDate, monthDayFormat);
         }
       } else {
         const dateFormat = this.settingsService.dateFormat;
         clientCharge.dateFormat = dateFormat;
         if (clientCharge.dueDate) {
           const prevDate = this.clientChargeForm.value.dueDate;
-          clientCharge.dueDate = this.datePipe.transform(prevDate, dateFormat);
+          clientCharge.dueDate = this.dateUtils.formatDate(prevDate, dateFormat);
         }
       }
     }

src/app/clients/clients-view/client-actions/close-client/close-client.component.ts

@@ -1,11 +1,11 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
-import { DatePipe } from '@angular/common';
 import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { ClientsService } from 'app/clients/clients.service';
+import { Dates } from 'app/core/utils/dates';
 import { SettingsService } from 'app/settings/settings.service';
 
 /**
@@ -32,14 +32,14 @@ export class CloseClientComponent implements OnInit {
   /**
    * @param {FormBuilder} formBuilder Form Builder
    * @param {ClientsService} clientsService Clients Service
-   * @param {DatePipe} datePipe Date Pipe
+   * @param {DatePipe} datePipe Date Utils
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
    * @param {SettingsService} settingsService Setting service
    */
   constructor(private formBuilder: FormBuilder,
               private clientsService: ClientsService,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
@@ -67,15 +67,15 @@ export class CloseClientComponent implements OnInit {
    * Submits the form and closes the client.
    */
   submit() {
-    // TODO: Update once language and date settings are setup
+    const closeClientFormData = this.closeClientForm.value;
     const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
     const prevClosedDate: Date = this.closeClientForm.value.closureDate;
-    this.closeClientForm.patchValue({
-      closureDate: this.datePipe.transform(prevClosedDate, dateFormat),
-    });
+    if (closeClientFormData.closureDate instanceof Date) {
+      closeClientFormData.closureDate = this.dateUtils.formatDate(prevClosedDate, dateFormat);
+    }
     const data = {
-      ...this.closeClientForm.value,
+      ...closeClientFormData,
       dateFormat,
       locale
     };

src/app/clients/clients-view/client-actions/reactivate-client/reactivate-client.component.ts

@@ -1,11 +1,11 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
-import { DatePipe } from '@angular/common';
 import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { ClientsService } from 'app/clients/clients.service';
+import { Dates } from 'app/core/utils/dates';
 import { SettingsService } from 'app/settings/settings.service';
 
 /**
@@ -30,14 +30,14 @@ export class ReactivateClientComponent implements OnInit {
   /**
    * @param {FormBuilder} formBuilder Form Builder
    * @param {clientsService} clientsService Clients Service
-   * @param {DatePipe} datePipe Date Pipe
+   * @param {Dates} dateUtils Date Utils
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
    * @param {SettingsService} settingsService Setting service
    */
   constructor(private formBuilder: FormBuilder,
               private clientsService: ClientsService,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
@@ -65,15 +65,15 @@ export class ReactivateClientComponent implements OnInit {
    * if successful redirects to the client.
    */
   submit() {
-    // TODO: Update once language and date settings are setup
+    const reactivateClientFormData = this.reactivateClientForm.value;
     const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
     const prevReactivationDate: Date = this.reactivateClientForm.value.reactivationDate;
-    this.reactivateClientForm.patchValue({
-      reactivationDate: this.datePipe.transform(prevReactivationDate, dateFormat),
-    });
+    if (reactivateClientFormData.closureDate instanceof Date) {
+      reactivateClientFormData.reactivationDate = this.dateUtils.formatDate(prevReactivationDate, dateFormat);
+    }
     const data = {
-      ...this.reactivateClientForm.value,
+      ...reactivateClientFormData,
       dateFormat,
       locale
     };

src/app/clients/clients-view/client-actions/reject-client-transfer/reject-client-transfer.component.ts

@@ -5,6 +5,8 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { ClientsService } from 'app/clients/clients.service';
+import { Dates } from 'app/core/utils/dates';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Reject Client Transfer Component
@@ -31,6 +33,8 @@ export class RejectClientTransferComponent implements OnInit {
    */
   constructor(private formBuilder: FormBuilder,
               private clientsService: ClientsService,
+              private settingsService: SettingsService,
+              private dateUtils: Dates,
               private route: ActivatedRoute,
               private router: Router) {
     this.route.data.subscribe((data: { clientActionData: any }) => {
@@ -58,8 +62,17 @@ export class RejectClientTransferComponent implements OnInit {
    * if successful redirects to the client.
    */
   submit() {
+    const rejectClientTransferFormData = this.rejectClientTransferForm.value;
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
+    const prevTransferDate: Date = this.rejectClientTransferForm.value.transferDate;
+    if (rejectClientTransferFormData.transferDate instanceof Date) {
+      rejectClientTransferFormData.transferDate = this.dateUtils.formatDate(prevTransferDate, dateFormat);
+    }
     const data = {
-      ...this.rejectClientTransferForm.value,
+      ...rejectClientTransferFormData,
+      dateFormat,
+      locale
     };
     this.clientsService.executeClientCommand(this.clientId, 'rejectTransfer', data).subscribe(() => {
       this.router.navigate(['../../'], { relativeTo: this.route });

src/app/clients/clients-view/client-actions/reject-client/reject-client.component.ts

@@ -1,11 +1,11 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
-import { DatePipe } from '@angular/common';
 import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { ClientsService } from 'app/clients/clients.service';
+import { Dates } from 'app/core/utils/dates';
 import { SettingsService } from 'app/settings/settings.service';
 
 /**
@@ -32,14 +32,14 @@ export class RejectClientComponent implements OnInit {
   /**
    * @param {FormBuilder} formBuilder Form Builder
    * @param {ClientsService} clientsService Clients Service
-   * @param {DatePipe} datePipe Date Pipe
+   * @param {Dates} dateUtils Date Utils
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
    * @param {SettingsService} settingsService Setting service
    */
   constructor(private formBuilder: FormBuilder,
               private clientsService: ClientsService,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
@@ -67,15 +67,15 @@ export class RejectClientComponent implements OnInit {
    * Submits the form and rejects the client.
    */
   submit() {
-    // TODO: Update once language and date settings are setup
+    const rejectClientFormData = this.rejectClientForm.value;
     const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
     const prevRejectedDate: Date = this.rejectClientForm.value.rejectionDate;
-    this.rejectClientForm.patchValue({
-      rejectionDate: this.datePipe.transform(prevRejectedDate, dateFormat),
-    });
+    if (rejectClientFormData.rejectionDate instanceof Date) {
+      rejectClientFormData.rejectionDate = this.dateUtils.formatDate(prevRejectedDate, dateFormat);
+    }
     const data = {
-      ...this.rejectClientForm.value,
+      ...rejectClientFormData,
       dateFormat,
       locale
     };

src/app/clients/clients-view/client-actions/transfer-client/transfer-client.component.ts

@@ -1,11 +1,11 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
-import { DatePipe } from '@angular/common';
 import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { ClientsService } from 'app/clients/clients.service';
+import { Dates } from 'app/core/utils/dates';
 import { SettingsService } from 'app/settings/settings.service';
 
 /**
@@ -32,14 +32,14 @@ export class TransferClientComponent implements OnInit {
   /**
    * @param {FormBuilder} formBuilder Form Builder
    * @param {ClientsService} clientsService Clients Service
-   * @param {DatePipe} datePipe Date Pipe
+   * @param {Dates} dateUtils Date Utils
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
    * @param {SettingsService} settingsService Setting service
    */
   constructor(private formBuilder: FormBuilder,
               private clientsService: ClientsService,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
@@ -68,15 +68,15 @@ export class TransferClientComponent implements OnInit {
    * Submits the form and transfers the client.
    */
   submit() {
-    // TODO: Update once language and date settings are setup
+    const transferClientFormData = this.transferClientForm.value;
     const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
-    const prevClosedDate: Date = this.transferClientForm.value.transferDate;
-    this.transferClientForm.patchValue({
-      transferDate: this.datePipe.transform(prevClosedDate, dateFormat),
-    });
+    const prevTransferDate: Date = this.transferClientForm.value.transferDate;
+    if (transferClientFormData.transferDate instanceof Date) {
+      transferClientFormData.transferDate = this.dateUtils.formatDate(prevTransferDate, dateFormat);
+    }
     const data = {
-      ...this.transferClientForm.value,
+      ...transferClientFormData,
       dateFormat,
       locale
     };

src/app/clients/clients-view/client-actions/undo-client-rejection/undo-client-rejection.component.ts

@@ -1,11 +1,11 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
-import { DatePipe } from '@angular/common';
 import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { ClientsService } from 'app/clients/clients.service';
+import { Dates } from 'app/core/utils/dates';
 import { SettingsService } from 'app/settings/settings.service';
 
 /**
@@ -30,13 +30,13 @@ export class UndoClientRejectionComponent implements OnInit {
   /**
    * @param {FormBuilder} formBuilder Form Builder
    * @param {clientsService} clientsService Cliens Service
-   * @param {DatePipe} datePipe Date Pipe
+   * @param {Dates} dateUtils Date Utils
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
    */
   constructor(private formBuilder: FormBuilder,
               private clientsService: ClientsService,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
@@ -64,15 +64,15 @@ export class UndoClientRejectionComponent implements OnInit {
    * if successful redirects to the client.
    */
   submit() {
-    // TODO: Update once language and date settings are setup
+    const undoClientRejectionFormData = this.undoClientRejectionForm.value;
     const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
     const prevReopenedDate: Date = this.undoClientRejectionForm.value.reopenedDate;
-    this.undoClientRejectionForm.patchValue({
-      reopenedDate: this.datePipe.transform(prevReopenedDate, dateFormat),
-    });
+    if (undoClientRejectionFormData.reopenedDate instanceof Date) {
+      undoClientRejectionFormData.reopenedDate = this.dateUtils.formatDate(prevReopenedDate, dateFormat);
+    }
     const data = {
-      ...this.undoClientRejectionForm.value,
+      ...undoClientRejectionFormData,
       dateFormat,
       locale
     };

src/app/clients/clients-view/client-actions/undo-client-transfer/undo-client-transfer.component.ts

@@ -5,6 +5,8 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { ClientsService } from 'app/clients/clients.service';
+import { Dates } from 'app/core/utils/dates';
+import { SettingsService } from 'app/settings/settings.service';
 
 /**
  * Undo Client Transfer Component
@@ -31,6 +33,8 @@ export class UndoClientTransferComponent implements OnInit {
    */
   constructor(private formBuilder: FormBuilder,
               private clientsService: ClientsService,
+              private settingsService: SettingsService,
+              private dateUtils: Dates,
               private route: ActivatedRoute,
               private router: Router) {
     this.route.data.subscribe((data: { clientActionData: any }) => {
@@ -61,8 +65,17 @@ export class UndoClientTransferComponent implements OnInit {
    * if successful redirects to the client.
    */
   submit() {
+    const undoClientTransferFormData = this.undoClientTransferForm.value;
+    const locale = this.settingsService.language.code;
+    const dateFormat = this.settingsService.dateFormat;
+    const prevTransferDate: Date = this.undoClientTransferForm.value.transferDate;
+    if (undoClientTransferFormData.transferDate instanceof Date) {
+      undoClientTransferFormData.transferDate = this.dateUtils.formatDate(prevTransferDate, dateFormat);
+    }
     const data = {
-      ...this.undoClientTransferForm.value,
+      ...undoClientTransferFormData,
+      dateFormat,
+      locale
     };
     this.clientsService.executeClientCommand(this.clientId, 'withdrawTransfer', data).subscribe(() => {
       this.router.navigate(['../../'], { relativeTo: this.route });

src/app/clients/clients-view/client-actions/withdraw-client/withdraw-client.component.ts

@@ -1,11 +1,11 @@
 /** Angular Imports */
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
-import { DatePipe } from '@angular/common';
 import { ActivatedRoute, Router } from '@angular/router';
 
 /** Custom Services */
 import { ClientsService } from 'app/clients/clients.service';
+import { Dates } from 'app/core/utils/dates';
 import { SettingsService } from 'app/settings/settings.service';
 
 /**
@@ -32,14 +32,14 @@ export class WithdrawClientComponent implements OnInit {
   /**
    * @param {FormBuilder} formBuilder Form Builder
    * @param {ClientsService} clientsService Clients Service
-   * @param {DatePipe} datePipe Date Pipe
+   * @param {Dates} dateUtils Date Utils
    * @param {ActivatedRoute} route Activated Route
    * @param {Router} router Router
    * @param {SettingsService} settingsService Setting service
    */
   constructor(private formBuilder: FormBuilder,
               private clientsService: ClientsService,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private route: ActivatedRoute,
               private router: Router,
               private settingsService: SettingsService) {
@@ -67,15 +67,15 @@ export class WithdrawClientComponent implements OnInit {
    * Submits the form and withdraws the client.
    */
   submit() {
-    // TODO: Update once language and date settings are setup
+    const withdrawClientFormData = this.withdrawClientForm.value;
     const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
     const prevWithdrawalDate: Date = this.withdrawClientForm.value.withdrawalDate;
-    this.withdrawClientForm.patchValue({
-      withdrawalDate: this.datePipe.transform(prevWithdrawalDate, dateFormat),
-    });
+    if (withdrawClientFormData.withdrawalDate instanceof Date) {
+      withdrawClientFormData.withdrawalDate = this.dateUtils.formatDate(prevWithdrawalDate, dateFormat);
+    }
     const data = {
-      ...this.withdrawClientForm.value,
+      ...withdrawClientFormData,
       dateFormat,
       locale
     };

src/app/clients/clients-view/family-members-tab/add-family-member/add-family-member.component.ts

@@ -2,11 +2,11 @@
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
-import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { ClientsService } from '../../../clients.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { Dates } from 'app/core/utils/dates';
 
 /**
  * Add Family Member Component
@@ -31,14 +31,14 @@ export class AddFamilyMemberComponent implements OnInit {
 
   /**
    * @param {FormBuilder} formBuilder FormBuilder
-   * @param {DatePipe} datePipe Date Pipe
+   * @param {DatePipe} datePipe Date Utils
    * @param {Router} router Router
    * @param {Route} route Route
    * @param {ClientsService} clientsService Clients Service
    * @param {SettingsService} settingsService Setting service
    */
   constructor(private formBuilder: FormBuilder,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private router: Router,
               private route: ActivatedRoute,
               private clientsService: ClientsService,
@@ -77,16 +77,19 @@ export class AddFamilyMemberComponent implements OnInit {
    * Submits the form and adds the family member
    */
   submit() {
-    const prevDateOfBirth: Date = this.addFamilyMemberForm.value.dateOfBirth;
-    // TODO: Update once language and date settings are setup
+    const addFamilyMemberFormData = this.addFamilyMemberForm.value;
+    const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
-    this.addFamilyMemberForm.patchValue({
-      dateOfBirth: this.datePipe.transform(prevDateOfBirth, dateFormat)
-    });
-    const familyMemberData = this.addFamilyMemberForm.value;
-    familyMemberData.locale = this.settingsService.language.code;
-    familyMemberData.dateFormat = dateFormat;
-    this.clientsService.addFamilyMember(this.clientId, familyMemberData).subscribe(res => {
+    const prevDateOfBirth: Date = this.addFamilyMemberForm.value.dateOfBirth;
+    if (addFamilyMemberFormData.dateOfBirth instanceof Date) {
+      addFamilyMemberFormData.dateOfBirth = this.dateUtils.formatDate(prevDateOfBirth, dateFormat);
+    }
+    const data = {
+      ...addFamilyMemberFormData,
+      dateFormat,
+      locale
+    };
+    this.clientsService.addFamilyMember(this.clientId, data).subscribe(res => {
       this.router.navigate(['../'], { relativeTo: this.route });
     });
   }

src/app/clients/clients-view/family-members-tab/edit-family-member/edit-family-member.component.ts

@@ -2,11 +2,11 @@
 import { Component, OnInit } from '@angular/core';
 import { FormGroup, FormBuilder, Validators } from '@angular/forms';
 import { Router, ActivatedRoute } from '@angular/router';
-import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { ClientsService } from '../../../clients.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { Dates } from 'app/core/utils/dates';
 
 /**
  * Edit Family Member Component
@@ -31,14 +31,14 @@ export class EditFamilyMemberComponent implements OnInit {
 
   /**
    * @param {FormBuilder} formBuilder Form Builder
-   * @param {DatePipe} datePipe DatePipe
+   * @param {Dates} dateUtils DatePipe
    * @param {Router} router Router
    * @param {ActivatedRoute} route Route
    * @param {ClientsService} clientsService Clients Service
    * @param {SettingsService} settingsService Setting service
    */
   constructor(private formBuilder: FormBuilder,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private router: Router,
               private route: ActivatedRoute,
               private clientsService: ClientsService,
@@ -69,7 +69,7 @@ export class EditFamilyMemberComponent implements OnInit {
       'genderId': [familyMember.genderId, Validators.required],
       'professionId': [familyMember.professionId],
       'maritalStatusId': [familyMember.maritalStatusId],
-      'dateOfBirth': [this.datePipe.transform(familyMember.dateOfBirth, 'yyyy-MM-dd'), Validators.required]
+      'dateOfBirth': [this.dateUtils.formatDate(familyMember.dateOfBirth, 'yyyy-MM-dd'), Validators.required]
     });
   }
 
@@ -77,16 +77,19 @@ export class EditFamilyMemberComponent implements OnInit {
    * Submits the form and updates the client family member.
    */
   submit() {
-    const prevDateOfBirth: Date = this.editFamilyMemberForm.value.dateOfBirth;
-    // TODO: Update once language and date settings are setup
+    const editFamilyMemberFormData = this.editFamilyMemberForm.value;
+    const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
-    this.editFamilyMemberForm.patchValue({
-      dateOfBirth: this.datePipe.transform(prevDateOfBirth, dateFormat)
-    });
-    const familyMemberData = this.editFamilyMemberForm.value;
-    familyMemberData.locale = this.settingsService.language.code;
-    familyMemberData.dateFormat = dateFormat;
-    this.clientsService.editFamilyMember(this.familyMemberDetails.clientId, this.familyMemberDetails.id, familyMemberData).subscribe(res => {
+    const prevDateOfBirth: Date = this.editFamilyMemberForm.value.dateOfBirth;
+    if (editFamilyMemberFormData.dateOfBirth instanceof Date) {
+      editFamilyMemberFormData.dateOfBirth = this.dateUtils.formatDate(prevDateOfBirth, dateFormat);
+    }
+    const data = {
+      ...editFamilyMemberFormData,
+      dateFormat,
+      locale
+    };
+    this.clientsService.editFamilyMember(this.familyMemberDetails.clientId, this.familyMemberDetails.id, data).subscribe(res => {
       this.router.navigate(['../../'], { relativeTo: this.route });
     });
   }

src/app/clients/edit-client/edit-client.component.ts

@@ -2,11 +2,11 @@
 import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { FormBuilder, FormGroup, Validators, FormControl } from '@angular/forms';
-import { DatePipe } from '@angular/common';
 
 /** Custom Services */
 import { ClientsService } from '../clients.service';
 import { SettingsService } from 'app/settings/settings.service';
+import { Dates } from 'app/core/utils/dates';
 
 /**
  * Edit Client Component
@@ -51,14 +51,14 @@ export class EditClientComponent implements OnInit {
    * @param {ActivatedRoute} route ActivatedRoute
    * @param {Router} router Router
    * @param {ClientsService} clientsService Clients Service
-   * @param {DatePipe} datePipe Date Pipe
+   * @param {Dates} dateUtils Date Utils
    * @param {SettingsService} settingsService Settings Service
    */
   constructor(private formBuilder: FormBuilder,
               private route: ActivatedRoute,
               private router: Router,
               private clientsService: ClientsService,
-              private datePipe: DatePipe,
+              private dateUtils: Dates,
               private settingsService: SettingsService) {
     this.route.data.subscribe((data: { clientDataAndTemplate: any }) => {
       this.clientDataAndTemplate = data.clientDataAndTemplate;
@@ -158,13 +158,12 @@ export class EditClientComponent implements OnInit {
   submit() {
     const locale = this.settingsService.language.code;
     const dateFormat = this.settingsService.dateFormat;
-    // TODO: Update once language and date settings are setup
     const editClientFormValue: any = this.editClientForm.getRawValue();
     const clientData = {
       ...editClientFormValue,
-      dateOfBirth: editClientFormValue.dateOfBirth && this.datePipe.transform(editClientFormValue.dateOfBirth, dateFormat),
-      submittedOnDate: editClientFormValue.submittedOnDate && this.datePipe.transform(editClientFormValue.submittedOnDate, dateFormat),
-      activationDate: this.datePipe.transform(editClientFormValue.activationDate, dateFormat),
+      dateOfBirth: editClientFormValue.dateOfBirth && this.dateUtils.formatDate(editClientFormValue.dateOfBirth, dateFormat),
+      submittedOnDate: editClientFormValue.submittedOnDate && this.dateUtils.formatDate(editClientFormValue.submittedOnDate, dateFormat),
+      activationDate: this.dateUtils.formatDate(editClientFormValue.activationDate, dateFormat),
       dateFormat,
       locale
     };
@@ -172,7 +171,7 @@ export class EditClientComponent implements OnInit {
     if (editClientFormValue.clientNonPersonDetails) {
       clientData.clientNonPersonDetails = {
         ...editClientFormValue.clientNonPersonDetails,
-        incorpValidityTillDate: editClientFormValue.clientNonPersonDetails.incorpValidityTillDate && this.datePipe.transform(editClientFormValue.clientNonPersonDetails.incorpValidityTillDate, dateFormat),
+        incorpValidityTillDate: editClientFormValue.clientNonPersonDetails.incorpValidityTillDate && this.dateUtils.formatDate(editClientFormValue.clientNonPersonDetails.incorpValidityTillDate, dateFormat),
         dateFormat,
         locale
       };