build: Use prettier for html

Stop ignoring html files in prettier and fix existing issues.

src/app/system/external-services/amazon-s3/amazon-s3.component.html

@@ -1,27 +1,23 @@
 <div class="container m-b-20" fxLayout="row" fxLayoutAlign="end" fxLayoutGap="20px">
   <button mat-raised-button color="primary" [routerLink]="['edit']">
     <fa-icon icon="edit" class="m-r-10"></fa-icon>
-    {{'labels.buttons.Edit' | translate}}
+    {{ 'labels.buttons.Edit' | translate }}
   </button>
 </div>
 
 <div class="container mat-elevation-z8">
-
   <table mat-table [dataSource]="dataSource" matSort>
-
     <ng-container matColumnDef="name">
-      <th mat-header-cell *matHeaderCellDef mat-sort-header> {{'labels.inputs.name' | translate}} </th>
-      <td mat-cell *matCellDef="let configuration"> {{ configuration.name | translateKey:'inputs' }} </td>
+      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'labels.inputs.name' | translate }}</th>
+      <td mat-cell *matCellDef="let configuration">{{ configuration.name | translateKey: 'inputs' }}</td>
     </ng-container>
 
     <ng-container matColumnDef="value">
-      <th mat-header-cell *matHeaderCellDef mat-sort-header> {{'labels.inputs.Value' | translate}} </th>
-      <td mat-cell *matCellDef="let configuration"> {{ getConfigurationValue(configuration) }} </td>
+      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'labels.inputs.Value' | translate }}</th>
+      <td mat-cell *matCellDef="let configuration">{{ getConfigurationValue(configuration) }}</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>

src/app/system/external-services/amazon-s3/edit-amazon-s3/edit-amazon-s3.component.html

@@ -1,58 +1,71 @@
 <div class="container">
-
   <mat-card>
-
     <form [formGroup]="amazonS3ConfigurationForm" (ngSubmit)="submit()">
-
       <mat-card-content>
-
         <div fxLayout="column">
-
           <mat-form-field>
-            <mat-label>{{'labels.inputs.S3 Bucket Name' | translate}}</mat-label>
-            <input matInput required formControlName="s3_bucket_name">
+            <mat-label>{{ 'labels.inputs.S3 Bucket Name' | translate }}</mat-label>
+            <input matInput required formControlName="s3_bucket_name" />
             <mat-error *ngIf="amazonS3ConfigurationForm.controls.s3_bucket_name.hasError('required')">
-              {{'labels.inputs.S3 Bucket Name' | translate}} {{ "labels.commons.is" | translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
+              {{ 'labels.inputs.S3 Bucket Name' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
             </mat-error>
           </mat-form-field>
 
           <mat-form-field>
-            <mat-label>{{'labels.inputs.S3 Access Key' | translate}}</mat-label>
-            <input matInput required type="{{ accessKeyInputType }}" formControlName="s3_access_key">
-            <button mat-button *ngIf="amazonS3ConfigurationForm.controls.s3_access_key.value" matSuffix mat-icon-button
-              (mousedown)="accessKeyInputType = 'text'" (mouseup)="accessKeyInputType = 'password'">
+            <mat-label>{{ 'labels.inputs.S3 Access Key' | translate }}</mat-label>
+            <input matInput required type="{{ accessKeyInputType }}" formControlName="s3_access_key" />
+            <button
+              mat-button
+              *ngIf="amazonS3ConfigurationForm.controls.s3_access_key.value"
+              matSuffix
+              mat-icon-button
+              (mousedown)="accessKeyInputType = 'text'"
+              (mouseup)="accessKeyInputType = 'password'"
+            >
               <fa-icon *ngIf="accessKeyInputType === 'password'" icon="eye"></fa-icon>
               <fa-icon *ngIf="accessKeyInputType === 'text'" icon="eye-slash"></fa-icon>
             </button>
             <mat-error *ngIf="amazonS3ConfigurationForm.controls.s3_access_key.hasError('required')">
-              {{'labels.inputs.S3 Access Key' | translate}} {{ "labels.commons.is" | translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
+              {{ 'labels.inputs.S3 Access Key' | translate }} {{ 'labels.commons.is' | translate }}
+              <strong>{{ 'labels.commons.required' | translate }}</strong>
             </mat-error>
           </mat-form-field>
 
           <mat-form-field>
-            <mat-label>{{'labels.inputs.S3 Secret Key' | translate}}</mat-label>
-            <input matInput required type="{{ secretKeyInputType }}" formControlName="s3_secret_key">
-            <button mat-button *ngIf="amazonS3ConfigurationForm.controls.s3_secret_key.value" matSuffix mat-icon-button
-              (mousedown)="secretKeyInputType = 'text'" (mouseup)="secretKeyInputType = 'password'">
+            <mat-label>{{ 'labels.inputs.S3 Secret Key' | translate }}</mat-label>
+            <input matInput required type="{{ secretKeyInputType }}" formControlName="s3_secret_key" />
+            <button
+              mat-button
+              *ngIf="amazonS3ConfigurationForm.controls.s3_secret_key.value"
+              matSuffix
+              mat-icon-button
+              (mousedown)="secretKeyInputType = 'text'"
+              (mouseup)="secretKeyInputType = 'password'"
+            >
               <fa-icon *ngIf="secretKeyInputType === 'password'" icon="eye"></fa-icon>
               <fa-icon *ngIf="secretKeyInputType === 'text'" icon="eye-slash"></fa-icon>
             </button>
             <mat-error *ngIf="amazonS3ConfigurationForm.controls.s3_secret_key.hasError('required')">
-              {{'labels.inputs.S3 Secret Key' | translate}} {{ "labels.commons.is" | translate}} <strong>{{ "labels.commons.required" | translate}}</strong>
+              {{ 'labels.inputs.S3 Secret Key' | 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]="!amazonS3ConfigurationForm.valid || amazonS3ConfigurationForm.pristine">{{'labels.buttons.Submit' | translate}}</button>
+        <button type="button" mat-raised-button [routerLink]="['../']">
+          {{ 'labels.buttons.Cancel' | translate }}
+        </button>
+        <button
+          mat-raised-button
+          color="primary"
+          [disabled]="!amazonS3ConfigurationForm.valid || amazonS3ConfigurationForm.pristine"
+        >
+          {{ 'labels.buttons.Submit' | translate }}
+        </button>
       </mat-card-actions>
-
     </form>
-
   </mat-card>
-
 </div>