build: Use prettier for html

Stop ignoring html files in prettier and fix existing issues.

src/app/organization/loan-provisioning-criteria/create-loan-provisioning-criteria/create-loan-provisioning-criteria.component.html

@@ -1,18 +1,14 @@
 <div class="container">
-
   <mat-card>
-
     <div>
-
       <form [formGroup]="provisioningCriteriaForm">
-
         <div fxLayout="row" fxLayoutGap="2%">
-
           <mat-form-field fxFlex>
             <mat-label>{{ 'labels.inputs.Provisioning Criteria' | translate }}</mat-label>
-            <input required matInput formControlName="criteriaName">
+            <input required matInput formControlName="criteriaName" />
             <mat-error *ngIf="provisioningCriteriaForm.controls.criteriaName.hasError('required')">
-              {{ 'labels.inputs.Provisioning Criteria' | translate }} {{'labels.commons.is' | translate }} <strong>{{'labels.commons.required' | translate }}</strong>
+              {{ 'labels.inputs.Provisioning Criteria' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
             </mat-error>
           </mat-form-field>
 
@@ -24,72 +20,78 @@
               </mat-option>
             </mat-select>
           </mat-form-field>
-
         </div>
-
       </form>
-
     </div>
 
     <div class="mat-elevation-z1">
-
       <mat-hint *ngIf="!provisioningCriteriaFormValid">
-        {{ 'labels.text.Provisioning criteria definitions' | translate }}</mat-hint>
+        {{ 'labels.text.Provisioning criteria definitions' | translate }}</mat-hint
+      >
 
       <table mat-table class="m-t-10" [dataSource]="definitions">
-
         <ng-container matColumnDef="category">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Category' | translate }} </th>
-          <td mat-cell *matCellDef="let definition"> {{ definition.categoryName }} </td>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Category' | translate }}</th>
+          <td mat-cell *matCellDef="let definition">{{ definition.categoryName }}</td>
         </ng-container>
 
         <ng-container matColumnDef="minAge">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Min Age' | translate }} </th>
-          <td mat-cell *matCellDef="let definition"> {{ definition.minAge || '0' }} </td>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Min Age' | translate }}</th>
+          <td mat-cell *matCellDef="let definition">{{ definition.minAge || '0' }}</td>
         </ng-container>
 
         <ng-container matColumnDef="maxAge">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Max Age' | translate }} </th>
-          <td mat-cell *matCellDef="let definition"> {{ definition.maxAge || '0' }} </td>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Max Age' | translate }}</th>
+          <td mat-cell *matCellDef="let definition">{{ definition.maxAge || '0' }}</td>
         </ng-container>
 
         <ng-container matColumnDef="percentage">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Percentage' | translate }} (%)</th>
-          <td mat-cell *matCellDef="let definition"> {{ definition.provisioningPercentage || '0' }} </td>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Percentage' | translate }} (%)</th>
+          <td mat-cell *matCellDef="let definition">{{ definition.provisioningPercentage || '0' }}</td>
         </ng-container>
 
         <ng-container matColumnDef="liabilityAccount">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Liability Account' | translate }} </th>
-          <td mat-cell *matCellDef="let definition"> {{ (definition.liabilityAccount | find:loanProvisioningCriteriaTemplate.glAccounts:'id':'name') || '-' }} </td>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Liability Account' | translate }}</th>
+          <td mat-cell *matCellDef="let definition">
+            {{
+              (definition.liabilityAccount | find: loanProvisioningCriteriaTemplate.glAccounts : 'id' : 'name') || '-'
+            }}
+          </td>
         </ng-container>
 
         <ng-container matColumnDef="expenseAccount">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Expense Account' | translate }} </th>
-          <td mat-cell *matCellDef="let definition"> {{ (definition.expenseAccount | find:loanProvisioningCriteriaTemplate.glAccounts:'id':'name') || '-' }} </td>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Expense Account' | translate }}</th>
+          <td mat-cell *matCellDef="let definition">
+            {{ (definition.expenseAccount | find: loanProvisioningCriteriaTemplate.glAccounts : 'id' : 'name') || '-' }}
+          </td>
         </ng-container>
 
         <ng-container matColumnDef="edit">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Actions' | translate }} </th>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Actions' | translate }}</th>
           <td mat-cell *matCellDef="let definition">
             <button mat-button color="primary" (click)="editDefinition(definition)">
               <fa-icon icon="edit" class="m-r-10"></fa-icon>
-              {{'labels.buttons.Edit' | translate }}
+              {{ 'labels.buttons.Edit' | translate }}
             </button>
           </td>
         </ng-container>
 
         <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
-        <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
-
+        <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
       </table>
