Implement signup approval in client

4 files changed, 48 insertions, 2 deletions

diff --git a/client/src/app/+admin/shared/shared-admin.module.ts b/client/src/app/+admin/shared/shared-admin.module.ts
index bef7d54ef..a5c300d12 100644
--- a/client/src/app/+admin/shared/shared-admin.module.ts
+++ b/client/src/app/+admin/shared/shared-admin.module.ts
@@ -1,5 +1,6 @@
 import { NgModule } from '@angular/core'
 import { SharedMainModule } from '../../shared/shared-main/shared-main.module'
+import { UserEmailInfoComponent } from './user-email-info.component'
 import { UserRealQuotaInfoComponent } from './user-real-quota-info.component'
 
 @NgModule({
@@ -8,11 +9,13 @@ import { UserRealQuotaInfoComponent } from './user-real-quota-info.component'
   ],
 
   declarations: [
-    UserRealQuotaInfoComponent
+    UserRealQuotaInfoComponent,
+    UserEmailInfoComponent
   ],
 
   exports: [
-    UserRealQuotaInfoComponent
+    UserRealQuotaInfoComponent,
+    UserEmailInfoComponent
   ],
 
   providers: []
diff --git a/client/src/app/+admin/shared/user-email-info.component.html b/client/src/app/+admin/shared/user-email-info.component.html
new file mode 100644
index 000000000..244240619
--- /dev/null
+++ b/client/src/app/+admin/shared/user-email-info.component.html
@@ -0,0 +1,13 @@
+<ng-container>
+  <a [href]="'mailto:' + entry.email" [title]="getTitle()">
+    <ng-container *ngIf="!requiresEmailVerification">
+      {{ entry.email }}
+    </ng-container>
+
+    <ng-container *ngIf="requiresEmailVerification">
+      <em *ngIf="!entry.emailVerified">? {{ entry.email }}</em>
+
+      <ng-container *ngIf="entry.emailVerified === true">&#x2713; {{ entry.email }}</ng-container>
+    </ng-container>
+  </a>
+</ng-container>
diff --git a/client/src/app/+admin/shared/user-email-info.component.scss b/client/src/app/+admin/shared/user-email-info.component.scss
new file mode 100644
index 000000000..d34947edd
--- /dev/null
+++ b/client/src/app/+admin/shared/user-email-info.component.scss
@@ -0,0 +1,10 @@
+@use '_variables' as *;
+@use '_mixins' as *;
+
+a {
+  color: pvar(--mainForegroundColor);
+
+  &:hover {
+    text-decoration: underline;
+  }
+}
diff --git a/client/src/app/+admin/shared/user-email-info.component.ts b/client/src/app/+admin/shared/user-email-info.component.ts
new file mode 100644
index 000000000..e33948b60
--- /dev/null
+++ b/client/src/app/+admin/shared/user-email-info.component.ts
@@ -0,0 +1,20 @@
+import { Component, Input } from '@angular/core'
+import { User, UserRegistration } from '@shared/models/users'
+
+@Component({
+  selector: 'my-user-email-info',
+  templateUrl: './user-email-info.component.html',
+  styleUrls: [ './user-email-info.component.scss' ]
+})
+export class UserEmailInfoComponent {
+  @Input() entry: User | UserRegistration
+  @Input() requiresEmailVerification: boolean
+
+  getTitle () {
+    if (this.entry.emailVerified) {
+      return $localize`User email has been verified`
+    }
+
+    return $localize`User email hasn't been verified`
+  }
+}