verify email page

jslib

@@ -1 +1 @@
-Subproject commit 152c44185b6509ad2769f1c1bc306a0e4dd576d5
+Subproject commit 67b2b5318556f2d21bf4f2d117af8228b9f9549c

src/app/accounts/login.component.ts

@@ -6,7 +6,6 @@ import { Angulartics2 } from 'angulartics2';
 
 import { AuthService } from 'jslib/abstractions/auth.service';
 import { I18nService } from 'jslib/abstractions/i18n.service';
-import { SyncService } from 'jslib/abstractions/sync.service';
 
 import { LoginComponent as BaseLoginComponent } from 'jslib/angular/components/login.component';
 
@@ -17,7 +16,7 @@ import { LoginComponent as BaseLoginComponent } from 'jslib/angular/components/l
 export class LoginComponent extends BaseLoginComponent {
     constructor(authService: AuthService, router: Router,
         analytics: Angulartics2, toasterService: ToasterService,
-        i18nService: I18nService, private syncService: SyncService) {
+        i18nService: I18nService) {
         super(authService, router, analytics, toasterService, i18nService);
         this.successRoute = '/vault';
     }

src/app/accounts/verify-email-token.component.html

@@ -0,0 +1,8 @@
+<div class="mt-5 d-flex justify-content-center">
+    <div>
+        <img src="../../images/logo-dark@2x.png" class="mb-4 logo" alt="Bitwarden">
+        <p class="text-center">
+            <i class="fa fa-spinner fa-spin fa-2x text-muted"></i>
+        </p>
+    </div>
+</div>

src/app/accounts/verify-email-token.component.ts

@@ -0,0 +1,46 @@
+import {
+    Component,
+    OnInit,
+} from '@angular/core';
+import {
+    ActivatedRoute,
+    Router,
+} from '@angular/router';
+
+import { ToasterService } from 'angular2-toaster';
+
+import { ApiService } from 'jslib/abstractions/api.service';
+import { I18nService } from 'jslib/abstractions/i18n.service';
+import { UserService } from 'jslib/abstractions/user.service';
+
+import { VerifyEmailRequest } from 'jslib/models/request/verifyEmailRequest';
+
+@Component({
+    selector: 'app-verify-email-token',
+    templateUrl: 'verify-email-token.component.html',
+})
+export class VerifyEmailTokenComponent implements OnInit {
+    constructor(private router: Router, private toasterService: ToasterService,
+        private i18nService: I18nService, private route: ActivatedRoute,
+        private apiService: ApiService, private userService: UserService) { }
+
+    ngOnInit() {
+        this.route.queryParams.subscribe(async (qParams) => {
+            if (qParams.userId != null && qParams.token != null) {
+                try {
+                    await this.apiService.postAccountVerifyEmailToken(
+                        new VerifyEmailRequest(qParams.userId, qParams.token));
+                    const authed = await this.userService.isAuthenticated();
+                    if (authed) {
+                        await this.apiService.refreshIdentityToken();
+                    }
+                    this.toasterService.popAsync('success', null, this.i18nService.t('emailVerified'));
+                    this.router.navigate(['/']);
+                    return;
+                } catch { }
+            }
+            this.toasterService.popAsync('error', null, this.i18nService.t('emailVerifiedFailed'));
+            this.router.navigate(['/']);
+        });
+    }
+}

src/app/app-routing.module.ts

@@ -13,6 +13,7 @@ import { LockComponent } from './accounts/lock.component';
 import { LoginComponent } from './accounts/login.component';
 import { RegisterComponent } from './accounts/register.component';
 import { TwoFactorComponent } from './accounts/two-factor.component';
+import { VerifyEmailTokenComponent } from './accounts/verify-email-token.component';
 
 import { CollectionsComponent as OrgManageCollectionsComponent } from './organizations/manage/collections.component';
 import { EventsComponent as OrgEventsComponent } from './organizations/manage/events.component';
@@ -70,6 +71,7 @@ const routes: Routes = [
                 data: { titleId: 'passwordHint' },
             },
             { path: 'lock', component: LockComponent },
+            { path: 'verify-email', component: VerifyEmailTokenComponent },
         ],
     },
     {

src/app/app.module.ts

@@ -31,6 +31,7 @@ import { LoginComponent } from './accounts/login.component';
 import { RegisterComponent } from './accounts/register.component';
 import { TwoFactorOptionsComponent } from './accounts/two-factor-options.component';
 import { TwoFactorComponent } from './accounts/two-factor.component';
+import { VerifyEmailTokenComponent } from './accounts/verify-email-token.component';
 
 import {
     CollectionAddEditComponent as OrgCollectionAddEditComponent,
@@ -227,6 +228,7 @@ import { SearchPipe } from 'jslib/angular/pipes/search.pipe';
         UserLayoutComponent,
         VaultComponent,
         VerifyEmailComponent,
+        VerifyEmailTokenComponent,
     ],
     entryComponents: [
         AddEditComponent,

src/locales/en/messages.json

@@ -2096,6 +2096,12 @@
   "checkInboxForVerification": {
     "message": "Check your email inbox for a verification link."
   },
+  "emailVerified": {
+    "message": "Your email has been verified."
+  },
+  "emailVerifiedFailed": {
+    "message": "Unable to verify your email. Try sending a new verification email."
+  },
   "updateBrowser": {
     "message": "Update Browser"
   },