fix(password-form): add better error handling (#1128)

dasch-swiss · Jul 3, 2023 · e131a39 · e131a39
1 parent d7b0922
commit e131a39
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 10 deletions.
diff --git a/apps/dsp-app/src/app/user/user-form/password-form/password-form.component.html b/apps/dsp-app/src/app/user/user-form/password-form/password-form.component.html
@@ -35,9 +35,9 @@ <h4 class="mat-subtitle-2">
                 {{ showRequesterPassword ? 'visibility_off' : 'visibility' }}
             </mat-icon>
         </button>
-        <mat-hint *ngIf="formErrors.requesterPassword">
-            {{ formErrors.requesterPassword }}
-        </mat-hint>
+        <mat-error *ngIf="confirmForm.controls['requesterPassword'].hasError('incorrectPassword')">
+            Incorrect password.
+        </mat-error>
     </mat-form-field>
     <!-- action buttons: reset and submit -->
     <div class="form-panel large-field">
@@ -100,9 +100,9 @@ <h4 class="mat-subtitle-2">
                 {{ showRequesterPassword ? 'visibility_off' : 'visibility' }}
             </mat-icon>
         </button>
-        <mat-hint *ngIf="formErrors.requesterPassword">
-            {{ formErrors.requesterPassword }}
-        </mat-hint>
+        <mat-error *ngIf="form.controls['requesterPassword'].hasError('incorrectPassword')">
+            Incorrect password.
+        </mat-error>
     </mat-form-field>
 
     <!-- two password fields: password & confirmPassword -->
@@ -200,7 +200,6 @@ <h4 class="mat-subtitle-2">
                 class="submit-progress"
             >
             </app-progress-indicator>
-            <mat-icon *ngIf="error && !loading">close</mat-icon>
             {{
                 !loading && error
                     ? ('appLabels.form.action.retry' | translate)

diff --git a/apps/dsp-app/src/app/user/user-form/password-form/password-form.component.ts b/apps/dsp-app/src/app/user/user-form/password-form/password-form.component.ts
@@ -272,8 +272,10 @@ export class PasswordFormComponent implements OnInit {
                     this.buildForm();
                     this.loading = false;
                 },
-                (error: ApiResponseError) => {
-                    this._errorHandler.showMessage(error);
+                () => {
+                    this.confirmForm.controls.requesterPassword.setErrors({
+                        incorrectPassword: true,
+                    });
                     this.loading = false;
                     this.error = true;
                 }
@@ -305,7 +307,14 @@ export class PasswordFormComponent implements OnInit {
                     this.loading = false;
                 },
                 (error: ApiResponseError) => {
-                    this._errorHandler.showMessage(error);
+                    if (error.status === 403) {
+                        // incorrect old password
+                        this.form.controls.requesterPassword.setErrors({
+                            incorrectPassword: true,
+                        });
+                    } else {
+                        this._errorHandler.showMessage(error);
+                    }
                     this.loading = false;
                     this.error = true;
                 }