Merge pull request #1447 from josehernandezfintecheandomx/enhancement/dateformat_pipe

UI is broken in dates parsing in Safari

src/app/loans/loans-account-stepper/loans-account-charges-step/loans-account-charges-step.component.html

@@ -55,10 +55,10 @@
       <td mat-cell *matCellDef="let charge">
         <span
           *ngIf="charge.chargeTimeType.value === 'Specified due date' || charge.chargeTimeType.value === 'Weekly Fee'">
-          {{(charge.dueDate | date) || 'Unassigned'}}
+          {{(charge.dueDate  | dateFormat) || 'Unassigned'}}
         </span>
         <span *ngIf="charge.chargeTimeType.value === 'Monthly Fee' || charge.chargeTimeType.value === 'Annual Fee'">
-          {{(charge.feeOnMonthDay | date) || 'Unassigned'}}
+          {{(charge.feeOnMonthDay  | dateFormat) || 'Unassigned'}}
         </span>
         <span
           *ngIf="!(charge.chargeTimeType.value === 'Monthly Fee' || charge.chargeTimeType.value === 'Annual Fee'

src/app/loans/loans-account-stepper/loans-account-preview-step/loans-account-preview-step.component.html

@@ -28,12 +28,12 @@
 
   <div fxFlexFill>
     <span fxFlex="40%">Submitted on:</span>
-    <span fxFlex="60%">{{ loansAccount.submittedOnDate | date }}</span>
+    <span fxFlex="60%">{{ loansAccount.submittedOnDate  | dateFormat }}</span>
   </div>
 
   <div fxFlexFill>
     <span fxFlex="40%">Disbursement on:</span>
-    <span fxFlex="60%">{{ loansAccount.expectedDisbursementDate | date }}</span>
+    <span fxFlex="60%">{{ loansAccount.expectedDisbursementDate  | dateFormat }}</span>
   </div>
 
   <div fxFlexFill *ngIf="loansAccount.externalId">
@@ -71,12 +71,12 @@
 
   <div fxFlexFill *ngIf="loansAccount.repaymentsStartingFromDate">
     <span fxFlex="40%">First repayment on:</span>
-    <span fxFlex="60%">{{ loansAccount.repaymentsStartingFromDate | date }}</span>
+    <span fxFlex="60%">{{ loansAccount.repaymentsStartingFromDate  | dateFormat }}</span>
   </div>
 
   <div fxFlexFill *ngIf="loansAccount.interestChargedFromDate">
     <span fxFlex="40%">Interest charged from:</span>
-    <span fxFlex="60%">{{ loansAccount.interestChargedFromDate | date }}</span>
+    <span fxFlex="60%">{{ loansAccount.interestChargedFromDate  | dateFormat }}</span>
   </div>
 
   <div fxFlexFill *ngIf="loansAccount.interestRatePerPeriod">
@@ -204,10 +204,10 @@
         <td mat-cell *matCellDef="let charge">
           <span
             *ngIf="charge.chargeTimeType.value === 'Specified due date' || charge.chargeTimeType.value === 'Weekly Fee'">
-            {{(charge.dueDate | date) || 'Unassigned'}}
+            {{(charge.dueDate  | dateFormat) || 'Unassigned'}}
           </span>
           <span *ngIf="charge.chargeTimeType.value === 'Monthly Fee' || charge.chargeTimeType.value === 'Annual Fee'">
-            {{(charge.feeOnMonthDay | date) || 'Unassigned'}}
+            {{(charge.feeOnMonthDay  | dateFormat) || 'Unassigned'}}
           </span>
           <span
             *ngIf="!(charge.chargeTimeType.value === 'Monthly Fee' || charge.chargeTimeType.value === 'Annual Fee'

src/app/loans/loans-view/account-details/account-details.component.html

@@ -73,22 +73,22 @@
 
         <div fxFlexFill>
             <span fxFlex="50%"> Submitted on</span>
-            <span fxFlex="50%"> {{loanDetails.timeline.submittedOnDate | date }} </span>
+            <span fxFlex="50%"> {{loanDetails.timeline.submittedOnDate  | dateFormat }} </span>
         </div>
 
         <div fxFlexFill>
             <span fxFlex="50%"> Approved on</span>
-            <span fxFlex="50%"> {{loanDetails.timeline.approvedOnDate | date }} </span>
+            <span fxFlex="50%"> {{loanDetails.timeline.approvedOnDate  | dateFormat }} </span>
         </div>
 
         <div fxFlexFill>
             <span fxFlex="50%"> Disbursed on</span>
