mirror of
https://github.com/bitwarden/browser
synced 2025-12-12 06:13:38 +00:00
[PM-2414] Angular 16 Upgrade - SetPinComponent (#7214)
* migrate to DialogService * use static method * add reactive form dependencies * begin migrating to reactive forms * migrate template inputs to use CL * update set-pin.component.ts file to work with reactive forms * migrate desktop template and class file to Dialog and ReactiveForms * update settings page * remove old properties * update settings form upon dialog close * refactor ngOnInit() * remove duplicate validator (already have a validator in class file)
This commit is contained in:
@@ -1,57 +1,63 @@
|
||||
import { DialogRef } from "@angular/cdk/dialog";
|
||||
import { Directive, OnInit } from "@angular/core";
|
||||
import { FormBuilder, Validators } from "@angular/forms";
|
||||
|
||||
import { UserVerificationService } from "@bitwarden/common/auth/abstractions/user-verification/user-verification.service.abstraction";
|
||||
import { CryptoService } from "@bitwarden/common/platform/abstractions/crypto.service";
|
||||
import { StateService } from "@bitwarden/common/platform/abstractions/state.service";
|
||||
import { Utils } from "@bitwarden/common/platform/misc/utils";
|
||||
|
||||
import { ModalRef } from "../../components/modal/modal.ref";
|
||||
|
||||
@Directive()
|
||||
export class SetPinComponent implements OnInit {
|
||||
pin = "";
|
||||
showPin = false;
|
||||
masterPassOnRestart = true;
|
||||
showMasterPassOnRestart = true;
|
||||
|
||||
setPinForm = this.formBuilder.group({
|
||||
pin: ["", [Validators.required]],
|
||||
masterPassOnRestart: true,
|
||||
});
|
||||
|
||||
constructor(
|
||||
private modalRef: ModalRef,
|
||||
private dialogRef: DialogRef,
|
||||
private cryptoService: CryptoService,
|
||||
private userVerificationService: UserVerificationService,
|
||||
private stateService: StateService,
|
||||
private formBuilder: FormBuilder,
|
||||
) {}
|
||||
|
||||
async ngOnInit() {
|
||||
this.showMasterPassOnRestart = this.masterPassOnRestart =
|
||||
await this.userVerificationService.hasMasterPassword();
|
||||
const hasMasterPassword = await this.userVerificationService.hasMasterPassword();
|
||||
|
||||
this.setPinForm.controls.masterPassOnRestart.setValue(hasMasterPassword);
|
||||
this.showMasterPassOnRestart = hasMasterPassword;
|
||||
}
|
||||
|
||||
toggleVisibility() {
|
||||
this.showPin = !this.showPin;
|
||||
}
|
||||
submit = async () => {
|
||||
const pin = this.setPinForm.get("pin").value;
|
||||
const masterPassOnRestart = this.setPinForm.get("masterPassOnRestart").value;
|
||||
|
||||
async submit() {
|
||||
if (Utils.isNullOrWhitespace(this.pin)) {
|
||||
this.modalRef.close(false);
|
||||
if (Utils.isNullOrWhitespace(pin)) {
|
||||
this.dialogRef.close(false);
|
||||
return;
|
||||
}
|
||||
|
||||
const pinKey = await this.cryptoService.makePinKey(
|
||||
this.pin,
|
||||
pin,
|
||||
await this.stateService.getEmail(),
|
||||
await this.stateService.getKdfType(),
|
||||
await this.stateService.getKdfConfig(),
|
||||
);
|
||||
const userKey = await this.cryptoService.getUserKey();
|
||||
const pinProtectedKey = await this.cryptoService.encrypt(userKey.key, pinKey);
|
||||
const encPin = await this.cryptoService.encrypt(this.pin, userKey);
|
||||
const encPin = await this.cryptoService.encrypt(pin, userKey);
|
||||
|
||||
await this.stateService.setProtectedPin(encPin.encryptedString);
|
||||
if (this.masterPassOnRestart) {
|
||||
|
||||
if (masterPassOnRestart) {
|
||||
await this.stateService.setPinKeyEncryptedUserKeyEphemeral(pinProtectedKey);
|
||||
} else {
|
||||
await this.stateService.setPinKeyEncryptedUserKey(pinProtectedKey);
|
||||
}
|
||||
|
||||
this.modalRef.close(true);
|
||||
}
|
||||
this.dialogRef.close(true);
|
||||
};
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user