From bcd8963e8bfa08cfd2d8e52e5a6f6d19cb201d7c Mon Sep 17 00:00:00 2001 From: Matt Gibson Date: Tue, 15 Dec 2020 10:25:52 -0600 Subject: [PATCH] Add totp copy to clipboard button to cipher view (#737) * Add totp copy to clipboard button to cipher view * Align totp copy privs with cipher view * Enforce TOTP as premium feature * Update jslib reference --- jslib | 2 +- .../organizations/vault/ciphers.component.ts | 6 +++-- src/app/vault/ciphers.component.html | 5 +++++ src/app/vault/ciphers.component.ts | 22 +++++++++++++++---- 4 files changed, 28 insertions(+), 7 deletions(-) diff --git a/jslib b/jslib index 2c414ce27a5..cc801ce0d7e 160000 --- a/jslib +++ b/jslib @@ -1 +1 @@ -Subproject commit 2c414ce27a5c14f6cd7f86cfd07096a192d058ca +Subproject commit cc801ce0d7e200a365bed02c35b8d97666dbeab4 diff --git a/src/app/organizations/vault/ciphers.component.ts b/src/app/organizations/vault/ciphers.component.ts index c64962e3ba7..fcd07da6bd6 100644 --- a/src/app/organizations/vault/ciphers.component.ts +++ b/src/app/organizations/vault/ciphers.component.ts @@ -13,6 +13,8 @@ import { EventService } from 'jslib/abstractions/event.service'; import { I18nService } from 'jslib/abstractions/i18n.service'; import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service'; import { SearchService } from 'jslib/abstractions/search.service'; +import { TotpService } from 'jslib/abstractions/totp.service'; +import { UserService } from 'jslib/abstractions/user.service'; import { Organization } from 'jslib/models/domain/organization'; import { CipherView } from 'jslib/models/view/cipherView'; @@ -34,9 +36,9 @@ export class CiphersComponent extends BaseCiphersComponent { constructor(searchService: SearchService, analytics: Angulartics2, toasterService: ToasterService, i18nService: I18nService, platformUtilsService: PlatformUtilsService, cipherService: CipherService, - private apiService: ApiService, eventService: EventService) { + private apiService: ApiService, eventService: EventService, totpService: TotpService, userService: UserService) { super(searchService, analytics, toasterService, i18nService, platformUtilsService, - cipherService, eventService); + cipherService, eventService, totpService, userService); } async load(filter: (cipher: CipherView) => boolean = null) { diff --git a/src/app/vault/ciphers.component.html b/src/app/vault/ciphers.component.html index 49db6e5c65c..ca10a46aaee 100644 --- a/src/app/vault/ciphers.component.html +++ b/src/app/vault/ciphers.component.html @@ -47,6 +47,11 @@ {{'copyPassword' | i18n}} + + + {{'copyVerificationCode' | i18n}} + diff --git a/src/app/vault/ciphers.component.ts b/src/app/vault/ciphers.component.ts index 5a06fc3413f..3f4d3215f1b 100644 --- a/src/app/vault/ciphers.component.ts +++ b/src/app/vault/ciphers.component.ts @@ -14,6 +14,8 @@ import { EventService } from 'jslib/abstractions/event.service'; import { I18nService } from 'jslib/abstractions/i18n.service'; import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service'; import { SearchService } from 'jslib/abstractions/search.service'; +import { TotpService } from 'jslib/abstractions/totp.service'; +import { UserService } from 'jslib/abstractions/user.service'; import { CiphersComponent as BaseCiphersComponent } from 'jslib/angular/components/ciphers.component'; @@ -37,15 +39,20 @@ export class CiphersComponent extends BaseCiphersComponent implements OnDestroy cipherType = CipherType; actionPromise: Promise; + userHasPremiumAccess = false; constructor(searchService: SearchService, protected analytics: Angulartics2, protected toasterService: ToasterService, protected i18nService: I18nService, protected platformUtilsService: PlatformUtilsService, protected cipherService: CipherService, - protected eventService: EventService) { + protected eventService: EventService, protected totpService: TotpService, protected userService: UserService) { super(searchService); this.pageSize = 200; } + async ngOnInit() { + this.userHasPremiumAccess = await this.userService.canAccessPremium(); + } + ngOnDestroy() { this.selectAll(false); } @@ -117,9 +124,11 @@ export class CiphersComponent extends BaseCiphersComponent implements OnDestroy this.actionPromise = null; } - copy(cipher: CipherView, value: string, typeI18nKey: string, aType: string) { - if (value == null) { + async copy(cipher: CipherView, value: string, typeI18nKey: string, aType: string) { + if (value == null || !this.displayTotpCopyButton(cipher)) { return; + } else if (value === cipher.login.totp) { + value = await this.totpService.getCode(value); } this.analytics.eventTrack.next({ action: 'Copied ' + aType.toLowerCase() + ' from listing.' }); @@ -127,7 +136,7 @@ export class CiphersComponent extends BaseCiphersComponent implements OnDestroy this.toasterService.popAsync('info', null, this.i18nService.t('valueCopied', this.i18nService.t(typeI18nKey))); - if (typeI18nKey === 'password') { + if (typeI18nKey === 'password' || typeI18nKey === 'verificationCodeTotp') { this.eventService.collect(EventType.Cipher_ClientToggledHiddenFieldVisible, cipher.id); } else if (typeI18nKey === 'securityCode') { this.eventService.collect(EventType.Cipher_ClientCopiedCardCode, cipher.id); @@ -161,6 +170,11 @@ export class CiphersComponent extends BaseCiphersComponent implements OnDestroy return this.getSelected().map((c) => c.id); } + displayTotpCopyButton(cipher: CipherView) { + return (cipher?.login?.hasTotp ?? false) && + (cipher.organizationUseTotp || this.userHasPremiumAccess); + } + protected deleteCipher(id: string, permanent: boolean) { return permanent ? this.cipherService.deleteWithServer(id) : this.cipherService.softDeleteWithServer(id); }