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 @@ + + + + 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%;