feat(auth): moved logout button to settings page

undefined

Author: ZenSoftware

apps/portal/src/app/app.component.html

@@ -39,11 +39,6 @@
         <i class="fa-solid fa-fw fa-user-shield me-2"></i>
         Super
       </a>
-
-      <a mat-list-item (click)="auth.logout()">
-        <i class="fa-solid fa-fw fa-sign-in-alt me-2"></i>
-        Logout
-      </a>
     </mat-nav-list>
   </div>
 

libs/main/src/lib/zen-portal/zen-settings/zen-settings.component.html

@@ -14,6 +14,11 @@ <h1>
       </div>
     </div>
 
+    <button mat-raised-button color="primary" (click)="auth.logout()" class="w-100 fs-4 py-1 mb-4">
+      <i class="fa-solid fa-fw fa-sign-out-alt me-2"></i>
+      Logout
+    </button>
+
     <div class="mb-4">
       <zen-password-change *ngIf="accountInfo.hasPassword"/>
     </div>

libs/main/src/lib/zen-portal/zen-settings/zen-settings.component.ts

@@ -1,13 +1,14 @@
 import { AsyncPipe, NgIf } from '@angular/common';
 import { Component } from '@angular/core';
+import { MatButtonModule } from '@angular/material/button';
 import { AuthService } from '@zen/auth';
 import { ZenAccountInfoComponent, ZenPasswordChangeComponent } from '@zen/auth';
 
 @Component({
   selector: 'zen-settings',
   templateUrl: 'zen-settings.component.html',
   standalone: true,
-  imports: [AsyncPipe, NgIf, ZenAccountInfoComponent, ZenPasswordChangeComponent],
+  imports: [AsyncPipe, MatButtonModule, NgIf, ZenAccountInfoComponent, ZenPasswordChangeComponent],
 })
 export class ZenSettingsComponent {
   constructor(public auth: AuthService) {}