diff --git a/apps/.vscode/launch.json b/apps/.vscode/launch.json new file mode 100644 index 00000000000..2be50c4fa2d --- /dev/null +++ b/apps/.vscode/launch.json @@ -0,0 +1,15 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "pwa-chrome", + "request": "launch", + "name": "Launch Chrome against localhost", + "url": "https://localhost:8080/#", + "webRoot": "${workspaceFolder}" + } + ] +} diff --git a/apps/desktop/src/app/vault/export.component.ts b/apps/desktop/src/app/vault/export.component.ts index b1e48abcddd..8087504f67e 100644 --- a/apps/desktop/src/app/vault/export.component.ts +++ b/apps/desktop/src/app/vault/export.component.ts @@ -4,6 +4,8 @@ import { Component, OnInit } from "@angular/core"; import { FormBuilder } from "@angular/forms"; import { ExportComponent as BaseExportComponent } from "@bitwarden/angular/components/export.component"; +import { ModalConfig, ModalService } from "@bitwarden/angular/services/modal.service"; +import { ApiService } from "@bitwarden/common/abstractions/api.service"; import { BroadcasterService } from "@bitwarden/common/abstractions/broadcaster.service"; import { CryptoService } from "@bitwarden/common/abstractions/crypto.service"; import { EventService } from "@bitwarden/common/abstractions/event.service"; @@ -12,7 +14,9 @@ import { I18nService } from "@bitwarden/common/abstractions/i18n.service"; import { LogService } from "@bitwarden/common/abstractions/log.service"; import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service"; import { PolicyService } from "@bitwarden/common/abstractions/policy.service"; +import { StateService } from "@bitwarden/common/abstractions/state.service"; import { UserVerificationService } from "@bitwarden/common/abstractions/userVerification.service"; +import { UserVerificationPromptService } from "@bitwarden/common/abstractions/userVerificationPrompt.service"; const BroadcasterSubscriptionId = "ExportComponent"; @@ -31,7 +35,12 @@ export class ExportComponent extends BaseExportComponent implements OnInit { userVerificationService: UserVerificationService, formBuilder: FormBuilder, private broadcasterService: BroadcasterService, - logService: LogService + logService: LogService, + protected modalService: ModalService, + protected apiService: ApiService, + protected stateService: StateService, + protected userVerificationPromptService: UserVerificationPromptService, + protected modalConfig: ModalConfig ) { super( cryptoService, @@ -43,7 +52,12 @@ export class ExportComponent extends BaseExportComponent implements OnInit { window, logService, userVerificationService, - formBuilder + formBuilder, + modalService, + apiService, + stateService, + userVerificationPromptService, + modalConfig ); } diff --git a/apps/web/src/app/components/file-password-prompt.component.html b/apps/web/src/app/components/file-password-prompt.component.html new file mode 100644 index 00000000000..993d957af66 --- /dev/null +++ b/apps/web/src/app/components/file-password-prompt.component.html @@ -0,0 +1,64 @@ + diff --git a/apps/web/src/app/components/file-password-prompt.component.ts b/apps/web/src/app/components/file-password-prompt.component.ts new file mode 100644 index 00000000000..b055107c80c --- /dev/null +++ b/apps/web/src/app/components/file-password-prompt.component.ts @@ -0,0 +1,8 @@ +import { Component } from "@angular/core"; + +import { FilePasswordPromptComponent as BaseFilePasswordPrompt } from "@bitwarden/angular/components/file-password-prompt.component"; + +@Component({ + templateUrl: "file-password-prompt.component.html", +}) +export class FilePasswordPromptComponent extends BaseFilePasswordPrompt {} diff --git a/apps/web/src/app/components/user-verification-prompt.component.html b/apps/web/src/app/components/user-verification-prompt.component.html new file mode 100644 index 00000000000..9f116a84a98 --- /dev/null +++ b/apps/web/src/app/components/user-verification-prompt.component.html @@ -0,0 +1,36 @@ + diff --git a/apps/web/src/app/components/user-verification-prompt.component.ts b/apps/web/src/app/components/user-verification-prompt.component.ts new file mode 100644 index 00000000000..e057193affc --- /dev/null +++ b/apps/web/src/app/components/user-verification-prompt.component.ts @@ -0,0 +1,8 @@ +import { Component } from "@angular/core"; + +import { UserVerificationPromptComponent as BaseUserVerificationPrompt } from "@bitwarden/angular/components/user-verification-prompt.component"; + +@Component({ + templateUrl: "user-verification-prompt.component.html", +}) +export class UserVerificationPromptComponent extends BaseUserVerificationPrompt {} diff --git a/apps/web/src/app/modules/loose-components.module.ts b/apps/web/src/app/modules/loose-components.module.ts index 45bb482036f..bd6364e99f6 100644 --- a/apps/web/src/app/modules/loose-components.module.ts +++ b/apps/web/src/app/modules/loose-components.module.ts @@ -19,11 +19,13 @@ import { UpdatePasswordComponent } from "../accounts/update-password.component"; import { UpdateTempPasswordComponent } from "../accounts/update-temp-password.component"; import { VerifyEmailTokenComponent } from "../accounts/verify-email-token.component"; import { VerifyRecoverDeleteComponent } from "../accounts/verify-recover-delete.component"; +import { FilePasswordPromptComponent } from "../components/file-password-prompt.component"; import { NestedCheckboxComponent } from "../components/nested-checkbox.component"; import { OrganizationSwitcherComponent } from "../components/organization-switcher.component"; import { PasswordRepromptComponent } from "../components/password-reprompt.component"; import { PasswordStrengthComponent } from "../components/password-strength.component"; import { PremiumBadgeComponent } from "../components/premium-badge.component"; +import { UserVerificationPromptComponent } from "../components/user-verification-prompt.component"; import { FooterComponent } from "../layouts/footer.component"; import { FrontendLayoutComponent } from "../layouts/frontend-layout.component"; import { NavbarComponent } from "../layouts/navbar.component"; @@ -271,6 +273,8 @@ import { OrganizationBadgeModule } from "./vault/modules/organization-badge/orga PasswordGeneratorHistoryComponent, PasswordGeneratorPolicyComponent, PasswordRepromptComponent, + FilePasswordPromptComponent, + UserVerificationPromptComponent, PasswordStrengthComponent, PaymentComponent, PaymentMethodComponent, @@ -430,6 +434,7 @@ import { OrganizationBadgeModule } from "./vault/modules/organization-badge/orga PasswordGeneratorHistoryComponent, PasswordGeneratorPolicyComponent, PasswordRepromptComponent, + FilePasswordPromptComponent, PasswordStrengthComponent, PaymentComponent, PaymentMethodComponent, diff --git a/apps/web/src/app/organizations/tools/export.component.ts b/apps/web/src/app/organizations/tools/export.component.ts index 8c482f58b7a..d943b4615a3 100644 --- a/apps/web/src/app/organizations/tools/export.component.ts +++ b/apps/web/src/app/organizations/tools/export.component.ts @@ -2,6 +2,9 @@ import { Component } from "@angular/core"; import { FormBuilder } from "@angular/forms"; import { ActivatedRoute } from "@angular/router"; +import { ModalConfig, ModalService } from "@bitwarden/angular/services/modal.service"; +import { UserVerificationPromptService } from "@bitwarden/angular/services/userVerificationPrompt.service"; +import { ApiService } from "@bitwarden/common/abstractions/api.service"; import { CryptoService } from "@bitwarden/common/abstractions/crypto.service"; import { EventService } from "@bitwarden/common/abstractions/event.service"; import { ExportService } from "@bitwarden/common/abstractions/export.service"; @@ -9,6 +12,7 @@ import { I18nService } from "@bitwarden/common/abstractions/i18n.service"; import { LogService } from "@bitwarden/common/abstractions/log.service"; import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service"; import { PolicyService } from "@bitwarden/common/abstractions/policy.service"; +import { StateService } from "@bitwarden/common/abstractions/state.service"; import { UserVerificationService } from "@bitwarden/common/abstractions/userVerification.service"; import { ExportComponent as BaseExportComponent } from "../../tools/export.component"; @@ -28,7 +32,12 @@ export class ExportComponent extends BaseExportComponent { policyService: PolicyService, logService: LogService, userVerificationService: UserVerificationService, - formBuilder: FormBuilder + formBuilder: FormBuilder, + modalService: ModalService, + apiService: ApiService, + stateService: StateService, + userVerificationPromptService: UserVerificationPromptService, + modalConfig: ModalConfig ) { super( cryptoService, @@ -39,7 +48,12 @@ export class ExportComponent extends BaseExportComponent { policyService, logService, userVerificationService, - formBuilder + formBuilder, + modalService, + apiService, + stateService, + userVerificationPromptService, + modalConfig ); } diff --git a/apps/web/src/app/organizations/tools/import.component.ts b/apps/web/src/app/organizations/tools/import.component.ts index 08aea5b1aca..d6383edacf1 100644 --- a/apps/web/src/app/organizations/tools/import.component.ts +++ b/apps/web/src/app/organizations/tools/import.component.ts @@ -1,8 +1,10 @@ import { Component } from "@angular/core"; import { ActivatedRoute, Router } from "@angular/router"; +import { ModalService } from "@bitwarden/angular/services/modal.service"; import { I18nService } from "@bitwarden/common/abstractions/i18n.service"; import { ImportService } from "@bitwarden/common/abstractions/import.service"; +import { KeyConnectorService } from "@bitwarden/common/abstractions/keyConnector.service"; import { LogService } from "@bitwarden/common/abstractions/log.service"; import { OrganizationService } from "@bitwarden/common/abstractions/organization.service"; import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service"; @@ -25,9 +27,20 @@ export class ImportComponent extends BaseImportComponent { platformUtilsService: PlatformUtilsService, policyService: PolicyService, private organizationService: OrganizationService, - logService: LogService + logService: LogService, + modalService: ModalService, + keyConnectorService: KeyConnectorService ) { - super(i18nService, importService, router, platformUtilsService, policyService, logService); + super( + i18nService, + importService, + router, + platformUtilsService, + policyService, + logService, + modalService, + keyConnectorService + ); } async ngOnInit() { diff --git a/apps/web/src/app/services/services.module.ts b/apps/web/src/app/services/services.module.ts index cf4b290e62b..cdc2783254f 100644 --- a/apps/web/src/app/services/services.module.ts +++ b/apps/web/src/app/services/services.module.ts @@ -9,11 +9,17 @@ import { LOCALES_DIRECTORY, SYSTEM_LANGUAGE, } from "@bitwarden/angular/services/jslib-services.module"; -import { ModalService as ModalServiceAbstraction } from "@bitwarden/angular/services/modal.service"; +import { + ModalService as ModalServiceAbstraction, + ModalConfig as ModalConfigAbstraction, + ModalConfig, +} from "@bitwarden/angular/services/modal.service"; import { ApiService as ApiServiceAbstraction } from "@bitwarden/common/abstractions/api.service"; import { CipherService as CipherServiceAbstraction } from "@bitwarden/common/abstractions/cipher.service"; import { CollectionService as CollectionServiceAbstraction } from "@bitwarden/common/abstractions/collection.service"; import { CryptoService as CryptoServiceAbstraction } from "@bitwarden/common/abstractions/crypto.service"; +import { CryptoFunctionService as CryptoFunctionServiceAbstraction } from "@bitwarden/common/abstractions/cryptoFunction.service"; +import { ExportService as ExportServiceAbstraction } from "@bitwarden/common/abstractions/export.service"; import { FolderService as FolderServiceAbstraction } from "@bitwarden/common/abstractions/folder.service"; import { I18nService as I18nServiceAbstraction } from "@bitwarden/common/abstractions/i18n.service"; import { ImportService as ImportServiceAbstraction } from "@bitwarden/common/abstractions/import.service"; @@ -24,7 +30,9 @@ import { PlatformUtilsService as PlatformUtilsServiceAbstraction } from "@bitwar import { StateService as BaseStateServiceAbstraction } from "@bitwarden/common/abstractions/state.service"; import { StateMigrationService as StateMigrationServiceAbstraction } from "@bitwarden/common/abstractions/stateMigration.service"; import { StorageService as StorageServiceAbstraction } from "@bitwarden/common/abstractions/storage.service"; +import { UserVerificationPromptService as UserVerificationPromptServiceAbstraction } from "@bitwarden/common/abstractions/userVerificationPrompt.service"; import { StateFactory } from "@bitwarden/common/factories/stateFactory"; +import { ExportService } from "@bitwarden/common/services/export.service"; import { ImportService } from "@bitwarden/common/services/import.service"; import { StateService as StateServiceAbstraction } from "../../abstractions/state.service"; @@ -37,6 +45,7 @@ import { MemoryStorageService } from "../../services/memoryStorage.service"; import { PasswordRepromptService } from "../../services/passwordReprompt.service"; import { StateService } from "../../services/state.service"; import { StateMigrationService } from "../../services/stateMigration.service"; +import { UserVerificationPromptService } from "../../services/userVerificationPrompt.service"; import { WebPlatformUtilsService } from "../../services/webPlatformUtils.service"; import { HomeGuard } from "../guards/home.guard"; import { PermissionsGuard as OrgPermissionsGuard } from "../organizations/guards/permissions.guard"; @@ -90,6 +99,7 @@ import { RouterService } from "./router.service"; }, { provide: MessagingServiceAbstraction, useClass: BroadcasterMessagingService }, { provide: ModalServiceAbstraction, useClass: ModalService }, + { provide: ModalConfigAbstraction, useClass: ModalConfig }, { provide: ImportServiceAbstraction, useClass: ImportService, @@ -103,6 +113,17 @@ import { RouterService } from "./router.service"; CryptoServiceAbstraction, ], }, + { + provide: ExportServiceAbstraction, + useClass: ExportService, + deps: [ + FolderServiceAbstraction, + CipherServiceAbstraction, + ApiServiceAbstraction, + CryptoServiceAbstraction, + CryptoFunctionServiceAbstraction, + ], + }, { provide: StateMigrationServiceAbstraction, useClass: StateMigrationService, @@ -128,6 +149,10 @@ import { RouterService } from "./router.service"; provide: PasswordRepromptServiceAbstraction, useClass: PasswordRepromptService, }, + { + provide: UserVerificationPromptServiceAbstraction, + useClass: UserVerificationPromptService, + }, HomeGuard, ], }) diff --git a/apps/web/src/app/tools/export.component.html b/apps/web/src/app/tools/export.component.html index da667f3e44a..e030428e7ea 100644 --- a/apps/web/src/app/tools/export.component.html +++ b/apps/web/src/app/tools/export.component.html @@ -4,6 +4,7 @@ ngNativeValidate [appApiAction]="formPromise" [formGroup]="exportForm" + *ngIf="exportForm" >