-
     </div>
 
     <div class="m-t-20" fxLayout="row" fxLayoutAlign="center" fxLayoutGap="20px">
-      <button type="button" mat-raised-button [routerLink]="['../']">{{'labels.buttons.Cancel' | translate }}</button>
-      <button mat-raised-button color="primary" [disabled]="!provisioningCriteriaFormValid" (click)="submit()" *mifosxHasPermission="'CREATE_PROVISIONING_CRITERIA'">{{'labels.buttons.Submit' | translate }}</button>
+      <button type="button" mat-raised-button [routerLink]="['../']">{{ 'labels.buttons.Cancel' | translate }}</button>
+      <button
+        mat-raised-button
+        color="primary"
+        [disabled]="!provisioningCriteriaFormValid"
+        (click)="submit()"
+        *mifosxHasPermission="'CREATE_PROVISIONING_CRITERIA'"
+      >
+        {{ 'labels.buttons.Submit' | translate }}
+      </button>
     </div>
-
   </mat-card>
-
 </div>

src/app/organization/loan-provisioning-criteria/edit-loan-provisioning-criteria/edit-loan-provisioning-criteria.component.html

@@ -1,18 +1,14 @@
 <div class="container">
-
   <mat-card>
-
     <div>
-
       <form [formGroup]="provisioningCriteriaForm">
-
         <div fxLayout="row" fxLayoutGap="2%">
-
           <mat-form-field fxFlex>
             <mat-label>{{ 'labels.inputs.Provisioning Criteria' | translate }}</mat-label>
-            <input required matInput formControlName="criteriaName">
+            <input required matInput formControlName="criteriaName" />
             <mat-error *ngIf="provisioningCriteriaForm.controls.criteriaName.hasError('required')">
