diff --git a/src/app/confirmation-modal/confirmation-modal.component.html b/src/app/confirmation-modal/confirmation-modal.component.html
index 419add9..c294827 100644
--- a/src/app/confirmation-modal/confirmation-modal.component.html
+++ b/src/app/confirmation-modal/confirmation-modal.component.html
@@ -1,6 +1,6 @@
{{ data.title }}
{{ data.description }}
-
-
+
+
diff --git a/src/app/dashboard/dashboard.component.html b/src/app/dashboard/dashboard.component.html
index 4041018..f989d96 100644
--- a/src/app/dashboard/dashboard.component.html
+++ b/src/app/dashboard/dashboard.component.html
@@ -1,14 +1,20 @@
-
-
+
+
+
+
+
+
diff --git a/src/app/dashboard/dashboard.component.ts b/src/app/dashboard/dashboard.component.ts
index 8644256..000f514 100644
--- a/src/app/dashboard/dashboard.component.ts
+++ b/src/app/dashboard/dashboard.component.ts
@@ -10,10 +10,18 @@ import { MatButtonModule } from '@angular/material/button';
import { MatDialog, MatDialogModule } from '@angular/material/dialog';
import { ConfirmationModalComponent } from '../confirmation-modal/confirmation-modal.component';
import { MatSnackBar } from '@angular/material/snack-bar';
+import { OptionsMenuComponent } from '../options-menu/options-menu.component';
+import { LogoutService } from '../service/logout.service';
@Component({
selector: 'app-dashboard',
- imports: [NavbarComponent, MatTableModule, MatCardModule, MatButtonModule],
+ imports: [
+ NavbarComponent,
+ MatTableModule,
+ MatCardModule,
+ MatButtonModule,
+ OptionsMenuComponent,
+ ],
templateUrl: './dashboard.component.html',
styleUrl: './dashboard.component.css',
})
diff --git a/src/app/login/login.component.html b/src/app/login/login.component.html
index c4ad87b..701eebe 100644
--- a/src/app/login/login.component.html
+++ b/src/app/login/login.component.html
@@ -24,10 +24,17 @@
placeholder="Aurelius14"
/>
-
+
-
diff --git a/src/app/login/login.component.ts b/src/app/login/login.component.ts
index 11435df..8d2b906 100644
--- a/src/app/login/login.component.ts
+++ b/src/app/login/login.component.ts
@@ -13,7 +13,7 @@ import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule, MatLabel } from '@angular/material/input';
import { MatButton, MatButtonModule } from '@angular/material/button';
import { MatSnackBar } from '@angular/material/snack-bar';
-import {MatDividerModule} from '@angular/material/divider';
+import { MatDividerModule } from '@angular/material/divider';
@Component({
selector: 'app-login',
@@ -38,7 +38,7 @@ export class LoginComponent {
constructor(
private router: Router,
private snackBar: MatSnackBar,
- ) { }
+ ) {}
private validationErrorMessages: Record = {
required: 'This field is required',
@@ -78,7 +78,12 @@ export class LoginComponent {
}
loginWithAuthentik() {
- this.pb.collection('users').authWithOAuth2({ provider: 'oidc' })
+ this.pb
+ .collection('users')
+ .authWithOAuth2({
+ provider: 'oidc',
+ scopes: ['openid', 'email', 'profile', 'avatar'],
+ })
.then(() => {
this.router.navigate(['dashboard']);
})
diff --git a/src/app/options-menu/options-menu.component.css b/src/app/options-menu/options-menu.component.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/options-menu/options-menu.component.html b/src/app/options-menu/options-menu.component.html
new file mode 100644
index 0000000..ca0b865
--- /dev/null
+++ b/src/app/options-menu/options-menu.component.html
@@ -0,0 +1,13 @@
+
+ more_vert
+
+
+
+ logout
+ Logout
+
+
diff --git a/src/app/options-menu/options-menu.component.spec.ts b/src/app/options-menu/options-menu.component.spec.ts
new file mode 100644
index 0000000..615eec6
--- /dev/null
+++ b/src/app/options-menu/options-menu.component.spec.ts
@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { OptionsMenuComponent } from './options-menu.component';
+
+describe('OptionsMenuComponent', () => {
+ let component: OptionsMenuComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [OptionsMenuComponent],
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(OptionsMenuComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/options-menu/options-menu.component.ts b/src/app/options-menu/options-menu.component.ts
new file mode 100644
index 0000000..554bb57
--- /dev/null
+++ b/src/app/options-menu/options-menu.component.ts
@@ -0,0 +1,19 @@
+import { Component } from '@angular/core';
+import { MatIconModule } from '@angular/material/icon';
+import { MatMenuModule } from '@angular/material/menu';
+import { MatButtonModule } from '@angular/material/button';
+import { LogoutService } from '../service/logout.service';
+
+@Component({
+ selector: 'app-options-menu',
+ imports: [MatIconModule, MatMenuModule, MatButtonModule],
+ templateUrl: './options-menu.component.html',
+ styleUrl: './options-menu.component.css',
+})
+export class OptionsMenuComponent {
+ constructor(private logoutService: LogoutService) {}
+
+ logout() {
+ this.logoutService.logout();
+ }
+}
diff --git a/src/app/service/logout.service.ts b/src/app/service/logout.service.ts
new file mode 100644
index 0000000..6c76d09
--- /dev/null
+++ b/src/app/service/logout.service.ts
@@ -0,0 +1,18 @@
+import { Injectable } from '@angular/core';
+import PocketBase from 'pocketbase';
+import { environment } from '../../environments/environment';
+import { Router } from '@angular/router';
+
+@Injectable({
+ providedIn: 'root',
+})
+export class LogoutService {
+ private pb = new PocketBase(environment.POCKETBASE);
+
+ constructor(private router: Router) {}
+
+ logout() {
+ this.pb.authStore.clear();
+ this.router.navigate(['']);
+ }
+}
diff --git a/src/styles.scss b/src/styles.scss
index b1a863c..5ef6f19 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -15,8 +15,6 @@ html {
@apply underline text-blue-500 cursor-pointer;
}
-
-
html,
body {
height: 100%;