From 0b952e07f7160217f6881e56fceb0485d898f5cc Mon Sep 17 00:00:00 2001 From: akastijn Date: Tue, 15 Jul 2025 21:51:03 +0200 Subject: [PATCH] Refactor `HeaderComponent` to organize inputs, inject dependencies, and improve HTML formatting. Add `logout` method for authentication management. --- .../pages/header/header/header.component.html | 166 +++++++++--------- .../pages/header/header/header.component.ts | 15 +- 2 files changed, 95 insertions(+), 86 deletions(-) diff --git a/frontend/src/app/pages/header/header/header.component.html b/frontend/src/app/pages/header/header/header.component.html index 4587f2e..a05e068 100644 --- a/frontend/src/app/pages/header/header/header.component.html +++ b/frontend/src/app/pages/header/header/header.component.html @@ -1,6 +1,6 @@
+ [ngStyle]="{ 'background-image': getBackgroundImage(),'height': height, 'background-position': getBackgroundPosition() }"> + + + - + -
+ diff --git a/frontend/src/app/pages/header/header/header.component.ts b/frontend/src/app/pages/header/header/header.component.ts index b401092..91b80c3 100644 --- a/frontend/src/app/pages/header/header/header.component.ts +++ b/frontend/src/app/pages/header/header/header.component.ts @@ -1,4 +1,4 @@ -import {Component, HostListener, Input, OnDestroy, OnInit} from '@angular/core'; +import {Component, HostListener, inject, Input, OnDestroy, OnInit} from '@angular/core'; import {CommonModule, NgOptimizedImage} from '@angular/common'; import {ThemeComponent} from '@shared-components/theme/theme.component'; import {RouterLink} from '@angular/router'; @@ -20,6 +20,10 @@ import {MatDialog} from '@angular/material/dialog'; styleUrls: ['./header.component.scss'] }) export class HeaderComponent implements OnInit, OnDestroy { + + private authService: AuthService = inject(AuthService) + private dialog: MatDialog = inject(MatDialog) + @Input() current_page: string = ''; @Input() background_image: string = ''; @Input() height: string = ''; @@ -30,11 +34,6 @@ export class HeaderComponent implements OnInit, OnDestroy { private subscription: Subscription | undefined; public isAuthenticated: boolean = false; - constructor(protected authService: AuthService, - private dialog: MatDialog) { - - } - ngOnInit(): void { this.subscription = this.authService.isAuthenticated$.subscribe(isAuthenticated => { this.isAuthenticated = isAuthenticated; @@ -94,4 +93,8 @@ export class HeaderComponent implements OnInit, OnDestroy { public hasAccess(claims: string[]): boolean { return this.authService.hasAccess(claims) } + + protected logout() { + this.authService.logout() + } }