-              {{ 'labels.inputs.Provisioning Criteria' | translate }} {{'labels.commons.is' | translate }} <strong>{{'labels.commons.required' | translate }}</strong>
+              {{ 'labels.inputs.Provisioning Criteria' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
             </mat-error>
           </mat-form-field>
 
@@ -24,71 +20,81 @@
               </mat-option>
             </mat-select>
           </mat-form-field>
-
         </div>
-
       </form>
-
     </div>
 
     <div class="mat-elevation-z1">
-
-      <mat-hint *ngIf="!provisioningCriteriaFormValid">{{ 'labels.text.Provisioning criteria definitions' | translate }}</mat-hint>
+      <mat-hint *ngIf="!provisioningCriteriaFormValid">{{
+        'labels.text.Provisioning criteria definitions' | translate
+      }}</mat-hint>
 
       <table mat-table class="m-t-10" [dataSource]="definitions">
-
         <ng-container matColumnDef="category">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Category' | translate }} </th>
-          <td mat-cell *matCellDef="let definition"> {{ definition.categoryName }} </td>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Category' | translate }}</th>
+          <td mat-cell *matCellDef="let definition">{{ definition.categoryName }}</td>
         </ng-container>
 
         <ng-container matColumnDef="minAge">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Min Age' | translate }} </th>
-          <td mat-cell *matCellDef="let definition"> {{ definition.minAge || '0' }} </td>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Min Age' | translate }}</th>
+          <td mat-cell *matCellDef="let definition">{{ definition.minAge || '0' }}</td>
         </ng-container>
 
         <ng-container matColumnDef="maxAge">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Max Age' | translate }} </th>
-          <td mat-cell *matCellDef="let definition"> {{ definition.maxAge || '0' }} </td>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Max Age' | translate }}</th>
+          <td mat-cell *matCellDef="let definition">{{ definition.maxAge || '0' }}</td>
         </ng-container>
 
         <ng-container matColumnDef="percentage">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Percentage' | translate }} (%)</th>
-          <td mat-cell *matCellDef="let definition"> {{ definition.provisioningPercentage || '0' }} </td>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Percentage' | translate }} (%)</th>
+          <td mat-cell *matCellDef="let definition">{{ definition.provisioningPercentage || '0' }}</td>
         </ng-container>
 
         <ng-container matColumnDef="liabilityAccount">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Liability Account' | translate }} </th>
-          <td mat-cell *matCellDef="let definition"> {{ (definition.liabilityAccount | find:loanProvisioningCriteriaAndTemplate.glAccounts:'id':'name') || '-' }} </td>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Liability Account' | translate }}</th>
+          <td mat-cell *matCellDef="let definition">
+            {{
+              (definition.liabilityAccount | find: loanProvisioningCriteriaAndTemplate.glAccounts : 'id' : 'name') ||
+                '-'
+            }}
+          </td>
         </ng-container>
 
         <ng-container matColumnDef="expenseAccount">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Expense Account' | translate }} </th>
-          <td mat-cell *matCellDef="let definition"> {{ (definition.expenseAccount | find:loanProvisioningCriteriaAndTemplate.glAccounts:'id':'name') || '-' }} </td>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Expense Account' | translate }}</th>
+          <td mat-cell *matCellDef="let definition">
+            {{
+              (definition.expenseAccount | find: loanProvisioningCriteriaAndTemplate.glAccounts : 'id' : 'name') || '-'
+            }}
+          </td>
         </ng-container>
 
         <ng-container matColumnDef="edit">
-          <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Actions' | translate }} </th>
+          <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Actions' | translate }}</th>
           <td mat-cell *matCellDef="let definition">
             <button mat-button color="primary" (click)="editDefinition(definition)">
               <fa-icon icon="edit" class="m-r-10"></fa-icon>
-              {{'labels.buttons.Edit' | translate }}
+              {{ 'labels.buttons.Edit' | translate }}
             </button>
           </td>
         </ng-container>
 
         <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
-        <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
-
+        <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
       </table>
-
     </div>
 
     <div class="m-t-20" fxLayout="row" fxLayoutAlign="center" fxLayoutGap="20px">
-      <button type="button" mat-raised-button [routerLink]="['../']">{{'labels.buttons.Cancel' | translate }}</button>
-      <button mat-raised-button color="primary" [disabled]="!provisioningCriteriaFormValid" (click)="submit()" *mifosxHasPermission="'UPDATE_CRITERIA'">{{'labels.buttons.Submit' | translate }}</button>
+      <button type="button" mat-raised-button [routerLink]="['../']">{{ 'labels.buttons.Cancel' | translate }}</button>
+      <button
+        mat-raised-button
+        color="primary"
+        [disabled]="!provisioningCriteriaFormValid"
+        (click)="submit()"
+        *mifosxHasPermission="'UPDATE_CRITERIA'"
+      >
+        {{ 'labels.buttons.Submit' | translate }}
+      </button>
     </div>
-
   </mat-card>
-
 </div>

src/app/organization/loan-provisioning-criteria/loan-provisioning-criteria.component.html

@@ -1,40 +1,44 @@
 <div class="container m-b-20" fxLayout="row" fxLayoutAlign="end" fxLayoutGap="20px">
-  <button mat-raised-button color="primary" [routerLink]="['create']" *mifosxHasPermission="'CREATE_PROVISIONING_CRITERIA'">
+  <button
+    mat-raised-button
+    color="primary"
+    [routerLink]="['create']"
+    *mifosxHasPermission="'CREATE_PROVISIONING_CRITERIA'"
+  >
     <fa-icon icon="plus" class="m-r-10"></fa-icon>
-    {{'labels.buttons.Create Provisioning Criteria' | translate }}
+    {{ 'labels.buttons.Create Provisioning Criteria' | translate }}
   </button>
 </div>
 
 <div class="container">
-
   <div fxLayout="row" fxLayoutGap="20px">
     <mat-form-field fxFlex>
-      <mat-label>{{'labels.inputs.Filter' | translate}}</mat-label>
-      <input matInput (keyup)="applyFilter($event.target.value)">
+      <mat-label>{{ 'labels.inputs.Filter' | translate }}</mat-label>
+      <input matInput (keyup)="applyFilter($event.target.value)" />
     </mat-form-field>
   </div>
 
   <div class="mat-elevation-z8">
-
     <table mat-table [dataSource]="dataSource" matSort>
-
       <ng-container matColumnDef="criteriaName">
-        <th mat-header-cell *matHeaderCellDef mat-sort-header> {{ 'labels.inputs.name' | translate }} </th>
-        <td mat-cell *matCellDef="let loanProvisioningCriteria"> {{ loanProvisioningCriteria.criteriaName }} </td>
+        <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'labels.inputs.name' | translate }}</th>
+        <td mat-cell *matCellDef="let loanProvisioningCriteria">{{ loanProvisioningCriteria.criteriaName }}</td>
       </ng-container>
 
       <ng-container matColumnDef="createdBy">
-        <th mat-header-cell *matHeaderCellDef mat-sort-header> {{ 'labels.inputs.Created By' | translate }} </th>
-        <td mat-cell *matCellDef="let loanProvisioningCriteria"> {{ loanProvisioningCriteria.createdBy }} </td>
+        <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'labels.inputs.Created By' | translate }}</th>
+        <td mat-cell *matCellDef="let loanProvisioningCriteria">{{ loanProvisioningCriteria.createdBy }}</td>
       </ng-container>
 
       <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
