mirror of
https://github.com/bitwarden/browser.git
synced 2024-10-24 08:09:59 +02:00
[PM-13809] - add remove password button (#11641)
* add remove password button * adjust comment * use bitAction directive
This commit is contained in:
parent
c89d8a00a1
commit
ecc597110b
@ -12,33 +12,44 @@
|
|||||||
>
|
>
|
||||||
</bit-form-field>
|
</bit-form-field>
|
||||||
<bit-form-field>
|
<bit-form-field>
|
||||||
<bit-label *ngIf="!shouldShowNewPassword">{{ "password" | i18n }}</bit-label>
|
<bit-label>{{ "password" | i18n }}</bit-label>
|
||||||
<bit-label *ngIf="shouldShowNewPassword">{{ "newPassword" | i18n }}</bit-label>
|
|
||||||
<input bitInput type="password" formControlName="password" />
|
<input bitInput type="password" formControlName="password" />
|
||||||
|
<ng-container *ngIf="!hasPassword">
|
||||||
|
<button
|
||||||
|
data-testid="toggle-visibility-for-password"
|
||||||
|
type="button"
|
||||||
|
bitIconButton
|
||||||
|
bitSuffix
|
||||||
|
bitPasswordInputToggle
|
||||||
|
></button>
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
bitIconButton="bwi-generate"
|
||||||
|
bitSuffix
|
||||||
|
[appA11yTitle]="'generatePassword' | i18n"
|
||||||
|
[disabled]="!config.areSendsAllowed"
|
||||||
|
(click)="generatePassword()"
|
||||||
|
data-testid="generate-password"
|
||||||
|
></button>
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
bitIconButton="bwi-clone"
|
||||||
|
bitSuffix
|
||||||
|
[appA11yTitle]="'copyPassword' | i18n"
|
||||||
|
[disabled]="!config.areSendsAllowed || !sendOptionsForm.get('password').value"
|
||||||
|
[valueLabel]="'password' | i18n"
|
||||||
|
[appCopyClick]="sendOptionsForm.get('password').value"
|
||||||
|
showToast
|
||||||
|
></button>
|
||||||
|
</ng-container>
|
||||||
<button
|
<button
|
||||||
data-testid="toggle-visibility-for-password"
|
*ngIf="hasPassword"
|
||||||
|
class="tw-border-l-0 last:tw-rounded-r focus-visible:tw-border-l focus-visible:tw-ml-[-1px]"
|
||||||
type="button"
|
type="button"
|
||||||
bitIconButton
|
buttonType="danger"
|
||||||
bitSuffix
|
bitIconButton="bwi-minus-circle"
|
||||||
bitPasswordInputToggle
|
[appA11yTitle]="'removePassword' | i18n"
|
||||||
></button>
|
[bitAction]="removePassword"
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
bitIconButton="bwi-generate"
|
|
||||||
bitSuffix
|
|
||||||
[appA11yTitle]="'generatePassword' | i18n"
|
|
||||||
[disabled]="!config.areSendsAllowed"
|
|
||||||
(click)="generatePassword()"
|
|
||||||
data-testid="generate-password"
|
|
||||||
></button>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
bitIconButton="bwi-clone"
|
|
||||||
bitSuffix
|
|
||||||
[appA11yTitle]="'copyPassword' | i18n"
|
|
||||||
[disabled]="!config.areSendsAllowed || !sendOptionsForm.get('password').value"
|
|
||||||
[valueLabel]="'password' | i18n"
|
|
||||||
[appCopyClick]="sendOptionsForm.get('password').value"
|
|
||||||
showToast
|
showToast
|
||||||
></button>
|
></button>
|
||||||
<bit-hint>{{ "sendPasswordDescV3" | i18n }}</bit-hint>
|
<bit-hint>{{ "sendPasswordDescV3" | i18n }}</bit-hint>
|
||||||
|
@ -7,14 +7,20 @@ import { firstValueFrom, map } from "rxjs";
|
|||||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||||
import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction";
|
import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction";
|
||||||
import { PolicyType } from "@bitwarden/common/admin-console/enums";
|
import { PolicyType } from "@bitwarden/common/admin-console/enums";
|
||||||
|
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||||
import { SendView } from "@bitwarden/common/tools/send/models/view/send.view";
|
import { SendView } from "@bitwarden/common/tools/send/models/view/send.view";
|
||||||
|
import { SendApiService } from "@bitwarden/common/tools/send/services/send-api.service.abstraction";
|
||||||
import {
|
import {
|
||||||
|
AsyncActionsModule,
|
||||||
|
ButtonModule,
|
||||||
CardComponent,
|
CardComponent,
|
||||||
CheckboxModule,
|
CheckboxModule,
|
||||||
|
DialogService,
|
||||||
FormFieldModule,
|
FormFieldModule,
|
||||||
IconButtonModule,
|
IconButtonModule,
|
||||||
SectionComponent,
|
SectionComponent,
|
||||||
SectionHeaderComponent,
|
SectionHeaderComponent,
|
||||||
|
ToastService,
|
||||||
TypographyModule,
|
TypographyModule,
|
||||||
} from "@bitwarden/components";
|
} from "@bitwarden/components";
|
||||||
import { CredentialGeneratorService, Generators } from "@bitwarden/generator-core";
|
import { CredentialGeneratorService, Generators } from "@bitwarden/generator-core";
|
||||||
@ -27,6 +33,8 @@ import { SendFormContainer } from "../../send-form-container";
|
|||||||
templateUrl: "./send-options.component.html",
|
templateUrl: "./send-options.component.html",
|
||||||
standalone: true,
|
standalone: true,
|
||||||
imports: [
|
imports: [
|
||||||
|
AsyncActionsModule,
|
||||||
|
ButtonModule,
|
||||||
CardComponent,
|
CardComponent,
|
||||||
CheckboxModule,
|
CheckboxModule,
|
||||||
CommonModule,
|
CommonModule,
|
||||||
@ -53,7 +61,7 @@ export class SendOptionsComponent implements OnInit {
|
|||||||
hideEmail: [false as boolean],
|
hideEmail: [false as boolean],
|
||||||
});
|
});
|
||||||
|
|
||||||
get shouldShowNewPassword(): boolean {
|
get hasPassword(): boolean {
|
||||||
return this.originalSendView && this.originalSendView.password !== null;
|
return this.originalSendView && this.originalSendView.password !== null;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -71,8 +79,12 @@ export class SendOptionsComponent implements OnInit {
|
|||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private sendFormContainer: SendFormContainer,
|
private sendFormContainer: SendFormContainer,
|
||||||
|
private dialogService: DialogService,
|
||||||
|
private sendApiService: SendApiService,
|
||||||
private formBuilder: FormBuilder,
|
private formBuilder: FormBuilder,
|
||||||
private policyService: PolicyService,
|
private policyService: PolicyService,
|
||||||
|
private i18nService: I18nService,
|
||||||
|
private toastService: ToastService,
|
||||||
private generatorService: CredentialGeneratorService,
|
private generatorService: CredentialGeneratorService,
|
||||||
) {
|
) {
|
||||||
this.sendFormContainer.registerChildForm("sendOptionsForm", this.sendOptionsForm);
|
this.sendFormContainer.registerChildForm("sendOptionsForm", this.sendOptionsForm);
|
||||||
@ -110,16 +122,49 @@ export class SendOptionsComponent implements OnInit {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
removePassword = async () => {
|
||||||
|
if (!this.originalSendView || !this.originalSendView.password) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const confirmed = await this.dialogService.openSimpleDialog({
|
||||||
|
title: { key: "removePassword" },
|
||||||
|
content: { key: "removePasswordConfirmation" },
|
||||||
|
type: "warning",
|
||||||
|
});
|
||||||
|
|
||||||
|
if (!confirmed) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
await this.sendApiService.removePassword(this.originalSendView.id);
|
||||||
|
|
||||||
|
this.toastService.showToast({
|
||||||
|
variant: "success",
|
||||||
|
title: null,
|
||||||
|
message: this.i18nService.t("removedPassword"),
|
||||||
|
});
|
||||||
|
|
||||||
|
this.originalSendView.password = null;
|
||||||
|
this.sendOptionsForm.patchValue({
|
||||||
|
password: null,
|
||||||
|
});
|
||||||
|
this.sendOptionsForm.get("password")?.enable();
|
||||||
|
};
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
if (this.sendFormContainer.originalSendView) {
|
if (this.sendFormContainer.originalSendView) {
|
||||||
this.sendOptionsForm.patchValue({
|
this.sendOptionsForm.patchValue({
|
||||||
maxAccessCount: this.sendFormContainer.originalSendView.maxAccessCount,
|
maxAccessCount: this.sendFormContainer.originalSendView.maxAccessCount,
|
||||||
accessCount: this.sendFormContainer.originalSendView.accessCount,
|
accessCount: this.sendFormContainer.originalSendView.accessCount,
|
||||||
password: null,
|
password: this.hasPassword ? "************" : null, // 12 masked characters as a placeholder
|
||||||
hideEmail: this.sendFormContainer.originalSendView.hideEmail,
|
hideEmail: this.sendFormContainer.originalSendView.hideEmail,
|
||||||
notes: this.sendFormContainer.originalSendView.notes,
|
notes: this.sendFormContainer.originalSendView.notes,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
if (this.hasPassword) {
|
||||||
|
this.sendOptionsForm.get("password")?.disable();
|
||||||
|
}
|
||||||
|
|
||||||
if (!this.config.areSendsAllowed) {
|
if (!this.config.areSendsAllowed) {
|
||||||
this.sendOptionsForm.disable();
|
this.sendOptionsForm.disable();
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user