Handle input error in custom input text

2 files changed, 16 insertions, 32 deletions

diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.html b/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.html
index c9f9d8f55..d85be846b 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.html
+++ b/client/src/app/+my-account/my-account-settings/my-account-change-email/my-account-change-email.component.html
@@ -25,14 +25,10 @@
   </div>
 
   <div class="form-group">
-    <my-input-text formControlName="password"
-                            id="password"
-                            i18n-placeholder placeholder="Current password"
-                            [ngClass]="{ 'input-error': formErrors['password'] }"
-                            autocomplete="current-password"></my-input-text>
-    <div *ngIf="formErrors['password']" class="form-error">
-      {{ formErrors['password'] }}
-    </div>
+    <my-input-text
+      formControlName="password" id="password" i18n-placeholder placeholder="Current password"
+      [formError]="formErrors['password']" autocomplete="current-password"
+    ></my-input-text>
   </div>
 
   <input type="submit" i18n-value value="Change email" [disabled]="!form.valid">
diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html
index f1deb4273..f961d3294 100644
--- a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html
+++ b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html
@@ -3,32 +3,20 @@
 <form role="form" (ngSubmit)="changePassword()" [formGroup]="form">
 
   <label i18n for="current-password">Change password</label>
-  <my-input-text formControlName="current-password"
-                          inputId="current-password"
-                          i18n-placeholder placeholder="Current password"
-                          [ngClass]="{ 'input-error': formErrors['current-password'] }"
-                          autocomplete="current-password"></my-input-text>
-  <div *ngIf="formErrors['current-password']" class="form-error">
-    {{ formErrors['current-password'] }}
-  </div>
+  <my-input-text
+    formControlName="current-password" inputId="current-password" i18n-placeholder placeholder="Current password"
+    [formError]="formErrors['current-password']" autocomplete="current-password"
+  ></my-input-text>
 
-  <my-input-text formControlName="new-password"
-                          inputId="new-password"
-                          i18n-placeholder placeholder="New password"
-                          [ngClass]="{ 'input-error': formErrors['new-password'] }"
-                          autocomplete="new-password"></my-input-text>
-  <div *ngIf="formErrors['new-password']" class="form-error">
-    {{ formErrors['new-password'] }}
-  </div>
+  <my-input-text
+    formControlName="new-password" inputId="new-password" i18n-placeholder placeholder="New password"
+    [formError]="formErrors['new-password']" autocomplete="new-password"
+  ></my-input-text>
 
-  <my-input-text formControlName="new-confirmed-password"
-                          inputId="new-confirmed-password"
-                          i18n-placeholder placeholder="Confirm new password"
-                          [ngClass]="{ 'input-error': formErrors['new-confirmed-password'] }"
-                          autocomplete="new-password"></my-input-text>
-  <div *ngIf="formErrors['new-confirmed-password']" class="form-error">
-    {{ formErrors['new-confirmed-password'] }}
-  </div>
+  <my-input-text
+    formControlName="new-confirmed-password" inputId="new-confirmed-password" i18n-placeholder placeholder="Confirm new password"
+    [formError]="formErrors['new-confirmed-password']" autocomplete="new-password"
+  ></my-input-text>
 
   <input type="submit" i18n-value value="Change password" [disabled]="!form.valid">
 </form>