From 91ce6527c093e9ad05cf7d665aeb50f4667c931b Mon Sep 17 00:00:00 2001 From: Matt Smith Date: Tue, 25 Aug 2020 09:49:24 -0500 Subject: [PATCH] Added set password flow to browser based SSO --- .../accounts/set-password.component.html | 124 ++++++++++++++++++ src/popup/accounts/set-password.component.ts | 60 +++++++++ src/popup/app-routing.module.ts | 6 + src/popup/app.module.ts | 2 + src/popup/services/services.module.ts | 13 +- 5 files changed, 196 insertions(+), 9 deletions(-) create mode 100644 src/popup/accounts/set-password.component.html create mode 100644 src/popup/accounts/set-password.component.ts diff --git a/src/popup/accounts/set-password.component.html b/src/popup/accounts/set-password.component.html new file mode 100644 index 0000000000..9f291a527b --- /dev/null +++ b/src/popup/accounts/set-password.component.html @@ -0,0 +1,124 @@ +
+
+ +
+ {{'appName' | i18n}} +
+
+ +
+
+ +
+ {{'ssoCompleteRegistration' | i18n}} + + {{'masterPasswordPolicyInEffect' | i18n}} +
    +
  • + {{'policyInEffectMinComplexity' | i18n : getPasswordScoreAlertDisplay()}} +
  • +
  • + {{'policyInEffectMinLength' | i18n : enforcedPolicyOptions?.minLength.toString()}} +
  • +
  • {{'policyInEffectUppercase' | i18n}}
  • +
  • {{'policyInEffectLowercase' | i18n}}
  • +
  • {{'policyInEffectNumbers' | i18n}}
  • +
  • {{'policyInEffectSpecial' | i18n : '!@#$%^&*'}} +
  • +