-            <span fxFlex="50%"> {{loanDetails.timeline.actualDisbursementDate | date }} </span>
+            <span fxFlex="50%"> {{loanDetails.timeline.actualDisbursementDate  | dateFormat }} </span>
         </div>
 
         <div fxFlexFill>
             <span fxFlex="50%"> Matures on</span>
-            <span fxFlex="50%"> {{loanDetails.timeline.expectedMaturityDate | date }} </span>
+            <span fxFlex="50%"> {{loanDetails.timeline.expectedMaturityDate  | dateFormat }} </span>
         </div>
 
         <div fxFlexFill *ngIf="loanDetails.canDefineInstallmentAmount">

src/app/loans/loans-view/charges-tab/charges-tab.component.html

@@ -22,7 +22,7 @@
 
       <ng-container matColumnDef="dueasof">
         <th mat-header-cell *matHeaderCellDef mat-sort-header> Due as of </th>
-        <td mat-cell *matCellDef="let charge"> {{ charge.dueDate| date }} </td>
+        <td mat-cell *matCellDef="let charge"> {{ charge.dueDate | dateFormat }} </td>
       </ng-container>
 
       <ng-container matColumnDef="calculationtype">

src/app/loans/loans-view/floating-interest-rates/floating-interest-rates.component.html

@@ -4,7 +4,7 @@
 
     <ng-container matColumnDef="fromDate">
       <th mat-header-cell *matHeaderCellDef> From Date </th>
-      <td mat-cell *matCellDef="let ele"> {{ ele.fromDate | date}} </td>
+      <td mat-cell *matCellDef="let ele"> {{ ele.fromDate  | dateFormat}} </td>
     </ng-container>
 
     <ng-container matColumnDef="interestRate">

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

@@ -6,7 +6,7 @@
       <p>
         # of Repayments :{{loanDetails?.numberOfRepayments}}
       <p>
-        Maturity Date :{{loanDetails?.timeline.expectedMaturityDate | date}}
+        Maturity Date :{{loanDetails?.timeline.expectedMaturityDate  | dateFormat}}
       </p>
     </div>
   </ng-container>
@@ -71,7 +71,7 @@
         <th mat-header-cell *matHeaderCellDef> Value </th>
         <td mat-cell *matCellDef="let ele"> 
           <ng-container *ngIf="ele.key === 'Disbursement Date'" >
-            <span *ngIf="loanDetails.timeline.actualDisbursementDate"> {{loanDetails.timeline.actualDisbursementDate | date}} </span>
+            <span *ngIf="loanDetails.timeline.actualDisbursementDate"> {{loanDetails.timeline.actualDisbursementDate  | dateFormat}} </span>
             <span *ngIf="!loanDetails.timeline.actualDisbursementDate"> Not Available </span>
           </ng-container>
 
@@ -126,7 +126,7 @@
         <th mat-header-cell *matHeaderCellDef> Value </th>
         <td mat-cell *matCellDef="let ele"> 
           <ng-container *ngIf="ele.key === 'Disbursement Date'" >
-            <span *ngIf="loanDetails.timeline.actualDisbursementDate"> {{loanDetails.timeline.actualDisbursementDate | date}} </span>
+            <span *ngIf="loanDetails.timeline.actualDisbursementDate"> {{loanDetails.timeline.actualDisbursementDate  | dateFormat}} </span>
             <span *ngIf="!loanDetails.timeline.actualDisbursementDate"> Not Available </span>
           </ng-container>
 

src/app/loans/loans-view/loan-tranche-details/loan-tranche-details.component.html

@@ -22,14 +22,14 @@
 
     <ng-container matColumnDef="expected disbursement on">
       <th mat-header-cell *matHeaderCellDef> Expected Disbursement On </th>
-      <td mat-cell *matCellDef="let ele"> {{ ele.expectedDisbursementDate | date}} </td>
+      <td mat-cell *matCellDef="let ele"> {{ ele.expectedDisbursementDate  | dateFormat}} </td>
     </ng-container>
 
     <ng-container matColumnDef="disbursed on">
       <th mat-header-cell *matHeaderCellDef> Disbursed On </th>
       <td mat-cell *matCellDef="let ele">
         <span *ngIf="ele.actualDisbursementDate">
-          {{ ele.actualDisbursementDate | date }}
+          {{ ele.actualDisbursementDate  | dateFormat }}
         </span>
       </td>
     </ng-container>
