Add page for account activation (#235)

* Add activation page

* Center result message

* Remove unused imports

src/app/app-routing.module.ts

@@ -11,6 +11,7 @@ const routes: Routes = [
   { path: 'login', loadChildren: () => import('./pages/login/login.module').then(m => m.LoginModule) },
   { path: 'signup', loadChildren: () => import('./pages/sign-up/sign-up.module').then(m => m.SignUpModule) },
   { path: 'p/:slug', loadChildren: () => import('./pages/poll-participants/poll-participants.module').then(m => m.PollParticipantsModule) },
+  { path: 'activate/:token', loadChildren: () => import('./pages/activation/activation.module').then(m => m.ActivationModule) },
   { path: 'dashboard', component: DashboardComponent,
     children: [
       { path: '', pathMatch: 'full', redirectTo: '/dashboard/home' },

src/app/pages/activation/activation-routing.module.ts

@@ -0,0 +1,17 @@
+/*
+ * Copyright © Live-Poll 2020-2021. All rights reserved
+ */
+
+import {NgModule} from '@angular/core';
+import {RouterModule, Routes} from '@angular/router';
+import {ActivationComponent} from './activation.component';
+
+const routes: Routes = [
+  { path: '', component: ActivationComponent },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class ActivationRoutingModule { }

src/app/pages/activation/activation.component.html

@@ -0,0 +1,32 @@
+<!--
+  ~ Copyright © Live-Poll 2020-2021. All rights reserved
+  -->
+
+<div class="page">
+  <!-- Spinner -->
+  <nz-spin *ngIf="loading" nzSimple nzSize="large" class="spinner"></nz-spin>
+
+  <!-- Success message -->
+  <nz-result
+    *ngIf="!loading && success"
+    nzStatus="success"
+    nzTitle="Successfully activated your account!"
+    nzSubTitle="You can now continue by logging in to your account. To log in, click below.">
+    <div nz-result-extra>
+      <button nz-button nzType="primary" routerLink="/login">Continue to login</button>
+      <button nz-button routerLink="/">Go to main page</button>
+    </div>
+  </nz-result>
+
+  <!-- Error message -->
+  <nz-result
+    *ngIf="!loading && !success"
+    nzStatus="error"
+    nzTitle="An error occurred while activating your account!"
+    nzSubTitle="Maybe you're using an expired link or you changed it somehow.">
+    <div nz-result-extra>
+      <button nz-button nzType="primary" routerLink="/signup">Retry registration</button>
+      <button nz-button routerLink="/login">Go to main page</button>
+    </div>
+  </nz-result>
+</div>

src/app/pages/activation/activation.component.sass

@@ -0,0 +1,10 @@
+/*!
+ / Copyright © Live-Poll 2020-2021. All rights reserved
+ /
+
+.page
+  display: flex
+  height: 100vh
+  align-items: center
+  justify-content: center
+

src/app/pages/activation/activation.component.ts

@@ -0,0 +1,42 @@
+/*
+ * Copyright © Live-Poll 2020-2021. All rights reserved
+ */
+
+import {Component, EventEmitter, OnInit} from '@angular/core';
+import {Poll} from '../../model/poll';
+import {User} from '../../model/user';
+import {ActivatedRoute} from '@angular/router';
+import {AccountService} from '../../service/account.service';
+
+@Component({
+  selector: 'app-home',
+  templateUrl: './activation.component.html',
+  styleUrls: ['./activation.component.sass']
+})
+export class ActivationComponent implements OnInit {
+
+  loading = true;
+  success = true;
+
+  /**
+   * Initialize component
+   *
+   * @param route Active route
+   * @param accountService Injected AccountService
+   */
+  constructor(
+    private route: ActivatedRoute,
+    private accountService: AccountService
+  ) {}
+
+  ngOnInit(): void {
+    this.route.params.subscribe(params => {
+      this.accountService.confirm(params.token).subscribe((_) => {
+        this.loading = false;
+      }, (_) => {
+        this.success = true;
+        this.loading = false;
+      });
+    });
+  }
+}

src/app/pages/activation/activation.module.ts

@@ -0,0 +1,29 @@
+/*
+ * Copyright © Live-Poll 2020-2021. All rights reserved
+ */
+
+import {NgModule} from '@angular/core';
+import {ActivationRoutingModule} from './activation-routing.module';
+import {ActivationComponent} from './activation.component';
+import {NzButtonModule} from 'ng-zorro-antd/button';
+import {NzEmptyModule} from 'ng-zorro-antd/empty';
+import {NzBreadCrumbModule} from 'ng-zorro-antd/breadcrumb';
+import {NzLayoutModule} from 'ng-zorro-antd/layout';
+import {NzIconModule} from 'ng-zorro-antd/icon';
+import {CommonModule} from '@angular/common';
+import {ResultEmptyModule} from '../../components/result-empty/result-empty.module';
+import {NzResultModule} from 'ng-zorro-antd/result';
+import {NzSpinModule} from 'ng-zorro-antd/spin';
+
+@NgModule({
+  imports: [
+    ActivationRoutingModule,
+    NzResultModule,
+    NzSpinModule,
+    CommonModule,
+    NzButtonModule
+  ],
+  declarations: [ActivationComponent],
+  exports: [ActivationComponent]
+})
+export class ActivationModule { }