build: Use prettier for html

Stop ignoring html files in prettier and fix existing issues.
2024-12-19 09:36:50 +01:00
parent c5fc3925fb
commit 2ec9ba81d6
651 changed files with 28935 additions and 20624 deletions
@@ -1,31 +1,34 @@
 <div class="container">
-
  <mat-card>
-
    <form [formGroup]="activateRecurringDepositsAccountForm" (ngSubmit)="submit()">
-
      <mat-card-content>
-
        <mat-form-field fxFlex (click)="activatedOnDatePicker.open()">
-          <mat-label>{{"labels.inputs.Activated On Date" | translate }}</mat-label>
-          <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="activatedOnDatePicker" required
-            formControlName="activatedOnDate">
+          <mat-label>{{ 'labels.inputs.Activated On Date' | translate }}</mat-label>
+          <input
+            matInput
+            [min]="minDate"
+            [max]="maxDate"
+            [matDatepicker]="activatedOnDatePicker"
+            required
+            formControlName="activatedOnDate"
+          />
          <mat-datepicker-toggle matSuffix [for]="activatedOnDatePicker"></mat-datepicker-toggle>
          <mat-datepicker #activatedOnDatePicker></mat-datepicker>
          <mat-error *ngIf="activateRecurringDepositsAccountForm.controls.activatedOnDate.hasError('required')">