{{ "exportVault" | i18n }}

@@ -20,23 +21,123 @@
-
- - + +
+ + +
+ + +
+ {{ "accountBackupOptionDescription" | i18n }} +
+ + + +
+ {{ "passwordProtectedOptionDescription" | i18n }} +
+
+
+
+ + + + +
+ +
+ +
+
+ +
+ {{ "exportPasswordDescription" | i18n }} +
+
+ +
+ + +
+
+ +
+
+
+
+ + +
- diff --git a/apps/web/src/app/tools/export.component.ts b/apps/web/src/app/tools/export.component.ts index d5e6aadccb3..002060d0e45 100644 --- a/apps/web/src/app/tools/export.component.ts +++ b/apps/web/src/app/tools/export.component.ts @@ -1,7 +1,9 @@ -import { Component } from "@angular/core"; -import { FormBuilder } from "@angular/forms"; +import { Component, ViewChild, ViewContainerRef } from "@angular/core"; +import { FormBuilder, FormControl, FormGroup } from "@angular/forms"; import { ExportComponent as BaseExportComponent } from "@bitwarden/angular/components/export.component"; +import { ModalConfig, ModalService } from "@bitwarden/angular/services/modal.service"; +import { ApiService } from "@bitwarden/common/abstractions/api.service"; import { CryptoService } from "@bitwarden/common/abstractions/crypto.service"; import { EventService } from "@bitwarden/common/abstractions/event.service"; import { ExportService } from "@bitwarden/common/abstractions/export.service"; @@ -9,7 +11,10 @@ import { I18nService } from "@bitwarden/common/abstractions/i18n.service"; import { LogService } from "@bitwarden/common/abstractions/log.service"; import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service"; import { PolicyService } from "@bitwarden/common/abstractions/policy.service"; +import { StateService } from "@bitwarden/common/abstractions/state.service"; import { UserVerificationService } from "@bitwarden/common/abstractions/userVerification.service"; +import { UserVerificationPromptService } from "@bitwarden/common/abstractions/userVerificationPrompt.service"; +import { EncryptedExportType } from "@bitwarden/common/enums/EncryptedExportType"; @Component({ selector: "app-export", @@ -17,6 +22,11 @@ import { UserVerificationService } from "@bitwarden/common/abstractions/userVeri }) export class ExportComponent extends BaseExportComponent { organizationId: string; + showPassword: boolean; + showConfirmPassword: boolean; + confirmDescription: string; + confirmButtonText: string; + modalTitle: string; constructor( cryptoService: CryptoService, @@ -27,7 +37,12 @@ export class ExportComponent extends BaseExportComponent { policyService: PolicyService, logService: LogService, userVerificationService: UserVerificationService, - formBuilder: FormBuilder + formBuilder: FormBuilder, + modalService: ModalService, + apiService: ApiService, + stateService: StateService, + userVerificationPromptService: UserVerificationPromptService, + modalConfig: ModalConfig ) { super( cryptoService, @@ -39,12 +54,85 @@ export class ExportComponent extends BaseExportComponent { window, logService, userVerificationService, - formBuilder + formBuilder, + modalService, + apiService, + stateService, + userVerificationPromptService, + modalConfig ); } + async submit() { + const confirmDescription = + this.exportForm.get("fileEncryptionType").value == EncryptedExportType.FileEncrypted + ? "confirmVaultExportDesc" + : "encExportKeyWarningDesc"; + const confirmButtonText = "exportVault"; + const modalTitle = "confirmVaultExport"; + + if (!this.validForm) { + return; + } + + try { + if ( + await this.userVerificationPromptService.showUserVerificationPrompt( + confirmDescription, + confirmButtonText, + modalTitle + ) + ) { + //successful + this.submitWithSecretAlreadyVerified(); + } + } catch { + this.platformUtilsService.showToast( + "error", + this.i18nService.t("error"), + this.i18nService.t("invalidMasterPassword") + ); + } + } + + togglePassword() { + this.exportForm.get("showPassword").setValue(!this.exportForm.get("showPassword").value); + document.getElementById("newPassword").focus(); + } + + toggleConfirmPassword() { + this.exportForm + .get("showConfirmPassword") + .setValue(!this.exportForm.get("showConfirmPassword").value); + document.getElementById("newConfirmPassword").focus(); + } + protected saved() { super.saved(); this.platformUtilsService.showToast("success", null, this.i18nService.t("exportSuccess")); } + + get validForm() { + if ( + this.fileEncryptionType == EncryptedExportType.FileEncrypted && + this.format == "encrypted_json" + ) { + if (this.password.length > 0 || this.confirmPassword.length > 0) { + if (this.password != this.confirmPassword) { + this.platformUtilsService.showToast( + "error", + this.i18nService.t("errorOccurred"), + this.i18nService.t("filePasswordAndConfirmFilePasswordDoNotMatch") + ); + return false; + } + + this.encryptionPassword = this.password; + return true; + } + } else { + this.clearPasswordField(); + return true; + } + } } diff --git a/apps/web/src/app/tools/import.component.ts b/apps/web/src/app/tools/import.component.ts index 540872daf99..95e63c74167 100644 --- a/apps/web/src/app/tools/import.component.ts +++ b/apps/web/src/app/tools/import.component.ts @@ -3,13 +3,18 @@ import { Router } from "@angular/router"; import * as JSZip from "jszip"; import Swal, { SweetAlertIcon } from "sweetalert2"; +import { ModalService } from "@bitwarden/angular/services/modal.service"; import { I18nService } from "@bitwarden/common/abstractions/i18n.service"; import { ImportService } from "@bitwarden/common/abstractions/import.service"; +import { KeyConnectorService } from "@bitwarden/common/abstractions/keyConnector.service"; import { LogService } from "@bitwarden/common/abstractions/log.service"; import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service"; import { PolicyService } from "@bitwarden/common/abstractions/policy.service"; import { ImportOption, ImportType } from "@bitwarden/common/enums/importOptions"; import { PolicyType } from "@bitwarden/common/enums/policyType"; +import { ImportError } from "@bitwarden/common/importers/importError"; + +import { FilePasswordPromptComponent } from "../components/file-password-prompt.component"; @Component({ selector: "app-import", @@ -20,9 +25,10 @@ export class ImportComponent implements OnInit { importOptions: ImportOption[]; format: ImportType = null; fileContents: string; - formPromise: Promise; + formPromise: Promise; loading = false; importBlockedByPolicy = false; + protected component = FilePasswordPromptComponent; protected organizationId: string = null; protected successNavigate: any[] = ["vault"]; @@ -33,7 +39,9 @@ export class ImportComponent implements OnInit { protected router: Router, protected platformUtilsService: PlatformUtilsService, protected policyService: PolicyService, - private logService: LogService + private logService: LogService, + protected modalService: ModalService, + protected keyConnectorService: KeyConnectorService ) {} async ngOnInit() { @@ -55,7 +63,6 @@ export class ImportComponent implements OnInit { } this.loading = true; - const importer = this.importService.getImporter(this.format, this.organizationId); if (importer === null) { this.platformUtilsService.showToast( @@ -108,10 +115,23 @@ export class ImportComponent implements OnInit { this.formPromise = this.importService.import(importer, fileContents, this.organizationId); const error = await this.formPromise; if (error != null) { - this.error(error); - this.loading = false; - return; + //Check if the error is that a password is required + if (error.passwordRequired) { + if (await this.promptFilePassword(fileContents)) { + //successful + } else { + //failed - File Password issues + this.loading = false; + return; + } + } else { + this.error(error); + this.loading = false; + return; + } } + + //No errors, display success message this.platformUtilsService.showToast("success", null, this.i18nService.t("importSuccess")); this.router.navigate(this.successNavigate); } catch (e) { @@ -121,6 +141,10 @@ export class ImportComponent implements OnInit { this.loading = false; } + private async promptFilePassword(fcontents: string) { + return await this.showPasswordPrompt(fcontents, this.organizationId); + } + getFormatInstructionTitle() { if (this.format == null) { return null; @@ -225,4 +249,33 @@ export class ImportComponent implements OnInit { } ); } + + protectedFields() { + return ["TOTP", "Password", "H_Field", "Card Number", "Security Code"]; + } + + async showPasswordPrompt(fcontents: string, organizationId: string) { + // if (!(await this.enabled())) { + // return true; + // } + + const ref = this.modalService.open(this.component, { + allowMultipleModals: true, + data: { + fileContents: fcontents, + organizationId: organizationId, + }, + }); + + // if (ref == null) { + // return false; + // } + + const result = await ref.onClosedPromise(); + return result === true; + } + + async enabled() { + return !this.keyConnectorService.getUsesKeyConnector(); + } } diff --git a/apps/web/src/locales/en/messages.json b/apps/web/src/locales/en/messages.json index 0a4408d6829..33768505ba1 100644 --- a/apps/web/src/locales/en/messages.json +++ b/apps/web/src/locales/en/messages.json @@ -666,6 +666,9 @@ "invalidMasterPassword": { "message": "Invalid master password" }, + "invalidFilePassword": { + "message": "Invalid file password, please use the password you entered when you created the export file." + }, "lockNow": { "message": "Lock Now" }, @@ -878,6 +881,48 @@ "fileFormat": { "message": "File Format" }, + "confirmVaultExportDesc" : { + "message": "This file export will be password protected and require the file password to decrypt." + }, + "exportPasswordDescription" : { + "message": "This password will be used to export and import this file" + }, + "confirmMasterPassword" : { + "message": "Confirm Master Password" + }, + "confirmFormat": { + "message": "Confirm Format" + }, + "filePassword": { + "message": "File Password" + }, + "confirmFilePassword": { + "message": "Confirm File Password" + }, + "accountBackupOptionDescription": { + "message": "Leverages your Bitwarden account encryption not master password, to protect the export. This export can only be imported into the current account. Use this to create a backup that cannot be used elsewhere." + }, + "passwordProtectedOptionDescription": { + "message": "Create a user-generated password to protect the export. Use this to create an export that can be used in other accounts." + }, + "fileTypeHeading": { + "message": "File Type" + }, + "accountBackup": { + "message": "Account Backup" + }, + "passwordProtected": { + "message": "Password Protected" + }, + "filePasswordAndConfirmFilePasswordDoNotMatch": { + "message": "File Password and Confirm File Password do not match." + }, + "confirmVaultImport": { + "message": "Confirm Vault Import" + }, + "confirmVaultImportDesc": { + "message": "This file is password-protected. Please enter the file password to import data." + }, "exportSuccess": { "message": "Your vault data has been exported." }, diff --git a/apps/web/src/scss/modals.scss b/apps/web/src/scss/modals.scss index 337bc3169c1..d65f041b192 100644 --- a/apps/web/src/scss/modals.scss +++ b/apps/web/src/scss/modals.scss @@ -6,6 +6,21 @@ } } +.modal-footer-content { + border: none; + border-radius: none; + @include themify($themes) { + background-color: themed("footerBackgroundColor"); + } + position: relative; + display: flex; + flex-direction: column; + width: 100%; + pointer-events: auto; + background-clip: padding-box; + outline: 0; +} + .modal-dialog { border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 0.3rem; diff --git a/apps/web/src/services/userVerificationPrompt.service.ts b/apps/web/src/services/userVerificationPrompt.service.ts new file mode 100644 index 00000000000..3e116019df2 --- /dev/null +++ b/apps/web/src/services/userVerificationPrompt.service.ts @@ -0,0 +1,10 @@ +import { Injectable } from "@angular/core"; + +import { UserVerificationPromptService as BaseUserVerificationPrompt } from "@bitwarden/angular/services/userVerificationPrompt.service"; + +import { UserVerificationPromptComponent } from "../app/components/user-verification-prompt.component"; + +@Injectable() +export class UserVerificationPromptService extends BaseUserVerificationPrompt { + component = UserVerificationPromptComponent; +} diff --git a/libs/angular/src/components/export.component.ts b/libs/angular/src/components/export.component.ts index 353a58dc726..aabfc32abd0 100644 --- a/libs/angular/src/components/export.component.ts +++ b/libs/angular/src/components/export.component.ts @@ -1,6 +1,15 @@ -import { Directive, EventEmitter, OnInit, Output } from "@angular/core"; +import { + Directive, + EventEmitter, + OnInit, + Output, + ViewChild, + ViewContainerRef, +} from "@angular/core"; import { FormBuilder } from "@angular/forms"; +import { ModalConfig, ModalService } from "@bitwarden/angular/services/modal.service"; +import { ApiService } from "@bitwarden/common/abstractions/api.service"; import { CryptoService } from "@bitwarden/common/abstractions/crypto.service"; import { EventService } from "@bitwarden/common/abstractions/event.service"; import { ExportService } from "@bitwarden/common/abstractions/export.service"; @@ -8,7 +17,10 @@ import { I18nService } from "@bitwarden/common/abstractions/i18n.service"; import { LogService } from "@bitwarden/common/abstractions/log.service"; import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service"; import { PolicyService } from "@bitwarden/common/abstractions/policy.service"; +import { StateService } from "@bitwarden/common/abstractions/state.service"; import { UserVerificationService } from "@bitwarden/common/abstractions/userVerification.service"; +import { UserVerificationPromptService } from "@bitwarden/common/abstractions/userVerificationPrompt.service"; +import { EncryptedExportType } from "@bitwarden/common/enums/EncryptedExportType"; import { EventType } from "@bitwarden/common/enums/eventType"; import { PolicyType } from "@bitwarden/common/enums/policyType"; @@ -19,9 +31,17 @@ export class ExportComponent implements OnInit { formPromise: Promise; disabledByPolicy = false; + @ViewChild("viewUserApiKeyTemplate", { read: ViewContainerRef, static: true }) + viewUserApiKeyModalRef: ViewContainerRef; + + encryptionPassword: string; + exportForm = this.formBuilder.group({ format: ["json"], secret: [""], + password: [""], + confirmPassword: [""], + fileEncryptionType: [""], }); formatOptions = [ @@ -40,7 +60,12 @@ export class ExportComponent implements OnInit { protected win: Window, private logService: LogService, private userVerificationService: UserVerificationService, - private formBuilder: FormBuilder + protected formBuilder: FormBuilder, + protected modalService: ModalService, + protected apiService: ApiService, + protected stateService: StateService, + protected userVerificationPromptService: UserVerificationPromptService, + protected modalConfig: ModalConfig ) {} async ngOnInit() { @@ -60,6 +85,30 @@ export class ExportComponent implements OnInit { return this.format === "encrypted_json"; } + async submitWithSecretAlreadyVerified() { + if (this.disabledByPolicy) { + this.platformUtilsService.showToast( + "error", + null, + this.i18nService.t("personalVaultExportPolicyInEffect") + ); + return; + } + + try { + this.formPromise = this.getExportData(); + const data = await this.formPromise; + this.downloadFile(data); + this.saved(); + await this.collectEvent(); + this.exportForm.get("secret").setValue(""); + this.exportForm.get("password").setValue(""); + this.exportForm.get("confirmPassword").setValue(""); + } catch (e) { + this.logService.error(e); + } + } + async submit() { if (this.disabledByPolicy) { this.platformUtilsService.showToast( @@ -74,12 +123,15 @@ export class ExportComponent implements OnInit { if (!acceptedWarning) { return; } - const secret = this.exportForm.get("secret").value; - try { - await this.userVerificationService.verifyUser(secret); - } catch (e) { - this.platformUtilsService.showToast("error", this.i18nService.t("errorOccurred"), e.message); + + const successfulVerification = await this.userVerificationService.verifyUser(secret); + if (!successfulVerification) { + this.platformUtilsService.showToast( + "error", + this.i18nService.t("error"), + this.i18nService.t("invalidMasterPassword") + ); return; } @@ -124,7 +176,7 @@ export class ExportComponent implements OnInit { } protected getExportData() { - return this.exportService.getExport(this.format); + return this.exportService.getExport(this.format, null, this.encryptionPassword); } protected getFileName(prefix?: string) { @@ -144,10 +196,26 @@ export class ExportComponent implements OnInit { await this.eventService.collect(EventType.User_ClientExportedVault); } + protected clearPasswordField() { + this.encryptionPassword = ""; + } + get format() { return this.exportForm.get("format").value; } + get password() { + return this.exportForm.get("password").value; + } + + get confirmPassword() { + return this.exportForm.get("confirmPassword").value; + } + + get fileEncryptionType() { + return this.exportForm.get("fileEncryptionType").value; + } + private downloadFile(csv: string): void { const fileName = this.getFileName(); this.platformUtilsService.saveFile(this.win, csv, { type: "text/plain" }, fileName); diff --git a/libs/angular/src/components/file-password-prompt.component.ts b/libs/angular/src/components/file-password-prompt.component.ts new file mode 100644 index 00000000000..428712c5252 --- /dev/null +++ b/libs/angular/src/components/file-password-prompt.component.ts @@ -0,0 +1,60 @@ +import { Directive } from "@angular/core"; + +import { I18nService } from "@bitwarden/common/abstractions/i18n.service"; +import { ImportService } from "@bitwarden/common/abstractions/import.service"; +import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service"; + +import { ModalConfig } from "../services/modal.service"; + +import { ModalRef } from "./modal/modal.ref"; + +/** + * Used to verify the user's File password to import their encyrpted export file" feature only. + */ +@Directive() +export class FilePasswordPromptComponent { + showPassword = false; + filePassword = ""; + organizationId = ""; + fileContents = ""; + + constructor( + private modalRef: ModalRef, + private platformUtilsService: PlatformUtilsService, + private i18nService: I18nService, + private importService: ImportService, + config: ModalConfig + ) { + this.fileContents = config.data.fileContents; + this.organizationId = config.data.organizationId; + } + + togglePassword() { + this.showPassword = !this.showPassword; + } + + async submit() { + const importerPassword = this.importService.getImporter( + "bitwardenpasswordprotected", + this.organizationId, + this.filePassword + ); + + const formPromise = this.importService.import( + importerPassword, + this.fileContents, + this.organizationId + ); + const passwordError = await formPromise; + + if (passwordError != null) { + this.platformUtilsService.showToast( + "error", + this.i18nService.t("error"), + this.i18nService.t("invalidFilePassword") + ); + } else { + this.modalRef.close(true); + } + } +} diff --git a/libs/angular/src/components/user-verification-prompt.component.ts b/libs/angular/src/components/user-verification-prompt.component.ts new file mode 100644 index 00000000000..9b4ce8715de --- /dev/null +++ b/libs/angular/src/components/user-verification-prompt.component.ts @@ -0,0 +1,56 @@ +import { Directive } from "@angular/core"; +import { FormBuilder, FormControl } from "@angular/forms"; + +import { I18nService } from "@bitwarden/common/abstractions/i18n.service"; +import { PlatformUtilsService } from "@bitwarden/common/abstractions/platformUtils.service"; +import { UserVerificationService } from "@bitwarden/common/abstractions/userVerification.service"; + +import { ModalConfig } from "../services/modal.service"; + +import { ModalRef } from "./modal/modal.ref"; + +/** + * Used to verify the user's secret, you can customize all of the text in the modal. + */ +@Directive() +export class UserVerificationPromptComponent { + showPassword = false; + organizationId = ""; + confirmDescription = this.config.data.confirmDescription; + confirmButtonText = this.config.data.confirmButtonText; + modalTitle = this.config.data.modalTitle; + myGroup = this.formBuilder.group({ + secret: new FormControl(), + }); + + constructor( + private modalRef: ModalRef, + protected config: ModalConfig, + protected userVerificationService: UserVerificationService, + private formBuilder: FormBuilder, + private platformUtilsService: PlatformUtilsService, + private i18nService: I18nService + ) {} + + togglePassword() { + this.showPassword = !this.showPassword; + } + + async submit() { + const secret = this.myGroup.get("secret").value; + + try { + //Incorrect secret will throw an invalid password error. + await this.userVerificationService.verifyUser(secret); + } catch (e) { + this.platformUtilsService.showToast( + "error", + this.i18nService.t("error"), + this.i18nService.t("invalidMasterPassword") + ); + return; + } + + this.modalRef.close(true); + } +} diff --git a/libs/angular/src/services/userVerificationPrompt.service.ts b/libs/angular/src/services/userVerificationPrompt.service.ts new file mode 100644 index 00000000000..fae9d698192 --- /dev/null +++ b/libs/angular/src/services/userVerificationPrompt.service.ts @@ -0,0 +1,56 @@ +import { Injectable } from "@angular/core"; + +import { I18nService } from "@bitwarden/common/abstractions/i18n.service"; +import { KeyConnectorService } from "@bitwarden/common/abstractions/keyConnector.service"; +import { UserVerificationPromptService as UserVerificationPromptServiceAbstraction } from "@bitwarden/common/abstractions/userVerificationPrompt.service"; + +import { UserVerificationPromptComponent } from "../components/user-verification-prompt.component"; + +import { ModalService } from "./modal.service"; + +/** + * Used to verify the user's File Password for the "Import passwords using File Password" feature only. + */ +@Injectable() +export class UserVerificationPromptService implements UserVerificationPromptServiceAbstraction { + protected component = UserVerificationPromptComponent; + + constructor( + private modalService: ModalService, + private keyConnectorService: KeyConnectorService, + protected i18nService: I18nService + ) {} + + protectedFields() { + return ["TOTP", "Password", "H_Field", "Card Number", "Security Code"]; + } + + async showUserVerificationPrompt( + confirmDescription?: string, + confirmButtonText?: string, + modalTitle?: string + ) { + if (!(await this.enabled())) { + return true; + } + + const ref = await this.modalService.open(this.component, { + allowMultipleModals: true, + data: { + confirmDescription: confirmDescription ? confirmDescription : "passwordConfirmationDesc", + confirmButtonText: confirmButtonText ? confirmButtonText : "ok", + modalTitle: modalTitle ? modalTitle : "passwordConfirmation", + }, + }); + + if (ref == null) { + return false; + } + + return (await ref.onClosedPromise()) === true; + } + + async enabled() { + return !(await this.keyConnectorService.getUsesKeyConnector()); + } +} diff --git a/libs/common/src/abstractions/export.service.ts b/libs/common/src/abstractions/export.service.ts index b0266530bd6..9dc5fa8044d 100644 --- a/libs/common/src/abstractions/export.service.ts +++ b/libs/common/src/abstractions/export.service.ts @@ -3,7 +3,7 @@ import { EventView } from "../models/view/eventView"; export type ExportFormat = "csv" | "json" | "encrypted_json"; export abstract class ExportService { - getExport: (format?: ExportFormat, organizationId?: string) => Promise; + getExport: (format?: ExportFormat, organizationId?: string, password?: string) => Promise; getPasswordProtectedExport: (password: string, organizationId?: string) => Promise; getOrganizationExport: (organizationId: string, format?: ExportFormat) => Promise; getEventExport: (events: EventView[]) => Promise; diff --git a/libs/common/src/abstractions/userVerificationPrompt.service.ts b/libs/common/src/abstractions/userVerificationPrompt.service.ts new file mode 100644 index 00000000000..83b9f7d2eae --- /dev/null +++ b/libs/common/src/abstractions/userVerificationPrompt.service.ts @@ -0,0 +1,9 @@ +export abstract class UserVerificationPromptService { + protectedFields: () => string[]; + showUserVerificationPrompt: ( + confirmDescription?: string, + confirmButtonText?: string, + modalTitle?: string + ) => Promise; + enabled: () => Promise; +} diff --git a/libs/common/src/enums/encryptedExportType.ts b/libs/common/src/enums/encryptedExportType.ts new file mode 100644 index 00000000000..4767869f7d0 --- /dev/null +++ b/libs/common/src/enums/encryptedExportType.ts @@ -0,0 +1,4 @@ +export enum EncryptedExportType { + AccountEncrypted = 0, + FileEncrypted = 1, +} diff --git a/libs/common/src/services/export.service.ts b/libs/common/src/services/export.service.ts index c6f08be6d26..299d9697b6a 100644 --- a/libs/common/src/services/export.service.ts +++ b/libs/common/src/services/export.service.ts @@ -36,13 +36,19 @@ export class ExportService implements ExportServiceAbstraction { private cryptoFunctionService: CryptoFunctionService ) {} - async getExport(format: ExportFormat = "csv", organizationId?: string): Promise { + async getExport( + format: ExportFormat = "csv", + organizationId?: string, + password?: string + ): Promise { if (organizationId) { return await this.getOrganizationExport(organizationId, format); } if (format === "encrypted_json") { - return this.getEncryptedExport(); + return password == undefined || password == "" + ? this.getEncryptedExport() + : this.getPasswordProtectedExport(password); } else { return this.getDecryptedExport(format); }