-
Notifications
You must be signed in to change notification settings - Fork 1.1k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
PM-1943 Migrate Recover Delete Component (#9169)
* PM-1943 Migrate Recover Delete Component * PM-1943 Anon layout changes done * PM-1943 - await navigate * PM-1943 - Add new anon layout wrapper env selector. --------- Co-authored-by: Jared Snider <[email protected]>
- Loading branch information
1 parent
88dc574
commit d5e0ab7
Showing
3 changed files
with
44 additions
and
70 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,44 +1,16 @@ | ||
| <form #form (ngSubmit)="submit()" [appApiAction]="formPromise" class="container" ngNativeValidate> | ||
| <div class="row justify-content-md-center mt-5"> | ||
| <div class="col-5"> | ||
| <p class="lead text-center mb-4">{{ "deleteAccount" | i18n }}</p> | ||
| <div class="card"> | ||
| <div class="card-body"> | ||
| <p>{{ "deleteRecoverDesc" | i18n }}</p> | ||
| <div class="form-group"> | ||
| <label for="email">{{ "emailAddress" | i18n }}</label> | ||
| <input | ||
| id="email" | ||
| class="form-control" | ||
| type="text" | ||
| name="Email" | ||
| [(ngModel)]="email" | ||
| required | ||
| appAutofocus | ||
| inputmode="email" | ||
| appInputVerbatim="false" | ||
| /> | ||
| </div> | ||
| <hr /> | ||
| <div class="d-flex"> | ||
| <button | ||
| type="submit" | ||
| class="btn btn-primary btn-block btn-submit" | ||
| [disabled]="form.loading" | ||
| > | ||
| <span>{{ "submit" | i18n }}</span> | ||
| <i | ||
| class="bwi bwi-spinner bwi-spin" | ||
| title="{{ 'loading' | i18n }}" | ||
| aria-hidden="true" | ||
| ></i> | ||
| </button> | ||
| <a routerLink="/login" class="btn btn-outline-secondary btn-block ml-2 mt-0"> | ||
| {{ "cancel" | i18n }} | ||
| </a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <form [formGroup]="recoverDeleteForm" [bitSubmit]="submit"> | ||
| <p bitTypography="body1">{{ "deleteRecoverDesc" | i18n }}</p> | ||
| <bit-form-field> | ||
| <bit-label>{{ "emailAddress" | i18n }}</bit-label> | ||
| <input bitInput appAutofocus appInputVerbatim="false" type="email" formControlName="email" /> | ||
| </bit-form-field> | ||
| <hr /> | ||
| <div class="tw-flex tw-gap-2"> | ||
| <button type="submit" bitButton bitFormButton buttonType="primary" [block]="true"> | ||
| {{ "submit" | i18n }} | ||
| </button> | ||
| <a bitButton buttonType="secondary" routerLink="/login" [block]="true"> | ||
| {{ "cancel" | i18n }} | ||
| </a> | ||
| </div> | ||
| </form> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,44 +1,38 @@ | ||
| import { Component } from "@angular/core"; | ||
| import { FormControl, FormGroup, Validators } from "@angular/forms"; | ||
| import { Router } from "@angular/router"; | ||
|
|
||
| import { ApiService } from "@bitwarden/common/abstractions/api.service"; | ||
| import { DeleteRecoverRequest } from "@bitwarden/common/models/request/delete-recover.request"; | ||
| import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service"; | ||
| import { LogService } from "@bitwarden/common/platform/abstractions/log.service"; | ||
| import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service"; | ||
|
|
||
| @Component({ | ||
| selector: "app-recover-delete", | ||
| templateUrl: "recover-delete.component.html", | ||
| }) | ||
| export class RecoverDeleteComponent { | ||
| email: string; | ||
| formPromise: Promise<any>; | ||
| protected recoverDeleteForm = new FormGroup({ | ||
| email: new FormControl(null, [Validators.required]), | ||
| }); | ||
|
|
||
| constructor( | ||
| private router: Router, | ||
| private apiService: ApiService, | ||
| private platformUtilsService: PlatformUtilsService, | ||
| private i18nService: I18nService, | ||
| private logService: LogService, | ||
| ) {} | ||
|
|
||
| async submit() { | ||
| try { | ||
| const request = new DeleteRecoverRequest(); | ||
| request.email = this.email.trim().toLowerCase(); | ||
| this.formPromise = this.apiService.postAccountRecoverDelete(request); | ||
| await this.formPromise; | ||
| this.platformUtilsService.showToast( | ||
| "success", | ||
| null, | ||
| this.i18nService.t("deleteRecoverEmailSent"), | ||
| ); | ||
| // FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling. | ||
| // eslint-disable-next-line @typescript-eslint/no-floating-promises | ||
| this.router.navigate(["/"]); | ||
| } catch (e) { | ||
| this.logService.error(e); | ||
| } | ||
| } | ||
| submit = async () => { | ||
| const request = new DeleteRecoverRequest(); | ||
| request.email = this.recoverDeleteForm.value.email.trim().toLowerCase(); | ||
| await this.apiService.postAccountRecoverDelete(request); | ||
| this.platformUtilsService.showToast( | ||
| "success", | ||
| null, | ||
| this.i18nService.t("deleteRecoverEmailSent"), | ||
| ); | ||
|
|
||
| await this.router.navigate(["/"]); | ||
| }; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters