FEAT hide passwords in profil

src/frontend/app/profile/profile.component.html

@@ -32,17 +32,19 @@
                     </mat-expansion-panel-header>
                     <ng-container *ngIf="showPassword">
                         <mat-form-field class="input-row">
-                            <input name="currentPassword" matInput [(ngModel)]="password.currentPassword" placeholder="Mot de passe actuel"
-                                type="password">
+                            <input name="currentPassword" matInput [(ngModel)]="password.currentPassword" placeholder="Mot de passe actuel" [type]="hideCurrentPassword ? 'password' : 'text'">
+                            <mat-icon matSuffix (click)="hideCurrentPassword = !hideCurrentPassword" class="fa fa-2x" [ngClass]="[hideCurrentPassword ? 'fa-eye-slash' : 'fa-eye']"></mat-icon>
                         </mat-form-field>
                         <mat-form-field class="input-row">
-                            <input name="newPassword" matInput [(ngModel)]="password.newPassword" placeholder="Nouveau mot de passe"
-                                type="password" (keyup)="checkPasswordValidity(password.newPassword)">
+                            <input name="newPassword" matInput [(ngModel)]="password.newPassword" placeholder="Nouveau mot de passe" [type]="hideNewPassword ? 'password' : 'text'" 
+                            (keyup)="checkPasswordValidity(password.newPassword)">
+                            <mat-icon matSuffix (click)="hideNewPassword = !hideNewPassword" class="fa fa-2x" [ngClass]="[hideNewPassword ? 'fa-eye-slash' : 'fa-eye']"></mat-icon>
                             <mat-hint style="color:red;">{{handlePassword.errorMsg}}</mat-hint>
                         </mat-form-field>
                         <mat-form-field class="input-row">
                             <input name="passwordConfirmation" matInput [(ngModel)]="password.passwordConfirmation"
-                                placeholder="Confirmer le nouveau mot de passe" type="password">
+                                placeholder="Confirmer le nouveau mot de passe" [type]="hideNewPasswordConfirm ? 'password' : 'text'">
+                                <mat-icon matSuffix (click)="hideNewPasswordConfirm = !hideNewPasswordConfirm" class="fa fa-2x" [ngClass]="[hideNewPasswordConfirm ? 'fa-eye-slash' : 'fa-eye']"></mat-icon>
                             <mat-hint style="color:red;" *ngIf="password.passwordConfirmation !== password.newPassword">Les
                                 mots de passe ne correspondent pas !</mat-hint>
                             <mat-hint style="color:green;" *ngIf="password.passwordConfirmation === password.newPassword && password.newPassword.length > 0 && password.passwordConfirmation.length> 0">Les

src/frontend/app/profile/profile.component.ts

@@ -20,7 +20,9 @@ export class ProfileComponent implements OnInit {
     @Input('snavLeftComponent') snavLeftComponent: MatSidenav;
 
     profileInfo: any = {};
-
+    hideCurrentPassword: Boolean = true;
+    hideNewPassword: Boolean = true;
+    hideNewPasswordConfirm: Boolean = true;
 
     // HANDLE PASSWORD
     passwordRules: any = {