+
+
+
+
+
+
+
+ + +
+
+ + + +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+ + +
+
+ + + +
+
+
+
+
+
+
+
+ + +
+
+ +
+
+
+ + + \ No newline at end of file diff --git a/src/popup/accounts/set-password.component.ts b/src/popup/accounts/set-password.component.ts new file mode 100644 index 0000000000..ee0da49e57 --- /dev/null +++ b/src/popup/accounts/set-password.component.ts @@ -0,0 +1,60 @@ +import { Component } from '@angular/core'; + +import { Router } from '@angular/router'; + +import { ApiService } from 'jslib/abstractions/api.service'; +import { CryptoService } from 'jslib/abstractions/crypto.service'; +import { I18nService } from 'jslib/abstractions/i18n.service'; +import { MessagingService } from 'jslib/abstractions/messaging.service'; +import { PasswordGenerationService } from 'jslib/abstractions/passwordGeneration.service'; +import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service'; +import { PolicyService } from 'jslib/abstractions/policy.service'; +import { UserService } from 'jslib/abstractions/user.service'; + +import { + SetPasswordComponent as BaseSetPasswordComponent, +} from 'jslib/angular/components/set-password.component'; + +@Component({ + selector: 'app-set-password', + templateUrl: 'set-password.component.html', +}) +export class SetPasswordComponent extends BaseSetPasswordComponent { + constructor(apiService: ApiService, i18nService: I18nService, + cryptoService: CryptoService, messagingService: MessagingService, + userService: UserService, passwordGenerationService: PasswordGenerationService, + platformUtilsService: PlatformUtilsService, policyService: PolicyService, router: Router) { + super(i18nService, cryptoService, messagingService, userService, passwordGenerationService, + platformUtilsService, policyService, router, apiService); + } + + get masterPasswordScoreWidth() { + return this.masterPasswordScore == null ? 0 : (this.masterPasswordScore + 1) * 20; + } + + get masterPasswordScoreColor() { + switch (this.masterPasswordScore) { + case 4: + return 'success'; + case 3: + return 'primary'; + case 2: + return 'warning'; + default: + return 'danger'; + } + } + + get masterPasswordScoreText() { + switch (this.masterPasswordScore) { + case 4: + return this.i18nService.t('strong'); + case 3: + return this.i18nService.t('good'); + case 2: + return this.i18nService.t('weak'); + default: + return this.masterPasswordScore != null ? this.i18nService.t('weak') : null; + } + } +} \ No newline at end of file diff --git a/src/popup/app-routing.module.ts b/src/popup/app-routing.module.ts index ca3c4b37b8..959263d77f 100644 --- a/src/popup/app-routing.module.ts +++ b/src/popup/app-routing.module.ts @@ -39,6 +39,7 @@ import { GroupingsComponent } from './vault/groupings.component'; import { PasswordHistoryComponent } from './vault/password-history.component'; import { ShareComponent } from './vault/share.component'; import { ViewComponent } from './vault/view.component'; +import { SetPasswordComponent } from './accounts/set-password.component'; const routes: Routes = [ { @@ -86,6 +87,11 @@ const routes: Routes = [ canActivate: [LaunchGuardService], data: { state: 'sso' }, }, + { + path: 'set-password', + component: SetPasswordComponent, + data: { state: 'set-password' }, + }, { path: 'register', component: RegisterComponent, diff --git a/src/popup/app.module.ts b/src/popup/app.module.ts index 7fce0b27d7..f6ec79ae06 100644 --- a/src/popup/app.module.ts +++ b/src/popup/app.module.ts @@ -45,6 +45,7 @@ import { GroupingsComponent } from './vault/groupings.component'; import { PasswordHistoryComponent } from './vault/password-history.component'; import { ShareComponent } from './vault/share.component'; import { ViewComponent } from './vault/view.component'; +import { SetPasswordComponent } from './accounts/set-password.component'; import { A11yTitleDirective } from 'jslib/angular/directives/a11y-title.directive'; import { ApiActionDirective } from 'jslib/angular/directives/api-action.directive'; @@ -209,6 +210,7 @@ registerLocaleData(localeZhTw, 'zh-TW'); TwoFactorComponent, SsoComponent, ViewComponent, + SetPasswordComponent ], entryComponents: [], providers: [ diff --git a/src/popup/services/services.module.ts b/src/popup/services/services.module.ts index 785aba0675..d5e032ba93 100644 --- a/src/popup/services/services.module.ts +++ b/src/popup/services/services.module.ts @@ -21,7 +21,7 @@ import { AuthService as AuthServiceAbstraction } from 'jslib/abstractions/auth.s import { CipherService } from 'jslib/abstractions/cipher.service'; import { CollectionService } from 'jslib/abstractions/collection.service'; import { CryptoService } from 'jslib/abstractions/crypto.service'; -import { CryptoFunctionService } from 'jslib/abstractions/cryptoFunction.service'; +import { CryptoFunctionService as CryptoFunctionServiceAbstraction } from 'jslib/abstractions/cryptoFunction.service'; import { EnvironmentService } from 'jslib/abstractions/environment.service'; import { EventService } from 'jslib/abstractions/event.service'; import { ExportService } from 'jslib/abstractions/export.service'; @@ -41,7 +41,6 @@ import { TokenService } from 'jslib/abstractions/token.service'; import { TotpService } from 'jslib/abstractions/totp.service'; import { UserService } from 'jslib/abstractions/user.service'; import { VaultTimeoutService } from 'jslib/abstractions/vaultTimeout.service'; -import { WebCryptoFunctionService } from 'jslib/services/webCryptoFunction.service'; import { AutofillService } from '../../services/abstractions/autofill.service'; import BrowserMessagingService from '../../services/browserMessaging.service'; @@ -50,6 +49,7 @@ import { AuthService } from 'jslib/services/auth.service'; import { ConstantsService } from 'jslib/services/constants.service'; import { SearchService } from 'jslib/services/search.service'; import { StateService } from 'jslib/services/state.service'; +import { WebCryptoFunctionService } from 'jslib/services/webCryptoFunction.service'; import { Analytics } from 'jslib/misc/analytics'; @@ -72,7 +72,7 @@ export const authService = new AuthService(getBgService('cryptoSe messagingService, getBgService('vaultTimeoutService')(), null); export const searchService = new PopupSearchService(getBgService('searchService')(), getBgService('cipherService')(), getBgService('platformUtilsService')()); -export const cryptoFunctionService: CryptoFunctionService = new WebCryptoFunctionService(window, +export const cryptoFunctionService = new WebCryptoFunctionService(window, getBgService('platformUtilsService')()); export function initFactory(i18nService: I18nService, storageService: StorageService, @@ -125,7 +125,7 @@ export function initFactory(i18nService: I18nService, storageService: StorageSer { provide: AuthServiceAbstraction, useValue: authService }, { provide: StateServiceAbstraction, useValue: stateService }, { provide: SearchServiceAbstraction, useValue: searchService }, - { provide: CryptoFunctionService, useValue: cryptoFunctionService }, + { provide: CryptoFunctionServiceAbstraction, useValue: cryptoFunctionService }, { provide: AuditService, useFactory: getBgService('auditService'), deps: [] }, { provide: CipherService, useFactory: getBgService('cipherService'), deps: [] }, { provide: FolderService, useFactory: getBgService('folderService'), deps: [] }, @@ -135,11 +135,6 @@ export function initFactory(i18nService: I18nService, storageService: StorageSer { provide: TokenService, useFactory: getBgService('tokenService'), deps: [] }, { provide: I18nService, useFactory: getBgService('i18nService'), deps: [] }, { provide: CryptoService, useFactory: getBgService('cryptoService'), deps: [] }, - { - provide: CryptoFunctionService, - useFactory: getBgService('cryptoFunctionService'), - deps: [], - }, { provide: EventService, useFactory: getBgService('eventService'), deps: [] }, { provide: PolicyService, useFactory: getBgService('policyService'), deps: [] }, {