Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-12-22 16:29:09 +01:00
Code Issues Projects Releases Wiki Activity

[PM-13809] - add remove password button (#11641)

Browse Source 
* add remove password button

* adjust comment

* use bitAction directive
This commit is contained in:
Jordan Aasen 2024-10-21 13:36:27 -07:00 committed by GitHub
parent c89d8a00a1
commit ecc597110b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 82 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
libs/tools/send/send-ui/src/send-form/components/options/send-options.component.html
View File

@ -12,33 +12,44 @@
>
</bit-form-field>
<bit-form-field>
<bit-label *ngIf="!shouldShowNewPassword">{{ "password" | i18n }}</bit-label>
<bit-label *ngIf="shouldShowNewPassword">{{ "newPassword" | i18n }}</bit-label>
<bit-label>{{ "password" | i18n }}</bit-label>
<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
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"
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"
buttonType="danger"
bitIconButton="bwi-minus-circle"
[appA11yTitle]="'removePassword' | i18n"
[bitAction]="removePassword"
showToast
></button>
<bit-hint>{{ "sendPasswordDescV3" | i18n }}</bit-hint>

49
libs/tools/send/send-ui/src/send-form/components/options/send-options.component.ts
View File

@ -7,14 +7,20 @@ import { firstValueFrom, map } from "rxjs";
import { JslibModule } from "@bitwarden/angular/jslib.module";
import { PolicyService } from "@bitwarden/common/admin-console/abstractions/policy/policy.service.abstraction";
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 { SendApiService } from "@bitwarden/common/tools/send/services/send-api.service.abstraction";
import {
AsyncActionsModule,
ButtonModule,
CardComponent,
CheckboxModule,
DialogService,
FormFieldModule,
IconButtonModule,
SectionComponent,
SectionHeaderComponent,
ToastService,
TypographyModule,
} from "@bitwarden/components";
import { CredentialGeneratorService, Generators } from "@bitwarden/generator-core";
@ -27,6 +33,8 @@ import { SendFormContainer } from "../../send-form-container";
templateUrl: "./send-options.component.html",
standalone: true,
imports: [
AsyncActionsModule,
ButtonModule,
CardComponent,
CheckboxModule,
CommonModule,
@ -53,7 +61,7 @@ export class SendOptionsComponent implements OnInit {
hideEmail: [false as boolean],
});
get shouldShowNewPassword(): boolean {
get hasPassword(): boolean {
return this.originalSendView && this.originalSendView.password !== null;
}
@ -71,8 +79,12 @@ export class SendOptionsComponent implements OnInit {
constructor(
private sendFormContainer: SendFormContainer,
private dialogService: DialogService,
private sendApiService: SendApiService,
private formBuilder: FormBuilder,
private policyService: PolicyService,
private i18nService: I18nService,
private toastService: ToastService,
private generatorService: CredentialGeneratorService,
) {
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() {
if (this.sendFormContainer.originalSendView) {
this.sendOptionsForm.patchValue({
maxAccessCount: this.sendFormContainer.originalSendView.maxAccessCount,
accessCount: this.sendFormContainer.originalSendView.accessCount,
password: null,
password: this.hasPassword ? "************" : null, // 12 masked characters as a placeholder
hideEmail: this.sendFormContainer.originalSendView.hideEmail,
notes: this.sendFormContainer.originalSendView.notes,
});
}
if (this.hasPassword) {
this.sendOptionsForm.get("password")?.disable();
}
if (!this.config.areSendsAllowed) {
this.sendOptionsForm.disable();
}