mirror of
https://github.com/bitwarden/browser.git
synced 2024-11-22 11:45:59 +01:00
PM-4960 Migrate Verify Recover Delete Component (#9171)
* PM-4960 Migrate Verify Recover Delete Component * PM-4960 Minor fix * PM-4960 Addressed review comments
This commit is contained in:
parent
a427ec371a
commit
dfd4479a9c
@ -1,34 +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">
|
||||
<app-callout type="warning">{{ "deleteAccountWarning" | i18n }}</app-callout>
|
||||
<p class="text-center">
|
||||
<strong>{{ email }}</strong>
|
||||
</p>
|
||||
<p>{{ "deleteRecoverConfirmDesc" | i18n }}</p>
|
||||
<hr />
|
||||
<div class="d-flex">
|
||||
<button
|
||||
type="submit"
|
||||
class="btn btn-danger btn-block btn-submit"
|
||||
[disabled]="form.loading"
|
||||
>
|
||||
<span>{{ "deleteAccount" | 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 [bitSubmit]="submit" [formGroup]="formGroup">
|
||||
<app-callout type="warning">{{ "deleteAccountWarning" | i18n }}</app-callout>
|
||||
<p bitTypography="body1" class="tw-text-center">
|
||||
<strong>{{ email }}</strong>
|
||||
</p>
|
||||
<p bitTypography="body1">{{ "deleteRecoverConfirmDesc" | i18n }}</p>
|
||||
<hr />
|
||||
<div class="tw-flex tw-gap-2">
|
||||
<button type="submit" bitButton bitFormButton buttonType="danger" [block]="true">
|
||||
{{ "deleteAccount" | i18n }}
|
||||
</button>
|
||||
<a bitButton buttonType="secondary" routerLink="/login" [block]="true">
|
||||
{{ "cancel" | i18n }}
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
|
@ -1,11 +1,11 @@
|
||||
import { Component, OnInit } from "@angular/core";
|
||||
import { FormGroup } from "@angular/forms";
|
||||
import { ActivatedRoute, Router } from "@angular/router";
|
||||
import { first } from "rxjs/operators";
|
||||
|
||||
import { ApiService } from "@bitwarden/common/abstractions/api.service";
|
||||
import { VerifyDeleteRecoverRequest } from "@bitwarden/common/models/request/verify-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({
|
||||
@ -15,10 +15,10 @@ import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/pl
|
||||
// eslint-disable-next-line rxjs-angular/prefer-takeuntil
|
||||
export class VerifyRecoverDeleteComponent implements OnInit {
|
||||
email: string;
|
||||
formPromise: Promise<any>;
|
||||
|
||||
private userId: string;
|
||||
private token: string;
|
||||
protected formGroup = new FormGroup({});
|
||||
|
||||
constructor(
|
||||
private router: Router,
|
||||
@ -26,7 +26,6 @@ export class VerifyRecoverDeleteComponent implements OnInit {
|
||||
private platformUtilsService: PlatformUtilsService,
|
||||
private i18nService: I18nService,
|
||||
private route: ActivatedRoute,
|
||||
private logService: LogService,
|
||||
) {}
|
||||
|
||||
ngOnInit() {
|
||||
@ -37,28 +36,19 @@ export class VerifyRecoverDeleteComponent implements OnInit {
|
||||
this.token = qParams.token;
|
||||
this.email = qParams.email;
|
||||
} else {
|
||||
// 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(["/"]);
|
||||
await this.router.navigate(["/"]);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
async submit() {
|
||||
try {
|
||||
const request = new VerifyDeleteRecoverRequest(this.userId, this.token);
|
||||
this.formPromise = this.apiService.postAccountRecoverDeleteToken(request);
|
||||
await this.formPromise;
|
||||
this.platformUtilsService.showToast(
|
||||
"success",
|
||||
this.i18nService.t("accountDeleted"),
|
||||
this.i18nService.t("accountDeletedDesc"),
|
||||
);
|
||||
// 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 VerifyDeleteRecoverRequest(this.userId, this.token);
|
||||
await this.apiService.postAccountRecoverDeleteToken(request);
|
||||
this.platformUtilsService.showToast(
|
||||
"success",
|
||||
this.i18nService.t("accountDeleted"),
|
||||
this.i18nService.t("accountDeletedDesc"),
|
||||
);
|
||||
await this.router.navigate(["/"]);
|
||||
};
|
||||
}
|
||||
|
@ -136,12 +136,6 @@ const routes: Routes = [
|
||||
data: { titleId: "acceptFamilySponsorship", doNotSaveUrl: false } satisfies DataProperties,
|
||||
},
|
||||
{ path: "recover", pathMatch: "full", redirectTo: "recover-2fa" },
|
||||
{
|
||||
path: "verify-recover-delete",
|
||||
component: VerifyRecoverDeleteComponent,
|
||||
canActivate: [UnauthGuard],
|
||||
data: { titleId: "deleteAccount" } satisfies DataProperties,
|
||||
},
|
||||
{
|
||||
path: "verify-recover-delete-org",
|
||||
component: VerifyRecoverDeleteOrgComponent,
|
||||
@ -330,6 +324,20 @@ const routes: Routes = [
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: "verify-recover-delete",
|
||||
canActivate: [unauthGuardFn()],
|
||||
children: [
|
||||
{
|
||||
path: "",
|
||||
component: VerifyRecoverDeleteComponent,
|
||||
data: {
|
||||
pageTitle: "deleteAccount",
|
||||
titleId: "deleteAccount",
|
||||
} satisfies DataProperties & AnonLayoutWrapperData,
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: "remove-password",
|
||||
component: RemovePasswordComponent,
|
||||
|
Loading…
Reference in New Issue
Block a user