From 924696b5cbe9bb7c075b86cfe00024fd6df3feff Mon Sep 17 00:00:00 2001 From: Daniel James Smith Date: Thu, 16 Jan 2025 13:28:02 +0100 Subject: [PATCH] Remove v1 generator UI from desktop --- apps/desktop/src/app/app.component.ts | 40 +- apps/desktop/src/app/app.module.ts | 4 - .../src/app/tools/generator.component.html | 636 ------------------ .../src/app/tools/generator.component.spec.ts | 90 --- .../src/app/tools/generator.component.ts | 48 -- .../password-generator-history.component.html | 52 -- .../password-generator-history.component.ts | 22 - apps/desktop/src/scss/misc.scss | 38 -- .../src/vault/app/vault/vault.component.html | 4 +- .../src/vault/app/vault/vault.component.ts | 68 +- 10 files changed, 17 insertions(+), 985 deletions(-) delete mode 100644 apps/desktop/src/app/tools/generator.component.html delete mode 100644 apps/desktop/src/app/tools/generator.component.spec.ts delete mode 100644 apps/desktop/src/app/tools/generator.component.ts delete mode 100644 apps/desktop/src/app/tools/password-generator-history.component.html delete mode 100644 apps/desktop/src/app/tools/password-generator-history.component.ts diff --git a/apps/desktop/src/app/app.component.ts b/apps/desktop/src/app/app.component.ts index a05b09e139e..85c692be83a 100644 --- a/apps/desktop/src/app/app.component.ts +++ b/apps/desktop/src/app/app.component.ts @@ -53,7 +53,6 @@ import { InternalFolderService } from "@bitwarden/common/vault/abstractions/fold import { CipherType } from "@bitwarden/common/vault/enums"; import { DialogService, ToastOptions, ToastService } from "@bitwarden/components"; import { CredentialGeneratorHistoryDialogComponent } from "@bitwarden/generator-components"; -import { PasswordGenerationServiceAbstraction } from "@bitwarden/generator-legacy"; import { KeyService, BiometricStateService } from "@bitwarden/key-management"; import { DeleteAccountComponent } from "../auth/delete-account.component"; @@ -64,9 +63,7 @@ import { FolderAddEditComponent } from "../vault/app/vault/folder-add-edit.compo import { SettingsComponent } from "./accounts/settings.component"; import { ExportDesktopComponent } from "./tools/export/export-desktop.component"; import { CredentialGeneratorComponent } from "./tools/generator/credential-generator.component"; -import { GeneratorComponent } from "./tools/generator.component"; import { ImportDesktopComponent } from "./tools/import/import-desktop.component"; -import { PasswordGeneratorHistoryComponent } from "./tools/password-generator-history.component"; const BroadcasterSubscriptionId = "AppComponent"; const IdleTimeout = 60000 * 10; // 10 minutes @@ -125,7 +122,6 @@ export class AppComponent implements OnInit, OnDestroy { private broadcasterService: BroadcasterService, private folderService: InternalFolderService, private syncService: SyncService, - private passwordGenerationService: PasswordGenerationServiceAbstraction, private cipherService: CipherService, private authService: AuthService, private router: Router, @@ -516,41 +512,13 @@ export class AppComponent implements OnInit, OnDestroy { } async openGenerator() { - const isGeneratorSwapEnabled = await this.configService.getFeatureFlag( - FeatureFlag.GeneratorToolsModernization, - ); - if (isGeneratorSwapEnabled) { - await this.dialogService.open(CredentialGeneratorComponent); - return; - } - - this.modalService.closeAll(); - - [this.modal] = await this.modalService.openViewRef( - GeneratorComponent, - this.generatorModalRef, - (comp) => (comp.comingFromAddEdit = false), - ); - - // eslint-disable-next-line rxjs-angular/prefer-takeuntil - this.modal.onClosed.subscribe(() => { - this.modal = null; - }); + await this.dialogService.open(CredentialGeneratorComponent); + return; } async openGeneratorHistory() { - const isGeneratorSwapEnabled = await this.configService.getFeatureFlag( - FeatureFlag.GeneratorToolsModernization, - ); - if (isGeneratorSwapEnabled) { - await this.dialogService.open(CredentialGeneratorHistoryDialogComponent); - return; - } - - await this.openModal( - PasswordGeneratorHistoryComponent, - this.passwordHistoryRef, - ); + await this.dialogService.open(CredentialGeneratorHistoryDialogComponent); + return; } private async updateAppMenu() { diff --git a/apps/desktop/src/app/app.module.ts b/apps/desktop/src/app/app.module.ts index ea0a2c4c546..4e9980dfeb6 100644 --- a/apps/desktop/src/app/app.module.ts +++ b/apps/desktop/src/app/app.module.ts @@ -47,8 +47,6 @@ import { HeaderComponent } from "./layout/header.component"; import { NavComponent } from "./layout/nav.component"; import { SearchComponent } from "./layout/search/search.component"; import { SharedModule } from "./shared/shared.module"; -import { GeneratorComponent } from "./tools/generator.component"; -import { PasswordGeneratorHistoryComponent } from "./tools/password-generator-history.component"; import { AddEditComponent as SendAddEditComponent } from "./tools/send/add-edit.component"; import { SendComponent } from "./tools/send/send.component"; @@ -80,8 +78,6 @@ import { SendComponent } from "./tools/send/send.component"; HeaderComponent, HintComponent, NavComponent, - GeneratorComponent, - PasswordGeneratorHistoryComponent, PasswordHistoryComponent, PremiumComponent, RegisterComponent, diff --git a/apps/desktop/src/app/tools/generator.component.html b/apps/desktop/src/app/tools/generator.component.html deleted file mode 100644 index 0a8043fe594..00000000000 --- a/apps/desktop/src/app/tools/generator.component.html +++ /dev/null @@ -1,636 +0,0 @@ - diff --git a/apps/desktop/src/app/tools/generator.component.spec.ts b/apps/desktop/src/app/tools/generator.component.spec.ts deleted file mode 100644 index c259b4e52ce..00000000000 --- a/apps/desktop/src/app/tools/generator.component.spec.ts +++ /dev/null @@ -1,90 +0,0 @@ -import { NO_ERRORS_SCHEMA } from "@angular/core"; -import { ComponentFixture, TestBed } from "@angular/core/testing"; -import { ActivatedRoute } from "@angular/router"; -import { mock, MockProxy } from "jest-mock-extended"; - -import { I18nPipe } from "@bitwarden/angular/platform/pipes/i18n.pipe"; -import { AccountService } from "@bitwarden/common/auth/abstractions/account.service"; -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"; -import { CipherService } from "@bitwarden/common/vault/abstractions/cipher.service"; -import { ToastService } from "@bitwarden/components"; -import { - PasswordGenerationServiceAbstraction, - UsernameGenerationServiceAbstraction, -} from "@bitwarden/generator-legacy"; - -import { GeneratorComponent } from "./generator.component"; - -describe("GeneratorComponent", () => { - let component: GeneratorComponent; - let fixture: ComponentFixture; - let platformUtilsServiceMock: MockProxy; - - beforeEach(() => { - platformUtilsServiceMock = mock(); - - // 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 - TestBed.configureTestingModule({ - declarations: [GeneratorComponent, I18nPipe], - providers: [ - { - provide: PasswordGenerationServiceAbstraction, - useValue: mock(), - }, - { - provide: UsernameGenerationServiceAbstraction, - useValue: mock(), - }, - { - provide: PlatformUtilsService, - useValue: platformUtilsServiceMock, - }, - { - provide: I18nService, - useValue: mock(), - }, - { - provide: ActivatedRoute, - useValue: mock(), - }, - { - provide: LogService, - useValue: mock(), - }, - { - provide: CipherService, - useValue: mock(), - }, - { - provide: AccountService, - useValue: mock(), - }, - { - provide: ToastService, - useValue: mock(), - }, - ], - schemas: [NO_ERRORS_SCHEMA], - }).compileComponents(); - }); - - beforeEach(() => { - fixture = TestBed.createComponent(GeneratorComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it("should create", () => { - expect(component).toBeTruthy(); - }); - - describe("usernameTypesLearnMore()", () => { - it("should call platformUtilsService.launchUri() once", () => { - component.usernameTypesLearnMore(); - expect(platformUtilsServiceMock.launchUri).toHaveBeenCalledTimes(1); - }); - }); -}); diff --git a/apps/desktop/src/app/tools/generator.component.ts b/apps/desktop/src/app/tools/generator.component.ts deleted file mode 100644 index fc9ff489a1a..00000000000 --- a/apps/desktop/src/app/tools/generator.component.ts +++ /dev/null @@ -1,48 +0,0 @@ -import { Component, NgZone } from "@angular/core"; -import { ActivatedRoute } from "@angular/router"; - -import { GeneratorComponent as BaseGeneratorComponent } from "@bitwarden/angular/tools/generator/components/generator.component"; -import { AccountService } from "@bitwarden/common/auth/abstractions/account.service"; -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"; -import { ToastService } from "@bitwarden/components"; -import { - PasswordGenerationServiceAbstraction, - UsernameGenerationServiceAbstraction, -} from "@bitwarden/generator-legacy"; - -@Component({ - selector: "app-generator", - templateUrl: "generator.component.html", -}) -export class GeneratorComponent extends BaseGeneratorComponent { - constructor( - passwordGenerationService: PasswordGenerationServiceAbstraction, - usernameGenerationService: UsernameGenerationServiceAbstraction, - accountService: AccountService, - platformUtilsService: PlatformUtilsService, - i18nService: I18nService, - route: ActivatedRoute, - ngZone: NgZone, - logService: LogService, - toastService: ToastService, - ) { - super( - passwordGenerationService, - usernameGenerationService, - platformUtilsService, - accountService, - i18nService, - logService, - route, - ngZone, - window, - toastService, - ); - } - - usernameTypesLearnMore() { - this.platformUtilsService.launchUri("https://bitwarden.com/help/generator/#username-types"); - } -} diff --git a/apps/desktop/src/app/tools/password-generator-history.component.html b/apps/desktop/src/app/tools/password-generator-history.component.html deleted file mode 100644 index 3144ef7da86..00000000000 --- a/apps/desktop/src/app/tools/password-generator-history.component.html +++ /dev/null @@ -1,52 +0,0 @@ - diff --git a/apps/desktop/src/app/tools/password-generator-history.component.ts b/apps/desktop/src/app/tools/password-generator-history.component.ts deleted file mode 100644 index 0c7c9c4e221..00000000000 --- a/apps/desktop/src/app/tools/password-generator-history.component.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { Component } from "@angular/core"; - -import { PasswordGeneratorHistoryComponent as BasePasswordGeneratorHistoryComponent } from "@bitwarden/angular/tools/generator/components/password-generator-history.component"; -import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service"; -import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service"; -import { ToastService } from "@bitwarden/components"; -import { PasswordGenerationServiceAbstraction } from "@bitwarden/generator-legacy"; - -@Component({ - selector: "app-password-generator-history", - templateUrl: "password-generator-history.component.html", -}) -export class PasswordGeneratorHistoryComponent extends BasePasswordGeneratorHistoryComponent { - constructor( - passwordGenerationService: PasswordGenerationServiceAbstraction, - platformUtilsService: PlatformUtilsService, - i18nService: I18nService, - toastService: ToastService, - ) { - super(passwordGenerationService, platformUtilsService, i18nService, window, toastService); - } -} diff --git a/apps/desktop/src/scss/misc.scss b/apps/desktop/src/scss/misc.scss index 75a72640f2b..5a9befe2112 100644 --- a/apps/desktop/src/scss/misc.scss +++ b/apps/desktop/src/scss/misc.scss @@ -188,44 +188,6 @@ p.lead { } } -.generated-block { - font-size: $font-size-large; - font-family: $font-family-monospace; - padding: 8px 10px 8px 0; - display: flex; - border-radius: $border-radius; - border: 1px solid; - - @include themify($themes) { - background-color: transparent; - border-color: themed("borderColorAlt"); - } - - .modal-body & { - margin-top: 10px; - } - - .generated-wrapper { - text-align: left; - width: 100%; - min-width: 0; - white-space: pre-wrap; - word-break: break-all; - padding: 15px; - } - - .action-buttons { - display: flex; - align-self: center; - height: 100%; - margin-left: 10px; - - button { - margin-left: 10px; - } - } -} - .password-wrapper { overflow-wrap: break-word; white-space: pre-wrap; diff --git a/apps/desktop/src/vault/app/vault/vault.component.html b/apps/desktop/src/vault/app/vault/vault.component.html index 64bf8ac256f..1879573a843 100644 --- a/apps/desktop/src/vault/app/vault/vault.component.html +++ b/apps/desktop/src/vault/app/vault/vault.component.html @@ -39,8 +39,8 @@ (onCancelled)="cancelledAddEdit($event)" (onShareCipher)="shareCipher($event)" (onEditCollections)="cipherCollections($event)" - (onGeneratePassword)="openGenerator(true, true)" - (onGenerateUsername)="openGenerator(true, false)" + (onGeneratePassword)="openGenerator(true)" + (onGenerateUsername)="openGenerator(false)" >
{ - if (this.addEditComponent != null) { - this.addEditComponent.markPasswordAsDirty(); - if (passwordType) { - this.addEditComponent.cipher.login.password = value ?? ""; - } else { - this.addEditComponent.cipher.login.username = value ?? ""; - } - } - }, - type: passwordType ? "password" : "username", - }); - return; - } - - // TODO: Legacy code below, remove once the new generator is fully implemented - // https://bitwarden.atlassian.net/browse/PM-7121 - const cipher = this.addEditComponent?.cipher; - const loginType = cipher != null && cipher.type === CipherType.Login && cipher.login != null; - - const [modal, childComponent] = await this.modalService.openViewRef( - GeneratorComponent, - this.generatorModalRef, - (comp) => { - comp.comingFromAddEdit = comingFromAddEdit; - if (comingFromAddEdit) { - comp.type = passwordType ? "password" : "username"; - if (loginType && cipher.login.hasUris && cipher.login.uris[0].hostname != null) { - comp.usernameWebsite = cipher.login.uris[0].hostname; + async openGenerator(passwordType = true) { + CredentialGeneratorDialogComponent.open(this.dialogService, { + onCredentialGenerated: (value?: string) => { + if (this.addEditComponent != null) { + this.addEditComponent.markPasswordAsDirty(); + if (passwordType) { + this.addEditComponent.cipher.login.password = value ?? ""; + } else { + this.addEditComponent.cipher.login.username = value ?? ""; } } }, - ); - this.modal = modal; - - // eslint-disable-next-line rxjs-angular/prefer-takeuntil - childComponent.onSelected.subscribe((value: string) => { - this.modal.close(); - if (loginType) { - this.addEditComponent.markPasswordAsDirty(); - if (passwordType) { - this.addEditComponent.cipher.login.password = value; - } else { - this.addEditComponent.cipher.login.username = value; - } - } - }); - - // eslint-disable-next-line rxjs-angular/prefer-takeuntil - this.modal.onClosed.subscribe(() => { - this.modal = null; + type: passwordType ? "password" : "username", }); + return; } async addFolder() {