Allow for re-sending verification email

src/app/_layout/header-bar/header-bar-verify-email/header-bar-verify-email.component.html

@@ -1,2 +1,11 @@
-<p>header-bar-verify-email works!</p>
-<p *ngIf="show">Should display nag about verifying email!</p>
+<div *ngIf="show" class="verify-host">
+  <div>
+    Hey! It seems that you have not verified your email address yet. Users without a verified email might get deleted in the future.
+  </div>
+
+  <div class="buttons">
+    <button type="button" class="button is-info" [disabled]="!canPressButton" (click)="requestNewEmail()">
+      Request new verification email
+    </button>
+  </div>
+</div>

src/app/_layout/header-bar/header-bar-verify-email/header-bar-verify-email.component.scss

@@ -0,0 +1,10 @@
+.verify-host {
+  padding: 10px;
+}
+
+div {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  gap: 0.5em;
+}

src/app/_layout/header-bar/header-bar-verify-email/header-bar-verify-email.component.ts

@@ -1,16 +1,34 @@
-import { Component, OnInit } from '@angular/core';
+import { Component } from '@angular/core';
 import { UserService } from '../../../../services/user.service';
+import { AuthService } from '../../../../services/auth.service';
 
 @Component({
   selector: 'app-header-bar-verify-email',
   templateUrl: './header-bar-verify-email.component.html',
   styleUrls: ['./header-bar-verify-email.component.scss']
 })
-export class HeaderBarVerifyEmailComponent implements OnInit {
+export class HeaderBarVerifyEmailComponent {
 
-  constructor(private userService: UserService) { }
+  canPressButton = true;
 
-  ngOnInit(): void {
+  constructor(
+    private authService: AuthService,
+    private userService: UserService,
+  ) { }
+
+  requestNewEmail() {
+    this.canPressButton = false;
+    this.authService.requestNewVerificationEmail().subscribe({
+      next({ status }) {
+        console.log(status);
+        alert('Email sent!');
+      },
+
+      error(err: any) {
+        console.log(err);
+        alert('Something went wrong! Please try again later.  ');
+      }
+    });
   }
 
   get show(): boolean {

src/app/user/user.module.ts

@@ -56,7 +56,7 @@ const userRoutes: Routes = [
     SubmissionComponent,
     ModeratedComponent,
     AdminControlsComponent,
-    MfaModalComponent
+    MfaModalComponent,
   ],
   imports: [
     CommonModule,

src/services/auth.service.ts

@@ -74,21 +74,25 @@ export class AuthService extends BaseService {
   performLogin(details: LoginDetails): Observable<LoginResponse> {
     details.twoFactorCode = details.twoFactorCode || null;
 
-    return this.http.post<LoginResponse>(this.url('login', 'v2'), details);
+    return this.http.post<LoginResponse>(this.v2Url('login'), details);
   }
 
   performRegister(details: SignupDto): Promise<SignupResponseDto> {
     return firstValueFrom(
-      this.http.post<SignupResponseDto>(this.url('signup', 'v2'), details)
+      this.http.post<SignupResponseDto>(this.v2Url('signup'), details)
     );
   }
 
+  requestNewVerificationEmail() {
+    return this.http.post<{ status: boolean }>(this.v2Url('verify-email'), null);
+  }
+
   initMfaSettings(): Observable<InitMFADto> {
-    return this.http.put<InitMFADto>(this.url('mfa/init', 'v2'), null);
+    return this.http.put<InitMFADto>(this.v2Url('mfa/init'), null);
   }
 
   storeMfa(code: string): Observable<{ status: boolean }> {
-    return this.http.post<{ status: boolean }>(`${this.url('mfa', 'v2')}?code=${code}`, null);
+    return this.http.post<{ status: boolean }>(`${this.v2Url('mfa')}?code=${code}`, null);
   }
 
   set token(value: string) {