bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2026-02-24 08:33:29 +00:00
Code Issues Releases Wiki Activity

[PM-12681] Enable new Send Add/Edit Dialog on web (#13361)

Browse Source 
* Create web-specific new-send-dropdown component

* Create web-specifc Send Add/Edit dialog

* Use new-send-dropdown and replace old Send Add/Edit with new Add/Edit dialog

* Delete old Send Add/Edit component

* Remove unused entries from en/messages.json

* Add cancel button to close dialog

* Remove unused RouterLink

* Fix typechecking issue

* Use observable to show/hide premium badge

* Add documentation

* Move assignment of observable into ctor, as it no longer requires a promise for assignment

---------

Co-authored-by: Daniel James Smith <djsmith85@users.noreply.github.com>
This commit is contained in:
Daniel James Smith
2025-03-04 16:09:37 +01:00
committed by GitHub
parent 0d68d22b98
commit bfbad99fb7
10 changed files with 393 additions and 471 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
apps/web/src/app/tools/send/send.component.ts
View File

@@ -1,6 +1,7 @@
// FIXME: Update this file to be type safe and remove this and next line
// @ts-strict-ignore
import { Component, NgZone, ViewChild, OnInit, OnDestroy, ViewContainerRef } from "@angular/core";
import { DialogRef } from "@angular/cdk/dialog";
import { Component, NgZone, OnInit, OnDestroy } from "@angular/core";
import { lastValueFrom } from "rxjs";
import { SendComponent as BaseSendComponent } from "@bitwarden/angular/tools/send/send.component";
@@ -14,6 +15,7 @@ import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/pl
import { SendView } from "@bitwarden/common/tools/send/models/view/send.view";
import { SendApiService } from "@bitwarden/common/tools/send/services/send-api.service.abstraction";
import { SendService } from "@bitwarden/common/tools/send/services/send.service.abstraction";
import { SendId } from "@bitwarden/common/types/guid";
import {
DialogService,
NoItemsModule,
@@ -21,24 +23,25 @@ import {
TableDataSource,
ToastService,
} from "@bitwarden/components";
import { NoSendsIcon } from "@bitwarden/send-ui";
import { DefaultSendFormConfigService, NoSendsIcon, SendFormConfig } from "@bitwarden/send-ui";
import { HeaderModule } from "../../layouts/header/header.module";
import { SharedModule } from "../../shared";
import { AddEditComponent } from "./add-edit.component";
import { NewSendDropdownComponent } from "./new-send/new-send-dropdown.component";
import { SendAddEditComponent, SendItemDialogResult } from "./send-add-edit.component";
const BroadcasterSubscriptionId = "SendComponent";
@Component({
selector: "app-send",
standalone: true,
imports: [SharedModule, SearchModule, NoItemsModule, HeaderModule],
imports: [SharedModule, SearchModule, NoItemsModule, HeaderModule, NewSendDropdownComponent],
templateUrl: "send.component.html",
providers: [DefaultSendFormConfigService],
})
export class SendComponent extends BaseSendComponent implements OnInit, OnDestroy {
@ViewChild("sendAddEdit", { read: ViewContainerRef, static: true })
sendAddEditModalRef: ViewContainerRef;
private sendItemDialogRef?: DialogRef<SendItemDialogResult> | undefined;
noItemIcon = NoSendsIcon;
override set filteredSends(filteredSends: SendView[]) {
@@ -65,6 +68,7 @@ export class SendComponent extends BaseSendComponent implements OnInit, OnDestro
sendApiService: SendApiService,
dialogService: DialogService,
toastService: ToastService,
private addEditFormConfigService: DefaultSendFormConfigService,
) {
super(
sendService,
@@ -111,17 +115,41 @@ export class SendComponent extends BaseSendComponent implements OnInit, OnDestro
return;
}
await this.editSend(null);
const config = await this.addEditFormConfigService.buildConfig("add", null, 0);
await this.openSendItemDialog(config);
}
async editSend(send: SendView) {
const dialog = this.dialogService.open(AddEditComponent, {
data: {
sendId: send == null ? null : send.id,
},
const config = await this.addEditFormConfigService.buildConfig(
send == null ? "add" : "edit",
send == null ? null : (send.id as SendId),
send.type,
);
await this.openSendItemDialog(config);
}
/**
* Opens the send item dialog.
* @param formConfig The form configuration.
* */
async openSendItemDialog(formConfig: SendFormConfig) {
// Prevent multiple dialogs from being opened.
if (this.sendItemDialogRef) {
return;
}
this.sendItemDialogRef = SendAddEditComponent.open(this.dialogService, {
formConfig,
});
await lastValueFrom(dialog.closed);
await this.load();
const result = await lastValueFrom(this.sendItemDialogRef.closed);
this.sendItemDialogRef = undefined;
// If the dialog was closed by deleting the cipher, refresh the vault.
if (result === SendItemDialogResult.Deleted || result === SendItemDialogResult.Saved) {
await this.load();
}
}
}