-            {{"labels.inputs.Activated On Date" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+            {{ 'labels.inputs.Activated On Date' | translate }} {{ 'labels.commons.is' | translate }}
+            <strong>{{ 'labels.commons.required' | translate }}</strong>
          </mat-error>
        </mat-form-field>
-
      </mat-card-content>

      <mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
-        <button type="button" mat-raised-button [routerLink]="['../../']">{{"labels.buttons.Cancel" | translate }}</button>
-        <button mat-raised-button color="primary" [disabled]="!activateRecurringDepositsAccountForm.valid">{{"labels.buttons.Confirm" | translate }}</button>
+        <button type="button" mat-raised-button [routerLink]="['../../']">
+          {{ 'labels.buttons.Cancel' | translate }}
+        </button>
+        <button mat-raised-button color="primary" [disabled]="!activateRecurringDepositsAccountForm.valid">
+          {{ 'labels.buttons.Confirm' | translate }}
+        </button>
      </mat-card-actions>
-
    </form>
-
  </mat-card>
-
 </div>
@@ -1,46 +1,45 @@
 <div class="container">
-
  <mat-card>
-
    <form [formGroup]="recurringDepositsChargeForm" (ngSubmit)="submit()">
-
      <mat-card-content>
-
        <div fxLayout="column">
          <mat-form-field>
-            <mat-label>{{"labels.inputs.Charge" | translate }}</mat-label>
+            <mat-label>{{ 'labels.inputs.Charge' | translate }}</mat-label>
            <mat-select required formControlName="chargeId">
              <mat-option *ngFor="let savingsCharge of savingsChargeOptions" [value]="savingsCharge.id">
                {{ savingsCharge.name + ' (' + savingsCharge.currency.name + ')' }}
              </mat-option>
            </mat-select>
            <mat-error *ngIf="recurringDepositsChargeForm.controls.chargeId.hasError('required')">
-              {{"labels.inputs.Charge" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+              {{ 'labels.inputs.Charge' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
            </mat-error>
          </mat-form-field>

          <div *ngIf="chargeDetails" fxLayout="column">
-
            <mat-form-field>
-              <mat-label>{{"labels.inputs.Amount" | translate }}</mat-label>
+              <mat-label>{{ 'labels.inputs.Amount' | translate }}</mat-label>
              <input type="number" required matInput formControlName="amount" />
              <mat-error *ngIf="recurringDepositsChargeForm.controls.amount.hasError('required')">
-                {{"labels.inputs.Amount" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+                {{ 'labels.inputs.Amount' | translate }} {{ 'labels.commons.is' | translate }}
+                <strong>{{ 'labels.commons.required' | translate }}</strong>
              </mat-error>
            </mat-form-field>

            <mat-form-field>
-              <mat-label>{{"labels.inputs.Charge Calculation" | translate }}</mat-label>
+              <mat-label>{{ 'labels.inputs.Charge Calculation' | translate }}</mat-label>
              <mat-select formControlName="chargeCalculationType">
-                <mat-option *ngFor="let chargeCalculation of chargeDetails.chargeCalculationTypeOptions"
-                  [value]="chargeCalculation.id">
+                <mat-option
+                  *ngFor="let chargeCalculation of chargeDetails.chargeCalculationTypeOptions"
+                  [value]="chargeCalculation.id"
+                >
                  {{ chargeCalculation.value }}
                </mat-option>
              </mat-select>
            </mat-form-field>

            <mat-form-field>
-              <mat-label>{{"labels.inputs.Charge time type" | translate }}</mat-label>
+              <mat-label>{{ 'labels.inputs.Charge time type' | translate }}</mat-label>
              <mat-select formControlName="chargeTimeType">
                <mat-option *ngFor="let chargeTime of chargeDetails.chargeTimeTypeOptions" [value]="chargeTime.id">
                  {{ chargeTime.value }}
@@ -49,45 +48,60 @@
            </mat-form-field>

            <mat-form-field *ngIf="recurringDepositsChargeForm.contains('dueDate')" (click)="dueDatePicker.open()">
-              <mat-label>{{"labels.inputs.Due for collection on" | translate }}</mat-label>
-              <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="dueDatePicker" required
-                formControlName="dueDate">
+              <mat-label>{{ 'labels.inputs.Due for collection on' | translate }}</mat-label>
+              <input
+                matInput
+                [min]="minDate"
+                [max]="maxDate"
+                [matDatepicker]="dueDatePicker"
+                required
+                formControlName="dueDate"
+              />
              <mat-datepicker-toggle matSuffix [for]="dueDatePicker"></mat-datepicker-toggle>
              <mat-datepicker #dueDatePicker></mat-datepicker>
              <mat-error *ngIf="recurringDepositsChargeForm.controls.dueDate.hasError('required')">
-                {{"labels.inputs.Due for collection on" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+                {{ 'labels.inputs.Due for collection on' | translate }} {{ 'labels.commons.is' | translate }}
+                <strong>{{ 'labels.commons.required' | translate }}</strong>
              </mat-error>
            </mat-form-field>

-            <mat-form-field *ngIf="recurringDepositsChargeForm.contains('feeOnMonthDay')" (click)="feeOnMonthDayPicker.open()">
-              <mat-label>{{"labels.inputs.Due On" | translate }}</mat-label>
-              <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="feeOnMonthDayPicker" required
-                formControlName="feeOnMonthDay">
+            <mat-form-field
+              *ngIf="recurringDepositsChargeForm.contains('feeOnMonthDay')"
+              (click)="feeOnMonthDayPicker.open()"
+            >
+              <mat-label>{{ 'labels.inputs.Due On' | translate }}</mat-label>
+              <input
+                matInput
+                [min]="minDate"
+                [max]="maxDate"
+                [matDatepicker]="feeOnMonthDayPicker"
+                required
+                formControlName="feeOnMonthDay"
+              />
              <mat-datepicker-toggle matSuffix [for]="feeOnMonthDayPicker"></mat-datepicker-toggle>
              <mat-datepicker #feeOnMonthDayPicker></mat-datepicker>
              <mat-error *ngIf="recurringDepositsChargeForm.controls.feeOnMonthDay.hasError('required')">
-                {{"labels.inputs.Due Date" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+                {{ 'labels.inputs.Due Date' | translate }} {{ 'labels.commons.is' | translate }}
+                <strong>{{ 'labels.commons.required' | translate }}</strong>
              </mat-error>
            </mat-form-field>

            <mat-form-field *ngIf="recurringDepositsChargeForm.contains('feeInterval')">
-              <mat-label>{{"labels.inputs.Repeats Every" | translate }}</mat-label>
+              <mat-label>{{ 'labels.inputs.Repeats Every' | translate }}</mat-label>
              <input matInput formControlName="feeInterval" />
            </mat-form-field>
-
          </div>
-
        </div>

        <mat-card-actions fxLayoutGap="5px" fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center">
-          <button type="button" mat-raised-button [routerLink]="['../../']">{{"labels.buttons.Cancel" | translate }}</button>
-          <button mat-raised-button color="primary" [disabled]="!recurringDepositsChargeForm.valid">{{"labels.buttons.Submit" | translate }}</button>
+          <button type="button" mat-raised-button [routerLink]="['../../']">
+            {{ 'labels.buttons.Cancel' | translate }}
+          </button>
+          <button mat-raised-button color="primary" [disabled]="!recurringDepositsChargeForm.valid">
+            {{ 'labels.buttons.Submit' | translate }}
+          </button>
        </mat-card-actions>
-
      </mat-card-content>
-
    </form>
-
  </mat-card>
-
 </div>
@@ -1,40 +1,41 @@
 <div class="container">
-
  <mat-card>
-
    <form [formGroup]="approveRecurringDepositsAccountForm" (ngSubmit)="submit()">
-
      <mat-card-content>
-
        <div fxLayout="column">
-
          <mat-form-field (click)="approvedOnDatePicker.open()">
-            <mat-label>{{"labels.inputs.Approved On Date" | translate }}</mat-label>
-            <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="approvedOnDatePicker" required
-              formControlName="approvedOnDate">
+            <mat-label>{{ 'labels.inputs.Approved On Date' | translate }}</mat-label>
+            <input
+              matInput
+              [min]="minDate"
+              [max]="maxDate"
+              [matDatepicker]="approvedOnDatePicker"
+              required
+              formControlName="approvedOnDate"
+            />
            <mat-datepicker-toggle matSuffix [for]="approvedOnDatePicker"></mat-datepicker-toggle>
            <mat-datepicker #approvedOnDatePicker></mat-datepicker>
            <mat-error *ngIf="approveRecurringDepositsAccountForm.controls.approvedOnDate.hasError('required')">
-              {{"labels.inputs.Approved On Date" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+              {{ 'labels.inputs.Approved On Date' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
            </mat-error>
          </mat-form-field>

          <mat-form-field>
-            <mat-label>{{"labels.inputs.Note" | translate }}</mat-label>
+            <mat-label>{{ 'labels.inputs.Note' | translate }}</mat-label>
            <textarea matInput formControlName="note" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
          </mat-form-field>
-
        </div>
-
      </mat-card-content>

      <mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
-        <button type="button" mat-raised-button [routerLink]="['../../']">{{"labels.buttons.Cancel" | translate }}</button>
-        <button mat-raised-button color="primary" [disabled]="!approveRecurringDepositsAccountForm">{{"labels.buttons.Confirm" | translate }}</button>
+        <button type="button" mat-raised-button [routerLink]="['../../']">
+          {{ 'labels.buttons.Cancel' | translate }}
+        </button>
+        <button mat-raised-button color="primary" [disabled]="!approveRecurringDepositsAccountForm">
+          {{ 'labels.buttons.Confirm' | translate }}
+        </button>
      </mat-card-actions>
-
    </form>
-
  </mat-card>
-
 </div>
@@ -1,61 +1,68 @@
 <div class="container">
-
  <mat-card>
-
    <form [formGroup]="closeRecurringDepositForm" (ngSubmit)="submit()">
-
      <mat-card-content>
-
        <div fxLayout="column">
-
-          <h3 class="mat-h3" fxFlexFill>{{title}}</h3>
+          <h3 class="mat-h3" fxFlexFill>{{ title }}</h3>

          <mat-form-field (click)="closedOnDatePicker.open()">
-            <mat-label>{{"labels.inputs.Closed On" | translate }}</mat-label>
-            <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="closedOnDatePicker" required
-              formControlName="closedOnDate">
+            <mat-label>{{ 'labels.inputs.Closed On' | translate }}</mat-label>
+            <input
+              matInput
+              [min]="minDate"
+              [max]="maxDate"
+              [matDatepicker]="closedOnDatePicker"
+              required
+              formControlName="closedOnDate"
+            />
            <mat-datepicker-toggle matSuffix [for]="closedOnDatePicker"></mat-datepicker-toggle>
            <mat-datepicker #closedOnDatePicker></mat-datepicker>
            <mat-error *ngIf="closeRecurringDepositForm.controls.closedOnDate.hasError('required')">
-              {{"labels.inputs.Closed On" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+              {{ 'labels.inputs.Closed On' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
            </mat-error>
          </mat-form-field>

          <mat-form-field>
-            <mat-label>{{"labels.inputs.Maturity Amount" | translate }}</mat-label>
-            <input matInput required formControlName="maturityAmount">
+            <mat-label>{{ 'labels.inputs.Maturity Amount' | translate }}</mat-label>
+            <input matInput required formControlName="maturityAmount" />
            <mat-error *ngIf="closeRecurringDepositForm.controls.maturityAmount.hasError('required')">
-              {{"labels.inputs.Maturity Amount" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+              {{ 'labels.inputs.Maturity Amount' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
            </mat-error>
          </mat-form-field>

          <mat-form-field>
-            <mat-label>{{"labels.inputs.Action" | translate }}</mat-label>
+            <mat-label>{{ 'labels.inputs.Action' | translate }}</mat-label>
            <mat-select formControlName="onAccountClosureId" required>
-              <mat-option *ngFor="let onAccountClosureOption of onAccountClosureOptions"
-                [value]="onAccountClosureOption.id">
+              <mat-option
+                *ngFor="let onAccountClosureOption of onAccountClosureOptions"
+                [value]="onAccountClosureOption.id"
+              >
                {{ onAccountClosureOption.value }}
              </mat-option>
            </mat-select>
            <mat-error *ngIf="closeRecurringDepositForm.controls.onAccountClosureId.hasError('required')">
-              {{"labels.inputs.Action" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+              {{ 'labels.inputs.Action' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
            </mat-error>
          </mat-form-field>

          <mat-form-field>
-            <mat-label>{{"labels.inputs.Payment Type Id" | translate }}</mat-label>
+            <mat-label>{{ 'labels.inputs.Payment Type Id' | translate }}</mat-label>
            <mat-select formControlName="paymentTypeId" required>
              <mat-option *ngFor="let paymentType of paymentTypes" [value]="paymentType.id">
                {{ paymentType.name }}
              </mat-option>
            </mat-select>
            <mat-error *ngIf="closeRecurringDepositForm.controls.paymentTypeId.hasError('required')">
-              {{"labels.inputs.Payment Type" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+              {{ 'labels.inputs.Payment Type' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
            </mat-error>
          </mat-form-field>

          <div fxFlexFill>
-            <span fxFlex="25%">{{"labels.inputs.Show Payment Details" | translate }}</span>
+            <span fxFlex="25%">{{ 'labels.inputs.Show Payment Details' | translate }}</span>
            <span fxFlex="75%" class="expandcollapsebutton" (click)="toggleDisplay()">
              <button mat-raised-button color="primary" *ngIf="showPaymentDetails">
                <i class="fa fa-minus"></i>
@@ -68,47 +75,46 @@

          <ng-container *ngIf="showPaymentDetails">
            <mat-form-field>
-              <mat-label> {{"labels.inputs.Account" | translate }} #</mat-label>
-              <input matInput formControlName="accountNumber">
+              <mat-label> {{ 'labels.inputs.Account' | translate }} #</mat-label>
+              <input matInput formControlName="accountNumber" />
            </mat-form-field>

            <mat-form-field>
-              <mat-label>{{"labels.inputs.Cheque" | translate }} #</mat-label>
-              <input matInput formControlName="chequeNumber">
+              <mat-label>{{ 'labels.inputs.Cheque' | translate }} #</mat-label>
+              <input matInput formControlName="chequeNumber" />
            </mat-form-field>

            <mat-form-field>
-              <mat-label>{{"labels.inputs.Routing Code" | translate }}</mat-label>
-              <input matInput formControlName="routingCode">
+              <mat-label>{{ 'labels.inputs.Routing Code' | translate }}</mat-label>
+              <input matInput formControlName="routingCode" />
            </mat-form-field>

            <mat-form-field>
-              <mat-label>{{"labels.inputs.Reciept" | translate }} #</mat-label>
-              <input matInput formControlName="receiptNumber">
+              <mat-label>{{ 'labels.inputs.Reciept' | translate }} #</mat-label>
+              <input matInput formControlName="receiptNumber" />
            </mat-form-field>

            <mat-form-field>
-              <mat-label>{{"labels.inputs.Bank" | translate }} #</mat-label>
-              <input matInput formControlName="bankNumber">
+              <mat-label>{{ 'labels.inputs.Bank' | translate }} #</mat-label>
+              <input matInput formControlName="bankNumber" />
            </mat-form-field>
          </ng-container>

          <mat-form-field>
-            <mat-label>{{"labels.inputs.Note" | translate }}</mat-label>
+            <mat-label>{{ 'labels.inputs.Note' | translate }}</mat-label>
            <textarea matInput formControlName="note" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
          </mat-form-field>
-
        </div>
-
      </mat-card-content>

      <mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
-        <button type="button" mat-raised-button [routerLink]="['../general']">{{"labels.buttons.Cancel" | translate }}</button>
-        <button mat-raised-button color="primary" [disabled]="!closeRecurringDepositForm.valid">{{"labels.buttons.Submit" | translate }}</button>
+        <button type="button" mat-raised-button [routerLink]="['../general']">
+          {{ 'labels.buttons.Cancel' | translate }}
+        </button>
+        <button mat-raised-button color="primary" [disabled]="!closeRecurringDepositForm.valid">
+          {{ 'labels.buttons.Submit' | translate }}
+        </button>
      </mat-card-actions>
-
    </form>
-
  </mat-card>
-
 </div>
@@ -1,39 +1,48 @@
 <div class="container">
-
  <mat-card>
-    <h2 mat-title *ngIf="transactionType.withdrawal">{{'labels.menus.' + actionName | translate }} {{'labels.heading.Recurring Deposit Transactions' | translate}}</h2>
+    <h2 mat-title *ngIf="transactionType.withdrawal">
+      {{ 'labels.menus.' + actionName | translate }} {{ 'labels.heading.Recurring Deposit Transactions' | translate }}
+    </h2>

    <form [formGroup]="depositRecurringDepositForm" (ngSubmit)="submit()">
-
      <mat-card-content>
-
        <div fxLayout="column">
-
          <mat-form-field (click)="transactionDatePicker.open()">
-            <mat-label>{{"labels.inputs.Transaction Date" | translate }}</mat-label>
-            <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="transactionDatePicker" required
-              formControlName="transactionDate">
+            <mat-label>{{ 'labels.inputs.Transaction Date' | translate }}</mat-label>
+            <input
+              matInput
+              [min]="minDate"
+              [max]="maxDate"
+              [matDatepicker]="transactionDatePicker"
+              required
+              formControlName="transactionDate"
+            />
            <mat-datepicker-toggle matSuffix [for]="transactionDatePicker"></mat-datepicker-toggle>
            <mat-datepicker #transactionDatePicker></mat-datepicker>
            <mat-error *ngIf="depositRecurringDepositForm.controls.transactionDate.hasError('required')">
-              {{"labels.inputs.Transaction Date" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+              {{ 'labels.inputs.Transaction Date' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
            </mat-error>
          </mat-form-field>

-          <mifosx-input-amount [currency]="currency" [isRequired]="true"
+          <mifosx-input-amount
+            [currency]="currency"
+            [isRequired]="true"
            [inputFormControl]="depositRecurringDepositForm.controls.transactionAmount"
-            [inputLabel]="'Transaction Amount'">
+            [inputLabel]="'Transaction Amount'"
+          >
          </mifosx-input-amount>

          <mat-form-field>
-            <mat-label>{{"labels.inputs.Payment Type Id" | translate }}</mat-label>
+            <mat-label>{{ 'labels.inputs.Payment Type Id' | translate }}</mat-label>
            <mat-select formControlName="paymentTypeId" required>
              <mat-option *ngFor="let paymentType of paymentTypes" [value]="paymentType.id">
                {{ paymentType.name }}
              </mat-option>
            </mat-select>
            <mat-error *ngIf="depositRecurringDepositForm.controls.paymentTypeId.hasError('required')">
-              {{"labels.inputs.Payment Type" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+              {{ 'labels.inputs.Payment Type' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
            </mat-error>
          </mat-form-field>

@@ -41,7 +50,7 @@
            <span fxFlex="75%" class="expandcollapsebutton m-l-10 m-t-40" (click)="addPaymentDetails()">
              <mat-slide-toggle>
                <div [className]="showPaymentDetails ? 'enabled' : 'disabled'">
-                  <span class="m-l-10">{{"labels.inputs.Show Payment Details" | translate}}</span>
+                  <span class="m-l-10">{{ 'labels.inputs.Show Payment Details' | translate }}</span>
                </div>
              </mat-slide-toggle>
            </span>
@@ -49,47 +58,46 @@

          <ng-container *ngIf="showPaymentDetails">
            <mat-form-field>
-              <mat-label> {{"labels.inputs.Account" | translate }} #</mat-label>
-              <input matInput formControlName="accountNumber">
+              <mat-label> {{ 'labels.inputs.Account' | translate }} #</mat-label>
+              <input matInput formControlName="accountNumber" />
            </mat-form-field>

            <mat-form-field>
-              <mat-label>{{"labels.inputs.Cheque" | translate }} #</mat-label>
-              <input matInput formControlName="checkNumber">
+              <mat-label>{{ 'labels.inputs.Cheque' | translate }} #</mat-label>
+              <input matInput formControlName="checkNumber" />
            </mat-form-field>

            <mat-form-field>
-              <mat-label>{{"labels.inputs.Routing Code" | translate }}</mat-label>
-              <input matInput formControlName="routingCode">
+              <mat-label>{{ 'labels.inputs.Routing Code' | translate }}</mat-label>
+              <input matInput formControlName="routingCode" />
            </mat-form-field>

            <mat-form-field>
-              <mat-label>{{"labels.inputs.Reciept" | translate }} #</mat-label>
-              <input matInput formControlName="receiptNumber">
+              <mat-label>{{ 'labels.inputs.Reciept' | translate }} #</mat-label>
+              <input matInput formControlName="receiptNumber" />
            </mat-form-field>

            <mat-form-field>
-              <mat-label>{{"labels.inputs.Bank" | translate }} #</mat-label>
-              <input matInput formControlName="bankNumber">
+              <mat-label>{{ 'labels.inputs.Bank' | translate }} #</mat-label>
+              <input matInput formControlName="bankNumber" />
            </mat-form-field>
          </ng-container>

          <mat-form-field>
-            <mat-label>{{"labels.inputs.Note" | translate }}</mat-label>
+            <mat-label>{{ 'labels.inputs.Note' | translate }}</mat-label>
            <textarea matInput formControlName="note" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
          </mat-form-field>
-
        </div>
-
      </mat-card-content>

      <mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
-        <button type="button" mat-raised-button [routerLink]="['../../general']">{{"labels.buttons.Cancel" | translate }}</button>
-        <button mat-raised-button color="primary" [disabled]="!depositRecurringDepositForm.valid">{{"labels.buttons.Submit" | translate }}</button>
+        <button type="button" mat-raised-button [routerLink]="['../../general']">
+          {{ 'labels.buttons.Cancel' | translate }}
+        </button>
+        <button mat-raised-button color="primary" [disabled]="!depositRecurringDepositForm.valid">
+          {{ 'labels.buttons.Submit' | translate }}
+        </button>
      </mat-card-actions>
-
    </form>
-
  </mat-card>
-
 </div>
@@ -1,35 +1,36 @@
 <div class="container">
-
  <mat-card>
-
    <form [formGroup]="prematureCloseRecurringDepositsAccountForm" (ngSubmit)="submit()">
-
      <mat-card-content>
-
        <div fxLayout="column">
-
          <mat-form-field (click)="closedOnDatePicker.open()">
-            <mat-label>{{"labels.inputs.Closed On" | translate }}</mat-label>
-            <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="closedOnDatePicker" required
-              formControlName="closedOnDate">
+            <mat-label>{{ 'labels.inputs.Closed On' | translate }}</mat-label>
+            <input
+              matInput
+              [min]="minDate"
+              [max]="maxDate"
+              [matDatepicker]="closedOnDatePicker"
+              required
+              formControlName="closedOnDate"
+            />
            <mat-datepicker-toggle matSuffix [for]="closedOnDatePicker"></mat-datepicker-toggle>
            <mat-datepicker #closedOnDatePicker></mat-datepicker>
            <mat-error *ngIf="prematureCloseRecurringDepositsAccountForm.controls.closedOnDate.hasError('required')">
-              {{"labels.inputs.Closed On Date" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+              {{ 'labels.inputs.Closed On Date' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
            </mat-error>
          </mat-form-field>
-
        </div>
-
      </mat-card-content>

      <mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
-        <button type="button" mat-raised-button [routerLink]="['../../']">{{"labels.buttons.Cancel" | translate }}</button>
-        <button mat-raised-button color="primary" [disabled]="!prematureCloseRecurringDepositsAccountForm">{{"labels.buttons.Confirm" | translate }}</button>
+        <button type="button" mat-raised-button [routerLink]="['../../']">
+          {{ 'labels.buttons.Cancel' | translate }}
+        </button>
+        <button mat-raised-button color="primary" [disabled]="!prematureCloseRecurringDepositsAccountForm">
+          {{ 'labels.buttons.Confirm' | translate }}
+        </button>
      </mat-card-actions>
-
    </form>
-
  </mat-card>
-
 </div>
@@ -1,9 +1,20 @@
 <mifosx-activate-recurring-deposits-account *ngIf="actions['Activate']"></mifosx-activate-recurring-deposits-account>
-<mifosx-undo-approval-recurring-deposits-account *ngIf="actions['Undo Approval'] || actions['Undo Activation']"></mifosx-undo-approval-recurring-deposits-account>
+<mifosx-undo-approval-recurring-deposits-account
+  *ngIf="actions['Undo Approval'] || actions['Undo Activation']"
+></mifosx-undo-approval-recurring-deposits-account>
 <mifosx-approve-recurring-deposits-account *ngIf="actions['Approve']"></mifosx-approve-recurring-deposits-account>
 <mifosx-reject-recurring-deposits-account *ngIf="actions['Reject']"></mifosx-reject-recurring-deposits-account>
-<mifosx-withdraw-by-client-recurring-deposits-account *ngIf="actions['Withdrawn by Client']"></mifosx-withdraw-by-client-recurring-deposits-account>
-<mifosx-add-charge-recurring-deposits-account *ngIf="actions['Add Charge']"></mifosx-add-charge-recurring-deposits-account>
-<mifosx-premature-close-recurring-deposit-account *ngIf="actions['Premature Close']"></mifosx-premature-close-recurring-deposit-account>
+<mifosx-withdraw-by-client-recurring-deposits-account
+  *ngIf="actions['Withdrawn by Client']"
+></mifosx-withdraw-by-client-recurring-deposits-account>
+<mifosx-add-charge-recurring-deposits-account
+  *ngIf="actions['Add Charge']"
+></mifosx-add-charge-recurring-deposits-account>
+<mifosx-premature-close-recurring-deposit-account
+  *ngIf="actions['Premature Close']"
+></mifosx-premature-close-recurring-deposit-account>
 <mifosx-close-recurring-deposits-account *ngIf="actions['Close']"></mifosx-close-recurring-deposits-account>
-<mifosx-deposit-recurring-deposits-account [currency]="currency" *ngIf="actions['Deposit'] || actions['Withdrawal']"></mifosx-deposit-recurring-deposits-account>
+<mifosx-deposit-recurring-deposits-account
+  [currency]="currency"
+  *ngIf="actions['Deposit'] || actions['Withdrawal']"
+></mifosx-deposit-recurring-deposits-account>
@@ -1,40 +1,41 @@
 <div class="container">
-
  <mat-card>
-
    <form [formGroup]="rejectRecurringDepositsAccountForm" (ngSubmit)="submit()">
-
      <mat-card-content>
-
        <div fxLayout="column">
-
          <mat-form-field (click)="rejectedOnDatePicker.open()">
-            <mat-label>{{"labels.inputs.Rejected On Date" | translate }}</mat-label>
-            <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="rejectedOnDatePicker" required
-              formControlName="rejectedOnDate">
+            <mat-label>{{ 'labels.inputs.Rejected On Date' | translate }}</mat-label>
+            <input
+              matInput
+              [min]="minDate"
+              [max]="maxDate"
+              [matDatepicker]="rejectedOnDatePicker"
+              required
+              formControlName="rejectedOnDate"
+            />
            <mat-datepicker-toggle matSuffix [for]="rejectedOnDatePicker"></mat-datepicker-toggle>
            <mat-datepicker #rejectedOnDatePicker></mat-datepicker>
            <mat-error *ngIf="rejectRecurringDepositsAccountForm.controls.rejectedOnDate.hasError('required')">
-              {{"labels.inputs.Rejected On Date" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+              {{ 'labels.inputs.Rejected On Date' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
            </mat-error>
          </mat-form-field>

          <mat-form-field>
-            <mat-label>{{"labels.inputs.Note" | translate }}</mat-label>
+            <mat-label>{{ 'labels.inputs.Note' | translate }}</mat-label>
            <textarea matInput formControlName="note" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
          </mat-form-field>
-
        </div>
-
      </mat-card-content>

      <mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
-        <button type="button" mat-raised-button [routerLink]="['../../']">{{"labels.buttons.Cancel" | translate }}</button>
-        <button mat-raised-button color="primary" [disabled]="!rejectRecurringDepositsAccountForm">{{"labels.buttons.Confirm" | translate }}</button>
+        <button type="button" mat-raised-button [routerLink]="['../../']">
+          {{ 'labels.buttons.Cancel' | translate }}
+        </button>
+        <button mat-raised-button color="primary" [disabled]="!rejectRecurringDepositsAccountForm">
+          {{ 'labels.buttons.Confirm' | translate }}
+        </button>
      </mat-card-actions>
-
    </form>
-
  </mat-card>
-
 </div>
@@ -1,25 +1,21 @@
 <div class="container">
-
  <mat-card>
-
    <form [formGroup]="undoApprovalRecurringDepositsAccountForm" (ngSubmit)="submit()">
-
      <mat-card-content>
-
        <mat-form-field fxFlex>
-          <mat-label>{{"labels.inputs.Note" | translate }}</mat-label>
+          <mat-label>{{ 'labels.inputs.Note' | translate }}</mat-label>
          <textarea matInput formControlName="note" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
        </mat-form-field>
-
      </mat-card-content>

      <mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
-        <button type="button" mat-raised-button [routerLink]="['../../']">{{"labels.buttons.Cancel" | translate }}</button>
-        <button mat-raised-button color="warn" [disabled]="!undoApprovalRecurringDepositsAccountForm.valid">{{"labels.buttons.Confirm" | translate }}</button>
+        <button type="button" mat-raised-button [routerLink]="['../../']">
+          {{ 'labels.buttons.Cancel' | translate }}
+        </button>
+        <button mat-raised-button color="warn" [disabled]="!undoApprovalRecurringDepositsAccountForm.valid">
+          {{ 'labels.buttons.Confirm' | translate }}
+        </button>
      </mat-card-actions>
-
    </form>
-
  </mat-card>
-
 </div>
@@ -1,40 +1,41 @@
 <div class="container">
-
  <mat-card>
-
    <form [formGroup]="withdrawRecurringDepositsAccountForm" (ngSubmit)="submit()">
-
      <mat-card-content>
-
        <div fxLayout="column">
-
          <mat-form-field (click)="withdrawnOnDatePicker.open()">
-            <mat-label>{{"labels.inputs.Withdrawn On Date" | translate }}</mat-label>
-            <input matInput [min]="minDate" [max]="maxDate" [matDatepicker]="withdrawnOnDatePicker" required
-              formControlName="withdrawnOnDate">
+            <mat-label>{{ 'labels.inputs.Withdrawn On Date' | translate }}</mat-label>
+            <input
+              matInput
+              [min]="minDate"
+              [max]="maxDate"
+              [matDatepicker]="withdrawnOnDatePicker"
+              required
+              formControlName="withdrawnOnDate"
+            />
            <mat-datepicker-toggle matSuffix [for]="withdrawnOnDatePicker"></mat-datepicker-toggle>
            <mat-datepicker #withdrawnOnDatePicker></mat-datepicker>
            <mat-error *ngIf="withdrawRecurringDepositsAccountForm.controls.withdrawnOnDate.hasError('required')">
-              {{"labels.inputs.Withdrawn On Date" | translate }} {{ "labels.commons.is"  |translate}} <strong>{{ "labels.commons.required"  |translate}}</strong>
+              {{ 'labels.inputs.Withdrawn On Date' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
            </mat-error>
          </mat-form-field>

          <mat-form-field>
-            <mat-label>{{"labels.inputs.Note" | translate }}</mat-label>
+            <mat-label>{{ 'labels.inputs.Note' | translate }}</mat-label>
            <textarea matInput formControlName="note" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
          </mat-form-field>
-
        </div>
-
      </mat-card-content>

      <mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
-        <button type="button" mat-raised-button [routerLink]="['../../']">{{"labels.buttons.Cancel" | translate }}</button>
-        <button mat-raised-button color="primary" [disabled]="!withdrawRecurringDepositsAccountForm.valid">{{"labels.buttons.Confirm" | translate }}</button>
+        <button type="button" mat-raised-button [routerLink]="['../../']">
+          {{ 'labels.buttons.Cancel' | translate }}
+        </button>
+        <button mat-raised-button color="primary" [disabled]="!withdrawRecurringDepositsAccountForm.valid">
+          {{ 'labels.buttons.Confirm' | translate }}
+        </button>
      </mat-card-actions>
-
    </form>
-
  </mat-card>
-
 </div>