From 62d3fe21a6f4a2826636e3936d532fa61ef7300d Mon Sep 17 00:00:00 2001 From: Jared Snider <116684653+JaredSnider-Bitwarden@users.noreply.github.com> Date: Mon, 24 Feb 2025 15:48:09 -0500 Subject: [PATCH 01/41] feat(2FA-Setup/Recovery-Dialogs): [Auth/PM-11701] Refactor dialogs to properly use title & subtitle inputs for consistent styling (#13493) --- .../two-factor/two-factor-recovery.component.html | 10 +++++----- .../two-factor-setup-authenticator.component.html | 10 +++++----- .../two-factor/two-factor-setup-duo.component.html | 6 +----- .../two-factor/two-factor-setup-email.component.html | 6 +----- .../two-factor-setup-webauthn.component.html | 10 +++++----- .../two-factor/two-factor-setup-yubikey.component.html | 6 +----- .../two-factor/two-factor-verify.component.html | 6 +----- 7 files changed, 19 insertions(+), 35 deletions(-) diff --git a/apps/web/src/app/auth/settings/two-factor/two-factor-recovery.component.html b/apps/web/src/app/auth/settings/two-factor/two-factor-recovery.component.html index 98676509078..413432e5a02 100644 --- a/apps/web/src/app/auth/settings/two-factor/two-factor-recovery.component.html +++ b/apps/web/src/app/auth/settings/two-factor/two-factor-recovery.component.html @@ -1,8 +1,8 @@ - - - {{ "twoStepLogin" | i18n }} - {{ "recoveryCodeTitle" | i18n }} - +

{{ "twoFactorRecoveryYourCode" | i18n }}:

diff --git a/apps/web/src/app/auth/settings/two-factor/two-factor-setup-authenticator.component.html b/apps/web/src/app/auth/settings/two-factor/two-factor-setup-authenticator.component.html index c9214d59caa..a31d4c33458 100644 --- a/apps/web/src/app/auth/settings/two-factor/two-factor-setup-authenticator.component.html +++ b/apps/web/src/app/auth/settings/two-factor/two-factor-setup-authenticator.component.html @@ -1,9 +1,9 @@
- - - {{ "twoStepLogin" | i18n }} - {{ "authenticatorAppTitle" | i18n }} - + diff --git a/apps/web/src/app/auth/settings/two-factor/two-factor-setup-duo.component.html b/apps/web/src/app/auth/settings/two-factor/two-factor-setup-duo.component.html index f20bd4f5f70..3a62ec91a8e 100644 --- a/apps/web/src/app/auth/settings/two-factor/two-factor-setup-duo.component.html +++ b/apps/web/src/app/auth/settings/two-factor/two-factor-setup-duo.component.html @@ -1,9 +1,5 @@ - - - {{ "twoStepLogin" | i18n }} - Duo - + diff --git a/apps/web/src/app/auth/settings/two-factor/two-factor-setup-email.component.html b/apps/web/src/app/auth/settings/two-factor/two-factor-setup-email.component.html index f79a3bc7b0a..5861d1fba4f 100644 --- a/apps/web/src/app/auth/settings/two-factor/two-factor-setup-email.component.html +++ b/apps/web/src/app/auth/settings/two-factor/two-factor-setup-email.component.html @@ -1,9 +1,5 @@ - - - {{ "twoStepLogin" | i18n }} - {{ "emailTitle" | i18n }} - + diff --git a/apps/web/src/app/auth/settings/two-factor/two-factor-setup-webauthn.component.html b/apps/web/src/app/auth/settings/two-factor/two-factor-setup-webauthn.component.html index c9e2e111481..8e7a789d9d0 100644 --- a/apps/web/src/app/auth/settings/two-factor/two-factor-setup-webauthn.component.html +++ b/apps/web/src/app/auth/settings/two-factor/two-factor-setup-webauthn.component.html @@ -1,9 +1,9 @@ - - - {{ "twoStepLogin" | i18n }} - {{ "webAuthnTitle" | i18n }} - + - - - {{ "twoStepLogin" | i18n }} - YubiKey - + - - - {{ "twoStepLogin" | i18n }} - {{ dialogTitle }} - + Date: Mon, 24 Feb 2025 15:51:56 -0500 Subject: [PATCH 02/41] feat(LoginViaAuthRequestComponent): [Auth/PM-18506] fix missing spaces (#13543) --- .../login-via-auth-request.component.html | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/libs/auth/src/angular/login-via-auth-request/login-via-auth-request.component.html b/libs/auth/src/angular/login-via-auth-request/login-via-auth-request.component.html index ba26ba77cb0..22cf8320036 100644 --- a/libs/auth/src/angular/login-via-auth-request/login-via-auth-request.component.html +++ b/libs/auth/src/angular/login-via-auth-request/login-via-auth-request.component.html @@ -32,7 +32,8 @@
- {{ "needAnotherOptionV1" | i18n }} + {{ "needAnotherOptionV1" | i18n }}  {{ "viewAllLogInOptions" | i18n }} @@ -46,7 +47,8 @@ {{ fingerprintPhrase }}
- {{ "troubleLoggingIn" | i18n }} + {{ "troubleLoggingIn" | i18n }}  {{ "viewAllLogInOptions" | i18n }} From 8552578fbb581f4091f000c1ce1a557951ed9533 Mon Sep 17 00:00:00 2001 From: Jordan Aasen <166539328+jaasen-livefront@users.noreply.github.com> Date: Mon, 24 Feb 2025 13:53:02 -0800 Subject: [PATCH 03/41] [PM-12720] - sort organizations in vault item owner select (#13419) * sort owner select options and filters by name * don't sort filters * fix tests * fix tests * set organizations in ngOninit * move assignment up * Revert change to add-edit.component.ts. Move assignment up. * fix tests --- .../item-details-section.component.html | 2 +- .../item-details-section.component.spec.ts | 38 ++++++++++++++++--- .../item-details-section.component.ts | 11 ++++-- 3 files changed, 40 insertions(+), 11 deletions(-) diff --git a/libs/vault/src/cipher-form/components/item-details/item-details-section.component.html b/libs/vault/src/cipher-form/components/item-details/item-details-section.component.html index c68df5bbfac..40a8954b05a 100644 --- a/libs/vault/src/cipher-form/components/item-details/item-details-section.component.html +++ b/libs/vault/src/cipher-form/components/item-details/item-details-section.component.html @@ -27,7 +27,7 @@ [label]="userEmail$ | async" > diff --git a/libs/vault/src/cipher-form/components/item-details/item-details-section.component.spec.ts b/libs/vault/src/cipher-form/components/item-details/item-details-section.component.spec.ts index 3995422944c..aa68770774a 100644 --- a/libs/vault/src/cipher-form/components/item-details/item-details-section.component.spec.ts +++ b/libs/vault/src/cipher-form/components/item-details/item-details-section.component.spec.ts @@ -59,6 +59,9 @@ describe("ItemDetailsSectionComponent", () => { initializedWithCachedCipher, }); i18nService = mock(); + i18nService.collator = { + compare: (a: string, b: string) => a.localeCompare(b), + } as Intl.Collator; await TestBed.configureTestingModule({ imports: [ItemDetailsSectionComponent, CommonModule, ReactiveFormsModule], @@ -184,16 +187,18 @@ describe("ItemDetailsSectionComponent", () => { it("should allow ownership change if personal ownership is allowed and there is at least one organization", () => { component.config.allowPersonalOwnership = true; - component.config.organizations = [{ id: "org1" } as Organization]; + component.config.organizations = [{ id: "org1", name: "org1" } as Organization]; + fixture.detectChanges(); expect(component.allowOwnershipChange).toBe(true); }); it("should allow ownership change if personal ownership is not allowed but there is more than one organization", () => { component.config.allowPersonalOwnership = false; component.config.organizations = [ - { id: "org1" } as Organization, - { id: "org2" } as Organization, + { id: "org1", name: "org1" } as Organization, + { id: "org2", name: "org2" } as Organization, ]; + fixture.detectChanges(); expect(component.allowOwnershipChange).toBe(true); }); }); @@ -206,7 +211,8 @@ describe("ItemDetailsSectionComponent", () => { it("should return the first organization id if personal ownership is not allowed", () => { component.config.allowPersonalOwnership = false; - component.config.organizations = [{ id: "org1" } as Organization]; + component.config.organizations = [{ id: "org1", name: "Organization 1" } as Organization]; + fixture.detectChanges(); expect(component.defaultOwner).toBe("org1"); }); }); @@ -250,6 +256,7 @@ describe("ItemDetailsSectionComponent", () => { jest.spyOn(component, "allowOwnershipChange", "get").mockReturnValue(false); component.config.mode = "edit"; component.config.organizations = [{ id: "org1" } as Organization]; + fixture.detectChanges(); expect(component.showOwnership).toBe(true); }); @@ -322,8 +329,8 @@ describe("ItemDetailsSectionComponent", () => { it("should select the first organization if personal ownership is not allowed", async () => { component.config.allowPersonalOwnership = false; component.config.organizations = [ - { id: "org1" } as Organization, - { id: "org2" } as Organization, + { id: "org1", name: "org1" } as Organization, + { id: "org2", name: "org2" } as Organization, ]; component.originalCipherView = { name: "cipher1", @@ -517,4 +524,23 @@ describe("ItemDetailsSectionComponent", () => { expect(component["readOnlyCollectionsNames"]).toEqual(["Collection 1", "Collection 3"]); }); }); + + describe("organizationOptions", () => { + it("should sort the organizations by name", async () => { + component.config.mode = "edit"; + component.config.organizations = [ + { id: "org2", name: "org2" } as Organization, + { id: "org1", name: "org1" } as Organization, + ]; + component.originalCipherView = {} as CipherView; + + await component.ngOnInit(); + fixture.detectChanges(); + + const select = fixture.debugElement.query(By.directive(SelectComponent)); + const { label } = select.componentInstance.items[0]; + + expect(label).toBe("org1"); + }); + }); }); diff --git a/libs/vault/src/cipher-form/components/item-details/item-details-section.component.ts b/libs/vault/src/cipher-form/components/item-details/item-details-section.component.ts index 50bafd48b41..dcbc4e8c92f 100644 --- a/libs/vault/src/cipher-form/components/item-details/item-details-section.component.ts +++ b/libs/vault/src/cipher-form/components/item-details/item-details-section.component.ts @@ -12,6 +12,7 @@ import { OrganizationUserType } from "@bitwarden/common/admin-console/enums"; import { Organization } from "@bitwarden/common/admin-console/models/domain/organization"; import { AccountService } from "@bitwarden/common/auth/abstractions/account.service"; import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service"; +import { Utils } from "@bitwarden/common/platform/misc/utils"; import { CollectionId, OrganizationId } from "@bitwarden/common/types/guid"; import { CipherView } from "@bitwarden/common/vault/models/view/cipher.view"; import { @@ -74,6 +75,8 @@ export class ItemDetailsSectionComponent implements OnInit { /** The email address associated with the active account */ protected userEmail$ = this.accountService.activeAccount$.pipe(map((account) => account.email)); + protected organizations: Organization[] = []; + @Input({ required: true }) config: CipherFormConfig; @@ -90,10 +93,6 @@ export class ItemDetailsSectionComponent implements OnInit { return this.config.mode === "partial-edit"; } - get organizations(): Organization[] { - return this.config.organizations; - } - get allowPersonalOwnership() { return this.config.allowPersonalOwnership; } @@ -186,6 +185,10 @@ export class ItemDetailsSectionComponent implements OnInit { } async ngOnInit() { + this.organizations = this.config.organizations.sort( + Utils.getSortFunction(this.i18nService, "name"), + ); + if (!this.allowPersonalOwnership && this.organizations.length === 0) { throw new Error("No organizations available for ownership."); } From e06a482d6e3d6474927d52e92ddc6e9fb3824dbb Mon Sep 17 00:00:00 2001 From: Jared Snider <116684653+JaredSnider-Bitwarden@users.noreply.github.com> Date: Mon, 24 Feb 2025 17:27:15 -0500 Subject: [PATCH 04/41] fix(NewDeviceVerification): [Auth/PM-18580] Fix loading state on submit (#13545) --- .../new-device-verification.component.html | 1 + 1 file changed, 1 insertion(+) diff --git a/libs/auth/src/angular/new-device-verification/new-device-verification.component.html b/libs/auth/src/angular/new-device-verification/new-device-verification.component.html index 2f807d32993..e731f3afcb6 100644 --- a/libs/auth/src/angular/new-device-verification/new-device-verification.component.html +++ b/libs/auth/src/angular/new-device-verification/new-device-verification.component.html @@ -25,6 +25,7 @@
+ +
+ {{ "newCustomizationOptionsCalloutContent" | i18n }} + + {{ "newCustomizationOptionsCalloutLink" | i18n }} + +
+ + diff --git a/apps/browser/src/vault/popup/components/vault-v2/new-settings-callout/new-settings-callout.component.ts b/apps/browser/src/vault/popup/components/vault-v2/new-settings-callout/new-settings-callout.component.ts new file mode 100644 index 00000000000..71549906474 --- /dev/null +++ b/apps/browser/src/vault/popup/components/vault-v2/new-settings-callout/new-settings-callout.component.ts @@ -0,0 +1,69 @@ +import { CommonModule } from "@angular/common"; +import { Component, OnDestroy, OnInit } from "@angular/core"; +import { Router } from "@angular/router"; +import { firstValueFrom } from "rxjs"; + +import { JslibModule } from "@bitwarden/angular/jslib.module"; +import { VaultProfileService } from "@bitwarden/angular/vault/services/vault-profile.service"; +import { AccountService } from "@bitwarden/common/auth/abstractions/account.service"; +import { getUserId } from "@bitwarden/common/auth/services/account.service"; +import { LogService } from "@bitwarden/common/platform/abstractions/log.service"; +import { UserId } from "@bitwarden/common/types/guid"; +import { ButtonModule, PopoverModule } from "@bitwarden/components"; + +import { VaultPageService } from "../vault-page.service"; + +@Component({ + selector: "new-settings-callout", + templateUrl: "new-settings-callout.component.html", + standalone: true, + imports: [PopoverModule, JslibModule, CommonModule, ButtonModule], + providers: [VaultPageService], +}) +export class NewSettingsCalloutComponent implements OnInit, OnDestroy { + protected showNewCustomizationSettingsCallout = false; + protected activeUserId: UserId | null = null; + + constructor( + private accountService: AccountService, + private vaultProfileService: VaultProfileService, + private vaultPageService: VaultPageService, + private router: Router, + private logService: LogService, + ) {} + + async ngOnInit() { + this.activeUserId = await firstValueFrom(this.accountService.activeAccount$.pipe(getUserId)); + + let profileCreatedDate: Date; + + try { + profileCreatedDate = await this.vaultProfileService.getProfileCreationDate(this.activeUserId); + } catch (e) { + this.logService.error("Error getting profile creation date", e); + // Default to before the cutoff date to ensure the callout is shown + profileCreatedDate = new Date("2024-12-24"); + } + + const hasCalloutBeenDismissed = await firstValueFrom( + this.vaultPageService.isCalloutDismissed(this.activeUserId), + ); + + this.showNewCustomizationSettingsCallout = + !hasCalloutBeenDismissed && profileCreatedDate < new Date("2024-12-25"); + } + + async goToAppearance() { + await this.router.navigate(["/appearance"]); + } + + async dismissCallout() { + if (this.activeUserId) { + await this.vaultPageService.dismissCallout(this.activeUserId); + } + } + + async ngOnDestroy() { + await this.dismissCallout(); + } +} diff --git a/apps/browser/src/vault/popup/components/vault-v2/vault-page.service.ts b/apps/browser/src/vault/popup/components/vault-v2/vault-page.service.ts new file mode 100644 index 00000000000..75354298c26 --- /dev/null +++ b/apps/browser/src/vault/popup/components/vault-v2/vault-page.service.ts @@ -0,0 +1,41 @@ +import { inject, Injectable } from "@angular/core"; +import { map, Observable } from "rxjs"; + +import { + BANNERS_DISMISSED_DISK, + StateProvider, + UserKeyDefinition, +} from "@bitwarden/common/platform/state"; +import { UserId } from "@bitwarden/common/types/guid"; + +export const NEW_CUSTOMIZATION_OPTIONS_CALLOUT_DISMISSED_KEY = new UserKeyDefinition( + BANNERS_DISMISSED_DISK, + "newCustomizationOptionsCalloutDismissed", + { + deserializer: (calloutDismissed) => calloutDismissed, + clearOn: [], // Do not clear dismissed callouts + }, +); + +@Injectable() +export class VaultPageService { + private stateProvider = inject(StateProvider); + + async unDismissCallout(userId: UserId): Promise { + await this.stateProvider + .getUser(userId, NEW_CUSTOMIZATION_OPTIONS_CALLOUT_DISMISSED_KEY) + .update(() => false); + } + + isCalloutDismissed(userId: UserId): Observable { + return this.stateProvider + .getUser(userId, NEW_CUSTOMIZATION_OPTIONS_CALLOUT_DISMISSED_KEY) + .state$.pipe(map((dismissed) => !!dismissed)); + } + + async dismissCallout(userId: UserId): Promise { + await this.stateProvider + .getUser(userId, NEW_CUSTOMIZATION_OPTIONS_CALLOUT_DISMISSED_KEY) + .update(() => true); + } +} diff --git a/apps/browser/src/vault/popup/components/vault-v2/vault-v2.component.html b/apps/browser/src/vault/popup/components/vault-v2/vault-v2.component.html index 8cb538a429a..bb7cd8e52d0 100644 --- a/apps/browser/src/vault/popup/components/vault-v2/vault-v2.component.html +++ b/apps/browser/src/vault/popup/components/vault-v2/vault-v2.component.html @@ -85,4 +85,5 @@ >
+ diff --git a/apps/browser/src/vault/popup/components/vault-v2/vault-v2.component.ts b/apps/browser/src/vault/popup/components/vault-v2/vault-v2.component.ts index 73b691bc4ac..1ae1b205af3 100644 --- a/apps/browser/src/vault/popup/components/vault-v2/vault-v2.component.ts +++ b/apps/browser/src/vault/popup/components/vault-v2/vault-v2.component.ts @@ -15,6 +15,7 @@ import { } from "rxjs"; import { JslibModule } from "@bitwarden/angular/jslib.module"; +import { VaultProfileService } from "@bitwarden/angular/vault/services/vault-profile.service"; import { AccountService } from "@bitwarden/common/auth/abstractions/account.service"; import { getUserId } from "@bitwarden/common/auth/services/account.service"; import { FeatureFlag } from "@bitwarden/common/enums/feature-flag.enum"; @@ -44,7 +45,9 @@ import { NewItemDropdownV2Component, NewItemInitialValues, } from "./new-item-dropdown/new-item-dropdown-v2.component"; +import { NewSettingsCalloutComponent } from "./new-settings-callout/new-settings-callout.component"; import { VaultHeaderV2Component } from "./vault-header/vault-header-v2.component"; +import { VaultPageService } from "./vault-page.service"; import { AutofillVaultListItemsComponent, VaultListItemsContainerComponent } from "."; @@ -77,7 +80,9 @@ enum VaultState { DecryptionFailureDialogComponent, BannerComponent, AtRiskPasswordCalloutComponent, + NewSettingsCalloutComponent, ], + providers: [VaultPageService], }) export class VaultV2Component implements OnInit, AfterViewInit, OnDestroy { @ViewChild(CdkVirtualScrollableElement) virtualScrollElement?: CdkVirtualScrollableElement; @@ -115,6 +120,7 @@ export class VaultV2Component implements OnInit, AfterViewInit, OnDestroy { protected noResultsIcon = Icons.NoResults; protected VaultStateEnum = VaultState; + protected showNewCustomizationSettingsCallout = false; constructor( private vaultPopupItemsService: VaultPopupItemsService, @@ -124,6 +130,8 @@ export class VaultV2Component implements OnInit, AfterViewInit, OnDestroy { private destroyRef: DestroyRef, private cipherService: CipherService, private dialogService: DialogService, + private vaultProfileService: VaultProfileService, + private vaultPageService: VaultPageService, ) { combineLatest([ this.vaultPopupItemsService.emptyVault$, @@ -178,7 +186,7 @@ export class VaultV2Component implements OnInit, AfterViewInit, OnDestroy { }); } - ngOnDestroy(): void { + ngOnDestroy() { this.vaultScrollPositionService.stop(); } From bc415d807c8da0c08eedf658a092bfc08b619146 Mon Sep 17 00:00:00 2001 From: Jordan Aasen <166539328+jaasen-livefront@users.noreply.github.com> Date: Mon, 24 Feb 2025 14:56:15 -0800 Subject: [PATCH 06/41] [PM-13989] - Extension Vault screen - allow copy icon to copy data directly if only 1 piece of data is available (#13520) * wip - copy button overhaul * finalize item copy actions single item copy --- apps/browser/src/_locales/en/messages.json | 14 ++ .../item-copy-actions.component.html | 136 +++++++++++------- .../item-copy-actions.component.ts | 52 ++++++- 3 files changed, 153 insertions(+), 49 deletions(-) diff --git a/apps/browser/src/_locales/en/messages.json b/apps/browser/src/_locales/en/messages.json index b2d042945b0..ea9e62916a2 100644 --- a/apps/browser/src/_locales/en/messages.json +++ b/apps/browser/src/_locales/en/messages.json @@ -4236,6 +4236,20 @@ } } }, + "copyFieldValue": { + "message": "Copy $FIELD$, $VALUE$", + "description": "Title for a button that copies a field value to the clipboard.", + "placeholders": { + "field": { + "content": "$1", + "example": "Username" + }, + "value": { + "content": "$2", + "example": "Foo" + } + } + }, "noValuesToCopy": { "message": "No values to copy" }, diff --git a/apps/browser/src/vault/popup/components/vault-v2/item-copy-action/item-copy-actions.component.html b/apps/browser/src/vault/popup/components/vault-v2/item-copy-action/item-copy-actions.component.html index fbfebe8efff..bb3a7b12096 100644 --- a/apps/browser/src/vault/popup/components/vault-v2/item-copy-action/item-copy-actions.component.html +++ b/apps/browser/src/vault/popup/components/vault-v2/item-copy-action/item-copy-actions.component.html @@ -36,32 +36,46 @@ - - + - - + bitIconButton="bwi-clone" + size="small" + [appA11yTitle]=" + hasLoginValues ? ('copyInfoTitle' | i18n: cipher.name) : ('noValuesToCopy' | i18n) + " + [disabled]="!hasLoginValues" + [bitMenuTriggerFor]="loginOptions" + > + + + + + + @@ -92,52 +106,78 @@ - - - - + + + + + + + - - - - - - + + + + + + + + + diff --git a/apps/browser/src/vault/popup/components/vault-v2/item-copy-action/item-copy-actions.component.ts b/apps/browser/src/vault/popup/components/vault-v2/item-copy-action/item-copy-actions.component.ts index 53439dc4abd..a51e5f5406a 100644 --- a/apps/browser/src/vault/popup/components/vault-v2/item-copy-action/item-copy-actions.component.ts +++ b/apps/browser/src/vault/popup/components/vault-v2/item-copy-action/item-copy-actions.component.ts @@ -4,6 +4,7 @@ import { CommonModule } from "@angular/common"; import { Component, Input, inject } from "@angular/core"; import { JslibModule } from "@bitwarden/angular/jslib.module"; +import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service"; import { CipherType } from "@bitwarden/common/vault/enums"; import { CipherView } from "@bitwarden/common/vault/models/view/cipher.view"; import { IconButtonModule, ItemModule, MenuModule } from "@bitwarden/components"; @@ -11,6 +12,11 @@ import { CopyCipherFieldDirective } from "@bitwarden/vault"; import { VaultPopupCopyButtonsService } from "../../../services/vault-popup-copy-buttons.service"; +type CipherItem = { + value: string; + key: string; +}; + @Component({ standalone: true, selector: "app-item-copy-actions", @@ -37,6 +43,50 @@ export class ItemCopyActionsComponent { ); } + get singleCopiableLogin() { + const loginItems: CipherItem[] = [ + { value: this.cipher.login.username, key: "username" }, + { value: this.cipher.login.password, key: "password" }, + { value: this.cipher.login.totp, key: "totp" }, + ]; + // If both the password and username are visible but the password is hidden, return the username + if (!this.cipher.viewPassword && this.cipher.login.username && this.cipher.login.password) { + return { value: this.cipher.login.username, key: this.i18nService.t("username") }; + } + return this.findSingleCopiableItem(loginItems); + } + + get singleCopiableCard() { + const cardItems: CipherItem[] = [ + { value: this.cipher.card.code, key: "code" }, + { value: this.cipher.card.number, key: "number" }, + ]; + return this.findSingleCopiableItem(cardItems); + } + + get singleCopiableIdentity() { + const identityItems: CipherItem[] = [ + { value: this.cipher.identity.fullAddressForCopy, key: "address" }, + { value: this.cipher.identity.email, key: "email" }, + { value: this.cipher.identity.username, key: "username" }, + { value: this.cipher.identity.phone, key: "phone" }, + ]; + return this.findSingleCopiableItem(identityItems); + } + + /* + * Given a list of CipherItems, if there is only one item with a value, + * return it with the translated key. Otherwise return null + */ + findSingleCopiableItem(items: { value: string; key: string }[]): CipherItem | null { + const singleItemWithValue = items.find( + (key) => key.value && items.every((f) => f === key || !f.value), + ); + return singleItemWithValue + ? { value: singleItemWithValue.value, key: this.i18nService.t(singleItemWithValue.key) } + : null; + } + get hasCardValues() { return !!this.cipher.card.code || !!this.cipher.card.number; } @@ -62,5 +112,5 @@ export class ItemCopyActionsComponent { ); } - constructor() {} + constructor(private i18nService: I18nService) {} } From f66446fa69ff6f0e54028d35d2130142a6e73360 Mon Sep 17 00:00:00 2001 From: Oscar Hinton Date: Tue, 25 Feb 2025 11:05:33 +0100 Subject: [PATCH 07/41] Renovate: disable major upgrades of angular (#13533) * Renovate: disable major upgrades of angular --- .github/renovate.json5 | 19 ++++++++++++++----- 1 file changed, 14 insertions(+), 5 deletions(-) diff --git a/.github/renovate.json5 b/.github/renovate.json5 index 6d6fbbd2539..a0826039bb8 100644 --- a/.github/renovate.json5 +++ b/.github/renovate.json5 @@ -22,6 +22,18 @@ description: "Determined by Angular", enabled: false, }, + { + matchSourceUrls: [ + "https://github.com/angular-eslint/angular-eslint", + "https://github.com/angular/angular-cli", + "https://github.com/angular/angular", + "https://github.com/angular/components", + "https://github.com/ng-select/ng-select", + ], + matchUpdateTypes: ["major"], + description: "Manually updated using ng update", + enabled: false, + }, { matchPackageNames: ["typescript", "zone.js"], matchUpdateTypes: "patch", @@ -90,12 +102,8 @@ }, { matchPackageNames: [ - "@angular-eslint/eslint-plugin-template", - "@angular-eslint/eslint-plugin", "@angular-eslint/schematics", - "@angular-eslint/template-parser", - "@typescript-eslint/eslint-plugin", - "@typescript-eslint/parser", + "angular-eslint", "eslint-config-prettier", "eslint-import-resolver-typescript", "eslint-plugin-import", @@ -106,6 +114,7 @@ "eslint", "husky", "lint-staged", + "typescript-eslint", ], groupName: "Linting minor-patch", matchUpdateTypes: ["minor", "patch"], From 240f9f934894154f6e98ace93357bd27ded40c88 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Daniel=20Garc=C3=ADa?= Date: Tue, 25 Feb 2025 12:30:26 +0100 Subject: [PATCH 08/41] Make native-messaging-test-runner use desktop_proxy (#11923) * Make native-messaging-test-runner use desktop_proxy * Remove node-ipc * Fix build and implement proxy selection * Remove eslint disable --------- Co-authored-by: Matt Bishop --- .../package-lock.json | 81 +-------- .../native-messaging-test-runner/package.json | 4 +- .../src/ipc.service.ts | 169 +++++++++++++----- .../tsconfig.json | 9 +- package-lock.json | 70 -------- package.json | 2 - 6 files changed, 140 insertions(+), 195 deletions(-) diff --git a/apps/desktop/native-messaging-test-runner/package-lock.json b/apps/desktop/native-messaging-test-runner/package-lock.json index f9c5f0709e4..d3f6c53a373 100644 --- a/apps/desktop/native-messaging-test-runner/package-lock.json +++ b/apps/desktop/native-messaging-test-runner/package-lock.json @@ -12,15 +12,13 @@ "@bitwarden/common": "file:../../../libs/common", "@bitwarden/node": "file:../../../libs/node", "module-alias": "2.2.3", - "node-ipc": "9.2.1", "ts-node": "10.9.2", "uuid": "11.0.5", "yargs": "17.7.2" }, "devDependencies": { "@types/node": "22.10.7", - "@types/node-ipc": "9.2.3", - "typescript": "4.7.4" + "typescript": "5.4.2" } }, "../../../libs/common": { @@ -31,10 +29,7 @@ "../../../libs/node": { "name": "@bitwarden/node", "version": "0.0.0", - "license": "GPL-3.0", - "dependencies": { - "@bitwarden/common": "file:../common" - } + "license": "GPL-3.0" }, "node_modules/@bitwarden/common": { "resolved": "../../../libs/common", @@ -114,16 +109,6 @@ "undici-types": "~6.20.0" } }, - "node_modules/@types/node-ipc": { - "version": "9.2.3", - "resolved": "https://registry.npmjs.org/@types/node-ipc/-/node-ipc-9.2.3.tgz", - "integrity": "sha512-/MvSiF71fYf3+zwqkh/zkVkZj1hl1Uobre9EMFy08mqfJNAmpR0vmPgOUdEIDVgifxHj6G1vYMPLSBLLxoDACQ==", - "dev": true, - "license": "MIT", - "dependencies": { - "@types/node": "*" - } - }, "node_modules/acorn": { "version": "8.14.0", "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.14.0.tgz", @@ -225,15 +210,6 @@ "node": ">=0.3.1" } }, - "node_modules/easy-stack": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/easy-stack/-/easy-stack-1.0.1.tgz", - "integrity": "sha512-wK2sCs4feiiJeFXn3zvY0p41mdU5VUgbgs1rNsc/y5ngFUijdWd+iIN8eoyuZHKB8xN6BL4PdWmzqFmxNg6V2w==", - "license": "MIT", - "engines": { - "node": ">=6.0.0" - } - }, "node_modules/emoji-regex": { "version": "8.0.0", "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz", @@ -249,15 +225,6 @@ "node": ">=6" } }, - "node_modules/event-pubsub": { - "version": "4.3.0", - "resolved": "https://registry.npmjs.org/event-pubsub/-/event-pubsub-4.3.0.tgz", - "integrity": "sha512-z7IyloorXvKbFx9Bpie2+vMJKKx1fH1EN5yiTfp8CiLOTptSYy1g8H4yDpGlEdshL1PBiFtBHepF2cNsqeEeFQ==", - "license": "Unlicense", - "engines": { - "node": ">=4.0.0" - } - }, "node_modules/get-caller-file": { "version": "2.0.5", "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz", @@ -276,27 +243,6 @@ "node": ">=8" } }, - "node_modules/js-message": { - "version": "1.0.7", - "resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz", - "integrity": "sha512-efJLHhLjIyKRewNS9EGZ4UpI8NguuL6fKkhRxVuMmrGV2xN/0APGdQYwLFky5w9naebSZ0OwAGp0G6/2Cg90rA==", - "license": "MIT", - "engines": { - "node": ">=0.6.0" - } - }, - "node_modules/js-queue": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/js-queue/-/js-queue-2.0.2.tgz", - "integrity": "sha512-pbKLsbCfi7kriM3s1J4DDCo7jQkI58zPLHi0heXPzPlj0hjUsm+FesPUbE0DSbIVIK503A36aUBoCN7eMFedkA==", - "license": "MIT", - "dependencies": { - "easy-stack": "^1.0.1" - }, - "engines": { - "node": ">=1.0.0" - } - }, "node_modules/make-error": { "version": "1.3.6", "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz", @@ -309,20 +255,6 @@ "integrity": "sha512-23g5BFj4zdQL/b6tor7Ji+QY4pEfNH784BMslY9Qb0UnJWRAt+lQGLYmRaM0KDBwIG23ffEBELhZDP2rhi9f/Q==", "license": "MIT" }, - "node_modules/node-ipc": { - "version": "9.2.1", - "resolved": "https://registry.npmjs.org/node-ipc/-/node-ipc-9.2.1.tgz", - "integrity": "sha512-mJzaM6O3xHf9VT8BULvJSbdVbmHUKRNOH7zDDkCrA1/T+CVjq2WVIDfLt0azZRXpgArJtl3rtmEozrbXPZ9GaQ==", - "license": "MIT", - "dependencies": { - "event-pubsub": "4.3.0", - "js-message": "1.0.7", - "js-queue": "2.0.2" - }, - "engines": { - "node": ">=8.0.0" - } - }, "node_modules/require-directory": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz", @@ -402,16 +334,15 @@ } }, "node_modules/typescript": { - "version": "4.7.4", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz", - "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==", - "license": "Apache-2.0", + "version": "5.4.2", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.2.tgz", + "integrity": "sha512-+2/g0Fds1ERlP6JsakQQDXjZdZMM+rqpamFZJEKh4kwTIn3iDkgKtby0CeNd5ATNZ4Ry1ax15TMx0W2V+miizQ==", "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" }, "engines": { - "node": ">=4.2.0" + "node": ">=14.17" } }, "node_modules/undici-types": { diff --git a/apps/desktop/native-messaging-test-runner/package.json b/apps/desktop/native-messaging-test-runner/package.json index 977b93e70d2..0df272c142f 100644 --- a/apps/desktop/native-messaging-test-runner/package.json +++ b/apps/desktop/native-messaging-test-runner/package.json @@ -17,15 +17,13 @@ "@bitwarden/common": "file:../../../libs/common", "@bitwarden/node": "file:../../../libs/node", "module-alias": "2.2.3", - "node-ipc": "9.2.1", "ts-node": "10.9.2", "uuid": "11.0.5", "yargs": "17.7.2" }, "devDependencies": { "@types/node": "22.10.7", - "@types/node-ipc": "9.2.3", - "typescript": "4.7.4" + "typescript": "5.4.2" }, "_moduleAliases": { "@bitwarden/common": "dist/libs/common/src", diff --git a/apps/desktop/native-messaging-test-runner/src/ipc.service.ts b/apps/desktop/native-messaging-test-runner/src/ipc.service.ts index 68c7ac73ab0..b02ff1a4225 100644 --- a/apps/desktop/native-messaging-test-runner/src/ipc.service.ts +++ b/apps/desktop/native-messaging-test-runner/src/ipc.service.ts @@ -1,9 +1,7 @@ /* eslint-disable no-console */ -// FIXME: Update this file to be type safe and remove this and next line -// @ts-strict-ignore -import { homedir } from "os"; - -import * as NodeIPC from "node-ipc"; +import { ChildProcess, spawn } from "child_process"; +import * as fs from "fs"; +import * as path from "path"; // eslint-disable-next-line no-restricted-imports import { MessageCommon } from "../../src/models/native-messaging/message-common"; @@ -13,11 +11,6 @@ import { UnencryptedMessageResponse } from "../../src/models/native-messaging/un import Deferred from "./deferred"; import { race } from "./race"; -NodeIPC.config.id = "native-messaging-test-runner"; -NodeIPC.config.maxRetries = 0; -NodeIPC.config.silent = true; - -const DESKTOP_APP_PATH = `${homedir}/tmp/app.bitwarden`; const DEFAULT_MESSAGE_TIMEOUT = 10 * 1000; // 10 seconds export type MessageHandler = (MessageCommon) => void; @@ -42,6 +35,10 @@ export default class IPCService { // A set of deferred promises that are awaiting socket connection private awaitingConnection = new Set>(); + // The IPC desktop_proxy process + private process?: ChildProcess; + private processOutputBuffer = Buffer.alloc(0); + constructor( private socketName: string, private messageHandler: MessageHandler, @@ -72,47 +69,47 @@ export default class IPCService { private _connect() { this.connectionState = IPCConnectionState.Connecting; - NodeIPC.connectTo(this.socketName, DESKTOP_APP_PATH, () => { - // Process incoming message - this.getSocket().on("message", (message: any) => { - this.processMessage(message); - }); + const proxyPath = selectProxyPath(); + console.log(`[IPCService] connecting to proxy at ${proxyPath}`); - this.getSocket().on("error", (error: Error) => { - // Only makes sense as long as config.maxRetries stays set to 0. Otherwise this will be - // invoked multiple times each time a connection error happens - console.log("[IPCService] errored"); - console.log( - "\x1b[33m Please make sure the desktop app is running locally and 'Allow DuckDuckGo browser integration' setting is enabled \x1b[0m", - ); - this.awaitingConnection.forEach((deferred) => { - console.log(`rejecting: ${deferred}`); - deferred.reject(error); - }); - this.awaitingConnection.clear(); - }); + this.process = spawn(proxyPath, process.argv.slice(1), { + cwd: process.cwd(), + stdio: "pipe", + shell: false, + }); - this.getSocket().on("connect", () => { - console.log("[IPCService] connected"); - this.connectionState = IPCConnectionState.Connected; + this.process.stdout.on("data", (data: Buffer) => { + this.processIpcMessage(data); + }); - this.awaitingConnection.forEach((deferred) => { - deferred.resolve(null); - }); - this.awaitingConnection.clear(); - }); + this.process.stderr.on("data", (data: Buffer) => { + console.error(`proxy log: ${data}`); + }); - this.getSocket().on("disconnect", () => { - console.log("[IPCService] disconnected"); - this.connectionState = IPCConnectionState.Disconnected; + this.process.on("error", (error) => { + // Only makes sense as long as config.maxRetries stays set to 0. Otherwise this will be + // invoked multiple times each time a connection error happens + console.log("[IPCService] errored"); + console.log( + "\x1b[33m Please make sure the desktop app is running locally and 'Allow DuckDuckGo browser integration' setting is enabled \x1b[0m", + ); + this.awaitingConnection.forEach((deferred) => { + console.log(`rejecting: ${deferred}`); + deferred.reject(error); }); + this.awaitingConnection.clear(); + }); + + this.process.on("exit", () => { + console.log("[IPCService] disconnected"); + this.connectionState = IPCConnectionState.Disconnected; }); } disconnect() { console.log("[IPCService] disconnecting..."); if (this.connectionState !== IPCConnectionState.Disconnected) { - NodeIPC.disconnect(this.socketName); + this.process?.kill(); } } @@ -133,7 +130,7 @@ export default class IPCService { this.pendingMessages.set(message.messageId, deferred); - this.getSocket().emit("message", message); + this.sendIpcMessage(message); try { // Since we can not guarantee that a response message will ever be sent, we put a timeout @@ -151,8 +148,56 @@ export default class IPCService { } } - private getSocket() { - return NodeIPC.of[this.socketName]; + // As we're using the desktop_proxy to communicate with the native messaging directly, + // the messages need to follow Native Messaging Host protocol (uint32 size followed by message). + // https://developer.chrome.com/docs/extensions/develop/concepts/native-messaging#native-messaging-host-protocol + private sendIpcMessage(message: MessageCommon) { + const messageStr = JSON.stringify(message); + const buffer = Buffer.alloc(4 + messageStr.length); + buffer.writeUInt32LE(messageStr.length, 0); + buffer.write(messageStr, 4); + + this.process?.stdin.write(buffer); + } + + private processIpcMessage(data: Buffer) { + this.processOutputBuffer = Buffer.concat([this.processOutputBuffer, data]); + + // We might receive more than one IPC message per data event, so we need to process them all + // We continue as long as we have at least 4 + 1 bytes in the buffer, where the first 4 bytes + // represent the message length and the 5th byte is the message + while (this.processOutputBuffer.length > 4) { + // Read the message length and ensure we have the full message + const msgLength = this.processOutputBuffer.readUInt32LE(0); + if (msgLength + 4 < this.processOutputBuffer.length) { + return; + } + + // Parse the message from the buffer + const messageStr = this.processOutputBuffer.subarray(4, msgLength + 4).toString(); + const message = JSON.parse(messageStr); + + // Store the remaining buffer, which is part of the next message + this.processOutputBuffer = this.processOutputBuffer.subarray(msgLength + 4); + + // Process the connect/disconnect messages separately + if (message?.command === "connected") { + console.log("[IPCService] connected"); + this.connectionState = IPCConnectionState.Connected; + + this.awaitingConnection.forEach((deferred) => { + deferred.resolve(null); + }); + this.awaitingConnection.clear(); + continue; + } else if (message?.command === "disconnected") { + console.log("[IPCService] disconnected"); + this.connectionState = IPCConnectionState.Disconnected; + continue; + } + + this.processMessage(message); + } } private processMessage(message: any) { @@ -172,3 +217,41 @@ export default class IPCService { } } } + +function selectProxyPath(): string { + const proxyExtension = process.platform === "win32" ? ".exe" : ""; + + // If the PROXY_PATH environment variable is set, use that + if (process.env.PROXY_PATH) { + if (!fs.existsSync(process.env.PROXY_PATH)) { + throw new Error(`PROXY_PATH is set to ${process.env.PROXY_PATH} but the file does not exist`); + } + return process.env.PROXY_PATH; + } + + // Otherwise try the debug build if present + const debugProxyPath = path.join( + __dirname, + "..", + "..", + "..", + "..", + "..", + "..", + "desktop_native", + "target", + "debug", + `desktop_proxy${proxyExtension}`, + ); + if (fs.existsSync(debugProxyPath)) { + return debugProxyPath; + } + + // On MacOS, try the release build (sandboxed) + const macReleaseProxyPath = `/Applications/Bitwarden.app/Contents/MacOS/desktop_proxy${proxyExtension}`; + if (process.platform === "darwin" && fs.existsSync(macReleaseProxyPath)) { + return macReleaseProxyPath; + } + + throw new Error("Could not find the desktop_proxy executable"); +} diff --git a/apps/desktop/native-messaging-test-runner/tsconfig.json b/apps/desktop/native-messaging-test-runner/tsconfig.json index 72a28de3f7a..59c7040e509 100644 --- a/apps/desktop/native-messaging-test-runner/tsconfig.json +++ b/apps/desktop/native-messaging-test-runner/tsconfig.json @@ -5,12 +5,17 @@ "target": "es6", "module": "CommonJS", "moduleResolution": "node", + "emitDecoratorMetadata": true, + "experimentalDecorators": true, "sourceMap": false, "declaration": false, "paths": { "@src/*": ["src/*"], - "@bitwarden/node/*": ["../../../libs/node/src/*"], - "@bitwarden/common/*": ["../../../libs/common/src/*"] + "@bitwarden/admin-console/*": ["../../../libs/admin-console/src/*"], + "@bitwarden/auth/*": ["../../../libs/auth/src/*"], + "@bitwarden/common/*": ["../../../libs/common/src/*"], + "@bitwarden/key-management": ["../../../libs/key-management/src/"], + "@bitwarden/node/*": ["../../../libs/node/src/*"] }, "plugins": [ { diff --git a/package-lock.json b/package-lock.json index 622ee9bf9d4..01aace3228c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -113,7 +113,6 @@ "@types/node": "22.10.7", "@types/node-fetch": "2.6.4", "@types/node-forge": "1.3.11", - "@types/node-ipc": "9.2.3", "@types/papaparse": "5.3.15", "@types/proper-lockfile": "4.1.4", "@types/retry": "0.12.5", @@ -157,7 +156,6 @@ "json5": "2.2.3", "lint-staged": "15.4.1", "mini-css-extract-plugin": "2.9.2", - "node-ipc": "9.2.1", "postcss": "8.5.1", "postcss-loader": "8.1.1", "prettier": "3.4.2", @@ -10047,16 +10045,6 @@ "@types/node": "*" } }, - "node_modules/@types/node-ipc": { - "version": "9.2.3", - "resolved": "https://registry.npmjs.org/@types/node-ipc/-/node-ipc-9.2.3.tgz", - "integrity": "sha512-/MvSiF71fYf3+zwqkh/zkVkZj1hl1Uobre9EMFy08mqfJNAmpR0vmPgOUdEIDVgifxHj6G1vYMPLSBLLxoDACQ==", - "dev": true, - "license": "MIT", - "dependencies": { - "@types/node": "*" - } - }, "node_modules/@types/node/node_modules/undici-types": { "version": "6.20.0", "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.20.0.tgz", @@ -15862,16 +15850,6 @@ "dev": true, "license": "MIT" }, - "node_modules/easy-stack": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/easy-stack/-/easy-stack-1.0.1.tgz", - "integrity": "sha512-wK2sCs4feiiJeFXn3zvY0p41mdU5VUgbgs1rNsc/y5ngFUijdWd+iIN8eoyuZHKB8xN6BL4PdWmzqFmxNg6V2w==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=6.0.0" - } - }, "node_modules/ee-first": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz", @@ -17182,16 +17160,6 @@ "node": ">= 0.6" } }, - "node_modules/event-pubsub": { - "version": "4.3.0", - "resolved": "https://registry.npmjs.org/event-pubsub/-/event-pubsub-4.3.0.tgz", - "integrity": "sha512-z7IyloorXvKbFx9Bpie2+vMJKKx1fH1EN5yiTfp8CiLOTptSYy1g8H4yDpGlEdshL1PBiFtBHepF2cNsqeEeFQ==", - "dev": true, - "license": "Unlicense", - "engines": { - "node": ">=4.0.0" - } - }, "node_modules/event-stream": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/event-stream/-/event-stream-4.0.1.tgz", @@ -21964,29 +21932,6 @@ "integrity": "sha512-m4avr8yL8kmFN8psrbFFFmB/If14iN5o9nw/NgnnM+kybDJpRsAynV2BsfpTYrTRysYUdADVD7CkUUizgkpLfg==", "license": "MIT" }, - "node_modules/js-message": { - "version": "1.0.7", - "resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz", - "integrity": "sha512-efJLHhLjIyKRewNS9EGZ4UpI8NguuL6fKkhRxVuMmrGV2xN/0APGdQYwLFky5w9naebSZ0OwAGp0G6/2Cg90rA==", - "dev": true, - "license": "MIT", - "engines": { - "node": ">=0.6.0" - } - }, - "node_modules/js-queue": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/js-queue/-/js-queue-2.0.2.tgz", - "integrity": "sha512-pbKLsbCfi7kriM3s1J4DDCo7jQkI58zPLHi0heXPzPlj0hjUsm+FesPUbE0DSbIVIK503A36aUBoCN7eMFedkA==", - "dev": true, - "license": "MIT", - "dependencies": { - "easy-stack": "^1.0.1" - }, - "engines": { - "node": ">=1.0.0" - } - }, "node_modules/js-tokens": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", @@ -25710,21 +25655,6 @@ "license": "MIT", "peer": true }, - "node_modules/node-ipc": { - "version": "9.2.1", - "resolved": "https://registry.npmjs.org/node-ipc/-/node-ipc-9.2.1.tgz", - "integrity": "sha512-mJzaM6O3xHf9VT8BULvJSbdVbmHUKRNOH7zDDkCrA1/T+CVjq2WVIDfLt0azZRXpgArJtl3rtmEozrbXPZ9GaQ==", - "dev": true, - "license": "MIT", - "dependencies": { - "event-pubsub": "4.3.0", - "js-message": "1.0.7", - "js-queue": "2.0.2" - }, - "engines": { - "node": ">=8.0.0" - } - }, "node_modules/node-releases": { "version": "2.0.18", "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.18.tgz", diff --git a/package.json b/package.json index 44733e4ab07..32b5b2b6af3 100644 --- a/package.json +++ b/package.json @@ -74,7 +74,6 @@ "@types/node": "22.10.7", "@types/node-fetch": "2.6.4", "@types/node-forge": "1.3.11", - "@types/node-ipc": "9.2.3", "@types/papaparse": "5.3.15", "@types/proper-lockfile": "4.1.4", "@types/retry": "0.12.5", @@ -118,7 +117,6 @@ "json5": "2.2.3", "lint-staged": "15.4.1", "mini-css-extract-plugin": "2.9.2", - "node-ipc": "9.2.1", "postcss": "8.5.1", "postcss-loader": "8.1.1", "prettier": "3.4.2", From d11321e28e72f39256d73488a610e01d9528327f Mon Sep 17 00:00:00 2001 From: Bernd Schoolmann Date: Tue, 25 Feb 2025 14:47:08 +0100 Subject: [PATCH 09/41] Fix ssh agent on flatpak and mac app store (#13324) --- .../peercred_unix_listener_stream.rs | 17 ++++------------ .../core/src/ssh_agent/peerinfo/models.rs | 4 ++++ .../desktop_native/core/src/ssh_agent/unix.rs | 20 ++++++++++++++----- 3 files changed, 23 insertions(+), 18 deletions(-) diff --git a/apps/desktop/desktop_native/core/src/ssh_agent/peercred_unix_listener_stream.rs b/apps/desktop/desktop_native/core/src/ssh_agent/peercred_unix_listener_stream.rs index f0114fc08da..da9d8a54318 100644 --- a/apps/desktop/desktop_native/core/src/ssh_agent/peercred_unix_listener_stream.rs +++ b/apps/desktop/desktop_native/core/src/ssh_agent/peercred_unix_listener_stream.rs @@ -31,26 +31,17 @@ impl Stream for PeercredUnixListenerStream { Ok(peer) => match peer.pid() { Some(pid) => pid, None => { - return Poll::Ready(Some(Err(io::Error::new( - io::ErrorKind::Other, - "Failed to get peer PID", - )))); + return Poll::Ready(Some(Ok((stream, PeerInfo::unknown())))); } }, - Err(err) => { - return Poll::Ready(Some(Err(io::Error::new( - io::ErrorKind::Other, - format!("Failed to get peer credentials: {}", err), - )))); + Err(_) => { + return Poll::Ready(Some(Ok((stream, PeerInfo::unknown())))); } }; let peer_info = peerinfo::gather::get_peer_info(pid as u32); match peer_info { Ok(info) => Poll::Ready(Some(Ok((stream, info)))), - Err(err) => Poll::Ready(Some(Err(io::Error::new( - io::ErrorKind::Other, - format!("Failed to get peer info: {}", err), - )))), + Err(_) => Poll::Ready(Some(Ok((stream, PeerInfo::unknown())))), } } Poll::Ready(Err(err)) => Poll::Ready(Some(Err(err))), diff --git a/apps/desktop/desktop_native/core/src/ssh_agent/peerinfo/models.rs b/apps/desktop/desktop_native/core/src/ssh_agent/peerinfo/models.rs index 823d912883e..9c2ee363e8f 100644 --- a/apps/desktop/desktop_native/core/src/ssh_agent/peerinfo/models.rs +++ b/apps/desktop/desktop_native/core/src/ssh_agent/peerinfo/models.rs @@ -29,4 +29,8 @@ impl PeerInfo { pub fn process_name(&self) -> &str { &self.process_name } + + pub fn unknown() -> Self { + Self::new(0, 0, "Unknown application".to_string()) + } } diff --git a/apps/desktop/desktop_native/core/src/ssh_agent/unix.rs b/apps/desktop/desktop_native/core/src/ssh_agent/unix.rs index ae03421a425..40bc36b1b9e 100644 --- a/apps/desktop/desktop_native/core/src/ssh_agent/unix.rs +++ b/apps/desktop/desktop_native/core/src/ssh_agent/unix.rs @@ -47,11 +47,21 @@ impl BitwardenDesktopAgent { return; } }; - ssh_agent_directory - .join(".bitwarden-ssh-agent.sock") - .to_str() - .expect("Path should be valid") - .to_owned() + + let is_flatpak = std::env::var("container") == Ok("flatpak".to_string()); + if !is_flatpak { + ssh_agent_directory + .join(".bitwarden-ssh-agent.sock") + .to_str() + .expect("Path should be valid") + .to_owned() + } else { + ssh_agent_directory + .join(".var/app/com.bitwarden.desktop/data/.bitwarden-ssh-agent.sock") + .to_str() + .expect("Path should be valid") + .to_owned() + } } }; From 6d1914f43db8af28f97d75ad40a0af6e15c2b530 Mon Sep 17 00:00:00 2001 From: Vicki League Date: Tue, 25 Feb 2025 09:56:01 -0500 Subject: [PATCH 10/41] [CL-485] Add small delay for async action loading state (#12835) --- .../src/async-actions/bit-action.directive.ts | 29 +++-- .../async-actions/form-button.directive.ts | 6 +- .../src/async-actions/standalone.mdx | 29 ++++- .../src/async-actions/standalone.stories.ts | 35 +++++- .../src/button/button.component.html | 4 +- .../components/src/button/button.component.ts | 72 ++++++++--- .../icon-button/icon-button.component.html | 4 +- .../src/icon-button/icon-button.component.ts | 116 +++++++++++++----- .../src/shared/button-like.abstraction.ts | 6 +- .../components/send-form.component.ts | 4 +- .../cipher-attachments.component.spec.ts | 24 ++-- .../cipher-attachments.component.ts | 8 +- .../components/cipher-form.component.ts | 4 +- .../item-details-section.component.spec.ts | 3 + .../add-edit-folder-dialog.component.ts | 2 +- .../assign-collections.component.ts | 4 +- 16 files changed, 253 insertions(+), 97 deletions(-) diff --git a/libs/components/src/async-actions/bit-action.directive.ts b/libs/components/src/async-actions/bit-action.directive.ts index 3e793ae2ecd..ac50082852a 100644 --- a/libs/components/src/async-actions/bit-action.directive.ts +++ b/libs/components/src/async-actions/bit-action.directive.ts @@ -21,30 +21,35 @@ export class BitActionDirective implements OnDestroy { private destroy$ = new Subject(); private _loading$ = new BehaviorSubject(false); - disabled = false; - - @Input("bitAction") handler: FunctionReturningAwaitable; - + /** + * Observable of loading behavior subject + * + * Used in `form-button.directive.ts` + */ readonly loading$ = this._loading$.asObservable(); - constructor( - private buttonComponent: ButtonLikeAbstraction, - @Optional() private validationService?: ValidationService, - @Optional() private logService?: LogService, - ) {} - get loading() { return this._loading$.value; } set loading(value: boolean) { this._loading$.next(value); - this.buttonComponent.loading = value; + this.buttonComponent.loading.set(value); } + disabled = false; + + @Input("bitAction") handler: FunctionReturningAwaitable; + + constructor( + private buttonComponent: ButtonLikeAbstraction, + @Optional() private validationService?: ValidationService, + @Optional() private logService?: LogService, + ) {} + @HostListener("click") protected async onClick() { - if (!this.handler || this.loading || this.disabled || this.buttonComponent.disabled) { + if (!this.handler || this.loading || this.disabled || this.buttonComponent.disabled()) { return; } diff --git a/libs/components/src/async-actions/form-button.directive.ts b/libs/components/src/async-actions/form-button.directive.ts index 7c92865b984..1c2855f32e7 100644 --- a/libs/components/src/async-actions/form-button.directive.ts +++ b/libs/components/src/async-actions/form-button.directive.ts @@ -41,15 +41,15 @@ export class BitFormButtonDirective implements OnDestroy { if (submitDirective && buttonComponent) { submitDirective.loading$.pipe(takeUntil(this.destroy$)).subscribe((loading) => { if (this.type === "submit") { - buttonComponent.loading = loading; + buttonComponent.loading.set(loading); } else { - buttonComponent.disabled = this.disabled || loading; + buttonComponent.disabled.set(this.disabled || loading); } }); submitDirective.disabled$.pipe(takeUntil(this.destroy$)).subscribe((disabled) => { if (this.disabled !== false) { - buttonComponent.disabled = this.disabled || disabled; + buttonComponent.disabled.set(this.disabled || disabled); } }); } diff --git a/libs/components/src/async-actions/standalone.mdx b/libs/components/src/async-actions/standalone.mdx index efde494f2dd..f484ea01c58 100644 --- a/libs/components/src/async-actions/standalone.mdx +++ b/libs/components/src/async-actions/standalone.mdx @@ -1,6 +1,7 @@ -import { Meta } from "@storybook/addon-docs"; +import { Meta, Story } from "@storybook/addon-docs"; +import * as stories from "./standalone.stories.ts"; - + # Standalone Async Actions @@ -8,9 +9,13 @@ These directives should be used when building a standalone button that triggers in the background, eg. Refresh buttons. For non-submit buttons that are associated with forms see [Async Actions In Forms](?path=/story/component-library-async-actions-in-forms-documentation--page). +If the long running background task resolves quickly (e.g. less than 75 ms), the loading spinner +will not display on the button. This prevents an undesirable "flicker" of the loading spinner when +it is not necessary for the user to see it. + ## Usage -Adding async actions to standalone buttons requires the following 2 steps +Adding async actions to standalone buttons requires the following 2 steps: ### 1. Add a handler to your `Component` @@ -60,3 +65,21 @@ from how click handlers are usually defined with the output syntax `(click)="han `; ``` + +## Stories + +### Promise resolves -- loading spinner is displayed + + + +### Promise resolves -- quickly without loading spinner + + + +### Promise rejects + + + +### Observable + + diff --git a/libs/components/src/async-actions/standalone.stories.ts b/libs/components/src/async-actions/standalone.stories.ts index f658dfb0f01..52b85b88561 100644 --- a/libs/components/src/async-actions/standalone.stories.ts +++ b/libs/components/src/async-actions/standalone.stories.ts @@ -11,9 +11,9 @@ import { IconButtonModule } from "../icon-button"; import { BitActionDirective } from "./bit-action.directive"; -const template = ` +const template = /*html*/ ` `; @@ -22,9 +22,30 @@ const template = ` selector: "app-promise-example", }) class PromiseExampleComponent { + statusEmoji = "🟡"; action = async () => { await new Promise((resolve, reject) => { - setTimeout(resolve, 2000); + setTimeout(() => { + resolve(); + this.statusEmoji = "🟢"; + }, 5000); + }); + }; +} + +@Component({ + template, + selector: "app-action-resolves-quickly", +}) +class ActionResolvesQuicklyComponent { + statusEmoji = "🟡"; + + action = async () => { + await new Promise((resolve, reject) => { + setTimeout(() => { + resolve(); + this.statusEmoji = "🟢"; + }, 50); }); }; } @@ -59,6 +80,7 @@ export default { PromiseExampleComponent, ObservableExampleComponent, RejectedPromiseExampleComponent, + ActionResolvesQuicklyComponent, ], imports: [ButtonModule, IconButtonModule, BitActionDirective], providers: [ @@ -100,3 +122,10 @@ export const RejectedPromise: ObservableStory = { template: ``, }), }; + +export const ActionResolvesQuickly: PromiseStory = { + render: (args) => ({ + props: args, + template: ``, + }), +}; diff --git a/libs/components/src/button/button.component.html b/libs/components/src/button/button.component.html index ee4d150dfcc..a07ab9fb99b 100644 --- a/libs/components/src/button/button.component.html +++ b/libs/components/src/button/button.component.html @@ -1,10 +1,10 @@ - + diff --git a/libs/components/src/button/button.component.ts b/libs/components/src/button/button.component.ts index 96311f91529..0b4ce3073c3 100644 --- a/libs/components/src/button/button.component.ts +++ b/libs/components/src/button/button.component.ts @@ -2,7 +2,9 @@ // @ts-strict-ignore import { coerceBooleanProperty } from "@angular/cdk/coercion"; import { NgClass } from "@angular/common"; -import { Input, HostBinding, Component } from "@angular/core"; +import { Input, HostBinding, Component, model, computed } from "@angular/core"; +import { toObservable, toSignal } from "@angular/core/rxjs-interop"; +import { debounce, interval } from "rxjs"; import { ButtonLikeAbstraction, ButtonType } from "../shared/button-like.abstraction"; @@ -49,6 +51,9 @@ const buttonStyles: Record = { providers: [{ provide: ButtonLikeAbstraction, useExisting: ButtonComponent }], standalone: true, imports: [NgClass], + host: { + "[attr.disabled]": "disabledAttr()", + }, }) export class ButtonComponent implements ButtonLikeAbstraction { @HostBinding("class") get classList() { @@ -64,24 +69,41 @@ export class ButtonComponent implements ButtonLikeAbstraction { "tw-no-underline", "hover:tw-no-underline", "focus:tw-outline-none", - "disabled:tw-bg-secondary-300", - "disabled:hover:tw-bg-secondary-300", - "disabled:tw-border-secondary-300", - "disabled:hover:tw-border-secondary-300", - "disabled:!tw-text-muted", - "disabled:hover:!tw-text-muted", - "disabled:tw-cursor-not-allowed", - "disabled:hover:tw-no-underline", ] .concat(this.block ? ["tw-w-full", "tw-block"] : ["tw-inline-block"]) - .concat(buttonStyles[this.buttonType ?? "secondary"]); + .concat(buttonStyles[this.buttonType ?? "secondary"]) + .concat( + this.showDisabledStyles() || this.disabled() + ? [ + "disabled:tw-bg-secondary-300", + "disabled:hover:tw-bg-secondary-300", + "disabled:tw-border-secondary-300", + "disabled:hover:tw-border-secondary-300", + "disabled:!tw-text-muted", + "disabled:hover:!tw-text-muted", + "disabled:tw-cursor-not-allowed", + "disabled:hover:tw-no-underline", + ] + : [], + ); } - @HostBinding("attr.disabled") - get disabledAttr() { - const disabled = this.disabled != null && this.disabled !== false; - return disabled || this.loading ? true : null; - } + protected disabledAttr = computed(() => { + const disabled = this.disabled() != null && this.disabled() !== false; + return disabled || this.loading() ? true : null; + }); + + /** + * Determine whether it is appropriate to display the disabled styles. We only want to show + * the disabled styles if the button is truly disabled, or if the loading styles are also + * visible. + * + * We can't use `disabledAttr` for this, because it returns `true` when `loading` is `true`. + * We only want to show disabled styles during loading if `showLoadingStyles` is `true`. + */ + protected showDisabledStyles = computed(() => { + return this.showLoadingStyle() || (this.disabledAttr() && this.loading() === false); + }); @Input() buttonType: ButtonType; @@ -96,7 +118,23 @@ export class ButtonComponent implements ButtonLikeAbstraction { this._block = coerceBooleanProperty(value); } - @Input() loading = false; + loading = model(false); - @Input() disabled = false; + /** + * Determine whether it is appropriate to display a loading spinner. We only want to show + * a spinner if it's been more than 75 ms since the `loading` state began. This prevents + * a spinner "flash" for actions that are synchronous/nearly synchronous. + * + * We can't use `loading` for this, because we still need to disable the button during + * the full `loading` state. I.e. we only want the spinner to be debounced, not the + * loading state. + * + * This pattern of converting a signal to an observable and back to a signal is not + * recommended. TODO -- find better way to use debounce with signals (CL-596) + */ + protected showLoadingStyle = toSignal( + toObservable(this.loading).pipe(debounce((isLoading) => interval(isLoading ? 75 : 0))), + ); + + disabled = model(false); } diff --git a/libs/components/src/icon-button/icon-button.component.html b/libs/components/src/icon-button/icon-button.component.html index 6eeaaaffaf0..0145f0b0ba5 100644 --- a/libs/components/src/icon-button/icon-button.component.html +++ b/libs/components/src/icon-button/icon-button.component.html @@ -1,10 +1,10 @@ - +