@@ -63,7 +63,7 @@
 
       <ng-container matColumnDef="emi amount variation from">
         <th mat-header-cell *matHeaderCellDef> Applicable From Date </th>
-        <td mat-cell *matCellDef="let ele"> {{ ele.termVariationApplicableFrom | date}} </td>
+        <td mat-cell *matCellDef="let ele"> {{ ele.termVariationApplicableFrom  | dateFormat}} </td>
       </ng-container>
   
       <ng-container matColumnDef="fixed emi amount">

src/app/loans/loans-view/notes-tab/notes-tab.component.html

@@ -17,7 +17,7 @@
       <h3 matLine>{{loanNote.note}} </h3>
       <p matLine>
         <span>Created by: {{loanNote.createdByUsername}}</span><br />
-        <span>Date: {{loanNote.createdOn | date}}</span>
+        <span>Date: {{loanNote.createdOn  | dateFormat}}</span>
       </p>
       <div fxLayout="row" fxLayoutAlign="flex-start">
         <button mat-button color="primary" (click)="editNote(loanNote.id,loanNote.note,i)">

src/app/loans/loans-view/original-schedule-tab/original-schedule-tab.component.html

@@ -4,7 +4,7 @@
 
     <ng-container matColumnDef="date">
       <th mat-header-cell *matHeaderCellDef mat-sort-header> Date </th>
-      <td mat-cell *matCellDef="let ele"> {{ ele.dueDate | date}} </td>
+      <td mat-cell *matCellDef="let ele"> {{ ele.dueDate  | dateFormat}} </td>
       <td mat-footer-cell *matFooterCellDef> <b> Total</b> </td>
     </ng-container>
 

src/app/loans/loans-view/repayment-schedule-tab/repayment-schedule-tab.component.html

@@ -16,13 +16,13 @@
 
     <ng-container matColumnDef="date">
       <th mat-header-cell *matHeaderCellDef> Date </th>
-      <td mat-cell *matCellDef="let ele"> {{ ele.dueDate | date}} </td>
+      <td mat-cell *matCellDef="let ele"> {{ ele.dueDate  | dateFormat}} </td>
       <td mat-footer-cell *matFooterCellDef>  </td>
     </ng-container>
 
     <ng-container matColumnDef="paiddate">
       <th mat-header-cell *matHeaderCellDef> Paid Date </th>
-      <td mat-cell *matCellDef="let ele"> {{ ele.obligationsMetOnDate | date}} </td>
+      <td mat-cell *matCellDef="let ele"> {{ ele.obligationsMetOnDate  | dateFormat}} </td>
       <td mat-footer-cell *matFooterCellDef>  </td>
     </ng-container>
 

src/app/loans/loans-view/standing-instructions-tab/standing-instructions-tab.component.html

@@ -41,7 +41,7 @@
 
       <ng-container matColumnDef="validity">
         <th mat-header-cell *matHeaderCellDef> Validity </th>
-        <td mat-cell *matCellDef="let instruction">{{instruction.validFrom | date}} to {{instruction.validTill | date}}
+        <td mat-cell *matCellDef="let instruction">{{instruction.validFrom  | dateFormat}} to {{instruction.validTill  | dateFormat}}
         </td>
       </ng-container>
 

src/app/loans/loans-view/transactions-tab/transactions-tab.component.html

@@ -24,7 +24,7 @@
 
       <ng-container matColumnDef="transactionDate">
         <th mat-header-cell *matHeaderCellDef> Transaction Date </th>
-        <td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}"> {{ transaction.date | date }} </td>
+        <td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}"> {{ transaction.date  | dateFormat }} </td>
       </ng-container>
 
       <ng-container matColumnDef="transactionType">

src/app/loans/loans-view/transactions/view-transaction/view-transaction.component.html

@@ -39,7 +39,7 @@
         </div>
 
         <div fxFlex="50%">
-          {{ transactionData.date | date }}
+          {{ transactionData.date  | dateFormat }}
         </div>
 
         <div fxFlex="50%" class="mat-body-strong">

src/app/loans/loans-view/view-charge/view-charge.component.html

@@ -67,7 +67,7 @@
         </div>
 
         <div fxFlex="50%">
-          {{ chargeData.dueDate | date }}
+          {{ chargeData.dueDate  | dateFormat }}
         </div>
 
         <div fxFlex="50%" class="mat-body-strong">