-      <tr mat-row *matRowDef="let row; columns: displayedColumns;" [routerLink]="[row.criteriaId]" class="select-row"></tr>
-
+      <tr
+        mat-row
+        *matRowDef="let row; columns: displayedColumns"
+        [routerLink]="[row.criteriaId]"
+        class="select-row"
+      ></tr>
     </table>
 
     <mat-paginator [pageSizeOptions]="[10, 25, 50, 100]" showFirstLastButtons></mat-paginator>
-
   </div>
-
 </div>

src/app/organization/loan-provisioning-criteria/view-loan-provisioning-criteria/view-loan-provisioning-criteria.component.html

@@ -1,74 +1,63 @@
 <div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column" class="container m-b-20">
   <button mat-raised-button color="primary" [routerLink]="['edit']" *mifosxHasPermission="'UPDATE_CRITERIA'">
     <fa-icon icon="edit" class="m-r-10"></fa-icon>
-    {{'labels.buttons.Edit' | translate }}
+    {{ 'labels.buttons.Edit' | translate }}
   </button>
   <button mat-raised-button color="warn" (click)="deleteCriteria()" *mifosxHasPermission="'DELETE_CRITERIA'">
     <fa-icon icon="trash" class="m-r-10"></fa-icon>
-    {{'labels.buttons.Delete' | translate }}
+    {{ 'labels.buttons.Delete' | translate }}
   </button>
 </div>
 
 <div class="container">
-
   <mat-card>
-
     <mat-card-content>
-
       <div fxLayout="row wrap" class="content">
-
-        <h2 class="mat-h2" fxFlexFill>{{provisioningData.criteriaName}}</h2>
+        <h2 class="mat-h2" fxFlexFill>{{ provisioningData.criteriaName }}</h2>
         <mat-divider [inset]="true"></mat-divider>
 
-         <div fxFlexFill class="loanProduct">
+        <div fxFlexFill class="loanProduct">
           <span fxFlex="40%">{{ 'labels.inputs.Loan Product' | translate }}:</span>
           <span fxFlex="60%">{{ loanProducts }}</span>
         </div>
-
       </div>
 
       <div>
-
         <table mat-table class="mat-elevation-z1" [dataSource]="dataSource">
-
           <ng-container matColumnDef="category">
-            <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Category' | translate }} </th>
-            <td mat-cell *matCellDef="let provisioningData"> {{provisioningData.categoryName}} </td>
+            <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Category' | translate }}</th>
+            <td mat-cell *matCellDef="let provisioningData">{{ provisioningData.categoryName }}</td>
           </ng-container>
 
           <ng-container matColumnDef="minAge">
-            <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Min Age' | translate }} </th>
-            <td mat-cell *matCellDef="let provisioningData"> {{provisioningData.minAge}} </td>
+            <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Min Age' | translate }}</th>
+            <td mat-cell *matCellDef="let provisioningData">{{ provisioningData.minAge }}</td>
           </ng-container>
 
           <ng-container matColumnDef="maxAge">
-            <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Max Age' | translate }} </th>
-            <td mat-cell *matCellDef="let provisioningData"> {{provisioningData.maxAge}} </td>
+            <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Max Age' | translate }}</th>
+            <td mat-cell *matCellDef="let provisioningData">{{ provisioningData.maxAge }}</td>
           </ng-container>
 
           <ng-container matColumnDef="percentage">
-            <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Percentage' | translate }} </th>
-            <td mat-cell *matCellDef="let provisioningData"> {{provisioningData.provisioningPercentage}} </td>
+            <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Percentage' | translate }}</th>
+            <td mat-cell *matCellDef="let provisioningData">{{ provisioningData.provisioningPercentage }}</td>
           </ng-container>
 
           <ng-container matColumnDef="liabilityAccount">
-            <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Liability Account' | translate }} </th>
-            <td mat-cell *matCellDef="let provisioningData"> {{provisioningData.liabilityName}} </td>
+            <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Liability Account' | translate }}</th>
+            <td mat-cell *matCellDef="let provisioningData">{{ provisioningData.liabilityName }}</td>
           </ng-container>
 
           <ng-container matColumnDef="expenseAccount">
-            <th mat-header-cell *matHeaderCellDef> {{ 'labels.inputs.Expense Account' | translate }} </th>
-            <td mat-cell *matCellDef="let provisioningData"> {{provisioningData.expenseName}} </td>
+            <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Expense Account' | translate }}</th>
+            <td mat-cell *matCellDef="let provisioningData">{{ provisioningData.expenseName }}</td>
           </ng-container>
 
           <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
-          <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
+          <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
         </table>
-
       </div>
-
     </mat-card-content>
-
   </mat-card>
-
 </div>