From ab4005ae00df3a67a09132f97d97bbb0c1b63a5f Mon Sep 17 00:00:00 2001 From: Kyle Spearrin Date: Thu, 12 Jul 2018 11:34:51 -0400 Subject: [PATCH] verify email and outdated browser callouts --- src/app/app.module.ts | 2 ++ src/app/settings/verify-email.component.html | 15 ++++++++++ src/app/settings/verify-email.component.ts | 31 ++++++++++++++++++++ src/app/vault/vault.component.html | 13 ++++++-- src/app/vault/vault.component.ts | 12 +++++++- src/locales/en/messages.json | 15 ++++++++++ 6 files changed, 84 insertions(+), 4 deletions(-) create mode 100644 src/app/settings/verify-email.component.html create mode 100644 src/app/settings/verify-email.component.ts diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 2b57067cbec..6768da57c11 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -83,6 +83,7 @@ import { TwoFactorVerifyComponent } from './settings/two-factor-verify.component import { TwoFactorYubiKeyComponent } from './settings/two-factor-yubikey.component'; import { UpdateLicenseComponent } from './settings/update-license.component'; import { UserBillingComponent } from './settings/user-billing.component'; +import { VerifyEmailComponent } from './settings/verify-email.component'; import { BreachReportComponent } from './tools/breach-report.component'; import { ExportComponent } from './tools/export.component'; @@ -225,6 +226,7 @@ import { SearchPipe } from 'jslib/angular/pipes/search.pipe'; UserBillingComponent, UserLayoutComponent, VaultComponent, + VerifyEmailComponent, ], entryComponents: [ AddEditComponent, diff --git a/src/app/settings/verify-email.component.html b/src/app/settings/verify-email.component.html new file mode 100644 index 00000000000..d257f50e7e1 --- /dev/null +++ b/src/app/settings/verify-email.component.html @@ -0,0 +1,15 @@ +
+
+ {{'verifyEmail' | i18n}} +
+
+

{{'verifyEmailDesc' | i18n}}

+ +
+
diff --git a/src/app/settings/verify-email.component.ts b/src/app/settings/verify-email.component.ts new file mode 100644 index 00000000000..d7a63870f5e --- /dev/null +++ b/src/app/settings/verify-email.component.ts @@ -0,0 +1,31 @@ +import { Component } from '@angular/core'; + +import { ToasterService } from 'angular2-toaster'; +import { Angulartics2 } from 'angulartics2'; + +import { ApiService } from 'jslib/abstractions/api.service'; +import { I18nService } from 'jslib/abstractions/i18n.service'; + +@Component({ + selector: 'app-verify-email', + templateUrl: 'verify-email.component.html', +}) +export class VerifyEmailComponent { + actionPromise: Promise; + + constructor(private apiService: ApiService, private i18nService: I18nService, + private analytics: Angulartics2, private toasterService: ToasterService) { } + + async send() { + if (this.actionPromise != null) { + return; + } + try { + this.actionPromise = this.apiService.postAccountVerifyEmail(); + await this.actionPromise; + this.analytics.eventTrack.next({ action: 'Sent Verification Email' }); + this.toasterService.popAsync('success', null, this.i18nService.t('checkInboxForVerification')); + } catch { } + this.actionPromise = null; + } +} diff --git a/src/app/vault/vault.component.html b/src/app/vault/vault.component.html index 492092f7ce1..092b04f4034 100644 --- a/src/app/vault/vault.component.html +++ b/src/app/vault/vault.component.html @@ -49,12 +49,19 @@
-
+ +
+
+ {{'updateBrowser' | i18n}} +
- Some callout +

{{'updateBrowserDesc' | i18n}}

+ + {{'updateBrowser' | i18n}} +
-
+
{{'organizations' | i18n}}
diff --git a/src/app/vault/vault.component.ts b/src/app/vault/vault.component.ts index a90e40bcb53..18e4f991c77 100644 --- a/src/app/vault/vault.component.ts +++ b/src/app/vault/vault.component.ts @@ -30,7 +30,9 @@ import { GroupingsComponent } from './groupings.component'; import { ShareComponent } from './share.component'; import { I18nService } from 'jslib/abstractions/i18n.service'; +import { StorageService } from 'jslib/abstractions/storage.service'; import { SyncService } from 'jslib/abstractions/sync.service'; +import { TokenService } from 'jslib/abstractions/token.service'; @Component({ selector: 'app-vault', @@ -53,14 +55,22 @@ export class VaultComponent implements OnInit { type: CipherType = null; folderId: string = null; collectionId: string = null; + showVerifyEmail = false; + showBrowserOutdated = false; + showUpdateKey = false; private modal: ModalComponent = null; constructor(private syncService: SyncService, private route: ActivatedRoute, private router: Router, private location: Location, - private i18nService: I18nService, private componentFactoryResolver: ComponentFactoryResolver) { } + private i18nService: I18nService, private componentFactoryResolver: ComponentFactoryResolver, + private tokenService: TokenService, private storageService: StorageService) { } async ngOnInit() { + this.showVerifyEmail = !(await this.tokenService.getEmailVerified()); + this.showBrowserOutdated = window.navigator.userAgent.indexOf('MSIE') !== -1; + this.showUpdateKey = !this.showVerifyEmail && (await this.storageService.get('encKey')) == null; + this.route.queryParams.subscribe(async (params) => { await this.syncService.fullSync(false); await Promise.all([ diff --git a/src/locales/en/messages.json b/src/locales/en/messages.json index 489944c0ff8..5e309f928a0 100644 --- a/src/locales/en/messages.json +++ b/src/locales/en/messages.json @@ -2086,5 +2086,20 @@ }, "endDate": { "message": "End Date" + }, + "verifyEmail": { + "message": "Verify Email" + }, + "verifyEmailDesc": { + "message": "Verify your account's email address to unlock access to all features." + }, + "checkInboxForVerification": { + "message": "Check your email inbox for a verification link." + }, + "updateBrowser": { + "message": "Update Browser" + }, + "updateBrowserDesc": { + "message": "You are using an unsupported web browser. The web vault may not function properly." } }