Handle input error in custom input text

[github/Chocobozzz/PeerTube.git] / client / src / app / +my-account / my-account-settings / my-account-change-email / my-account-change-email.component.html

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 76886c73e21ef054a8b4a0647f6547a2e428234c..d85be846ba76baca3769b160ce1de729ac8ac5cd 100644 (file)
--- 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
@@ -1,20 +1,22 @@
 <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
 <div *ngIf="success" class="alert alert-success">{{ success }}</div>
 
-<div i18n class="current-email">
-  Your current email is <span class="email">{{ user.email }}</span>
-</div>
-
 <div i18n class="pending-email" *ngIf="user.pendingEmail">
-  <span class="email">{{ user.pendingEmail }}</span> is awaiting email verification
+  <strong>{{ user.pendingEmail }}</strong> is awaiting email verification
 </div>
 
-<form role="form" class="change-email" (ngSubmit)="changeEmail()" [formGroup]="form">
+<form role="form" class="change-email" (ngSubmit)="changeEmail()" [formGroup]="form" *ngIf="user.pluginAuth === null">
 
   <div class="form-group">
-    <label i18n for="new-email">New email</label>
+    <label i18n for="new-email">Change your email</label>
+
+    <div i18n class="form-group-description">
+      Your current email is <strong>{{ user.email }}</strong>.
+      It is never shown to the public.
+    </div>
+
     <input
-      type="email" id="new-email" i18n-placeholder placeholder="Your new email"
+      type="email" id="new-email" i18n-placeholder placeholder="New email" class="form-control"
       formControlName="new-email" [ngClass]="{ 'input-error': formErrors['new-email'] }"
     >
     <div *ngIf="formErrors['new-email']" class="form-error">
@@ -23,13 +25,10 @@
   </div>
 
   <div class="form-group">
-    <input
-      type="password" id="password" i18n-placeholder placeholder="Your password" autocomplete="off"
-      formControlName="password" [ngClass]="{ 'input-error': formErrors['password'] }"
-    >
-    <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">