Add autocomplete

src-ui/src/app/components/common/input/password/password.component.html

@@ -1,7 +1,7 @@
 <div class="mb-3">
   <label class="form-label" [for]="inputId">{{title}}</label>
   <div class="input-group" [class.is-invalid]="error">
-    <input #inputField [type]="showReveal && textVisible ? 'text' : 'password'" class="form-control" [class.is-invalid]="error" [id]="inputId" [(ngModel)]="value" (focus)="onFocus()" (focusout)="onFocusOut()" (change)="onChange(value)" [disabled]="disabled">
+    <input #inputField [type]="showReveal && textVisible ? 'text' : 'password'" class="form-control" [class.is-invalid]="error" [id]="inputId" [(ngModel)]="value" (focus)="onFocus()" (focusout)="onFocusOut()" (change)="onChange(value)" [disabled]="disabled" [autocomplete]="autocomplete">
     <button *ngIf="showReveal" type="button" class="btn btn-outline-secondary" (click)="toggleVisibility()" i18n-title title="Show password" [disabled]="disabled || disableRevealToggle">
       <svg width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor">
         <use xlink:href="assets/bootstrap-icons.svg#eye" />

src-ui/src/app/components/common/input/password/password.component.ts

@@ -18,6 +18,9 @@ export class PasswordComponent extends AbstractInputComponent<string> {
   @Input()
   showReveal: boolean = false
 
+  @Input()
+  autocomplete: string
+
   public textVisible: boolean = false
 
   public toggleVisibility(): void {

src-ui/src/app/components/common/input/text/text.component.html

@@ -9,7 +9,7 @@
       </button>
     </div>
     <div class="position-relative" [class.col-md-9]="horizontal">
-      <input #inputField type="text" class="form-control" [class.is-invalid]="error" [id]="inputId" [(ngModel)]="value" (change)="onChange(value)" [disabled]="disabled">
+      <input #inputField type="text" class="form-control" [class.is-invalid]="error" [id]="inputId" [(ngModel)]="value" (change)="onChange(value)" [disabled]="disabled" [autocomplete]="autocomplete">
       <small *ngIf="hint" class="form-text text-muted" [innerHTML]="hint | safeHtml"></small>
       <div class="invalid-feedback position-absolute top-100">
         {{error}}

src-ui/src/app/components/common/input/text/text.component.ts

@@ -1,4 +1,4 @@
-import { Component, forwardRef } from '@angular/core'
+import { Component, Input, forwardRef } from '@angular/core'
 import { NG_VALUE_ACCESSOR } from '@angular/forms'
 import { AbstractInputComponent } from '../abstract-input'
 
@@ -15,6 +15,9 @@ import { AbstractInputComponent } from '../abstract-input'
   styleUrls: ['./text.component.scss'],
 })
 export class TextComponent extends AbstractInputComponent<string> {
+  @Input()
+  autocomplete: string
+
   constructor() {
     super()
   }

src-ui/src/app/components/common/profile-edit-dialog/profile-edit-dialog.component.html

@@ -10,17 +10,17 @@
           <div ngbAccordionItem="first" [collapsed]="!showEmailConfirm" class="border-0 bg-transparent">
             <div ngbAccordionCollapse>
               <div ngbAccordionBody class="p-0 pb-3">
-                <pngx-input-text i18n-title title="Confirm Email" formControlName="email_confirm" (keyup)="onEmailConfirmKeyUp($event)" [error]="error?.email_confirm"></pngx-input-text>
+                <pngx-input-text i18n-title title="Confirm Email" formControlName="email_confirm" (keyup)="onEmailConfirmKeyUp($event)" autocomplete="email" [error]="error?.email_confirm"></pngx-input-text>
               </div>
             </div>
           </div>
         </div>
-        <pngx-input-password i18n-title title="Password" formControlName="password" (keyup)="onPasswordKeyUp($event)" [showReveal]="true" [error]="error?.password"></pngx-input-password>
+        <pngx-input-password i18n-title title="Password" formControlName="password" (keyup)="onPasswordKeyUp($event)" [showReveal]="true" autocomplete="current-password" [error]="error?.password"></pngx-input-password>
         <div ngbAccordion>
           <div ngbAccordionItem="first" [collapsed]="!showPasswordConfirm" class="border-0 bg-transparent">
             <div ngbAccordionCollapse>
               <div ngbAccordionBody class="p-0 pb-3">
-                <pngx-input-password i18n-title title="Confirm Password" formControlName="password_confirm" (keyup)="onPasswordConfirmKeyUp($event)" [error]="error?.password_confirm"></pngx-input-password>
+                <pngx-input-password i18n-title title="Confirm Password" formControlName="password_confirm" (keyup)="onPasswordConfirmKeyUp($event)" autocomplete="new-password" [error]="error?.password_confirm"></pngx-input-password>
               </div>
             </div>
           </div>