Fixed authguard

src/app/app.config.ts

@@ -1,4 +1,4 @@
-import {ApplicationConfig, provideZoneChangeDetection} from '@angular/core';
+import {ApplicationConfig, inject, provideAppInitializer, provideZoneChangeDetection} from '@angular/core';
 import {provideRouter} from '@angular/router';
 
 import {routes} from './app.routes';
@@ -10,15 +10,21 @@ import {MAT_SNACK_BAR_DEFAULT_OPTIONS} from "@angular/material/snack-bar";
 import {AuthGuard} from "./authentication/authguard";
 import {TokenInterceptor} from "./authentication/tokenInterceptor";
 import {ErrorInterceptor} from "./authentication/errorInterceptor";
-import {provideEnvironmentNgxMask, provideNgxMask} from "ngx-mask";
+import {provideNgxMask} from "ngx-mask";
+import {UserService} from './authentication/user.service';
+import {provideAnimations} from "@angular/platform-browser/animations";
 
 export const appConfig: ApplicationConfig = {
   providers: [
+    provideAppInitializer(() => {
+      const userService = inject(UserService);
+      userService.initializeUser();
+    }),
     provideZoneChangeDetection({eventCoalescing: true}),
     provideRouter(routes),
     provideClientHydration(),
     provideHttpClient(withFetch(), withInterceptorsFromDi()),
-    provideAnimationsAsync(),
+    provideAnimations(),
     provideMomentDateAdapter(undefined, {useUtc: false}),
     { provide: MAT_SNACK_BAR_DEFAULT_OPTIONS, useValue: { duration: 2500}},
     AuthGuard,
@@ -27,3 +33,4 @@ export const appConfig: ApplicationConfig = {
     provideNgxMask(),
   ]
 };
+

src/app/authentication/authguard.ts

@@ -1,6 +1,7 @@
 import {Injectable} from "@angular/core";
 import {ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot} from "@angular/router";
 import {UserService} from "./user.service";
+import {delay, map, Observable, of} from "rxjs";
 
 @Injectable()
 export class AuthGuard implements CanActivate {
@@ -10,14 +11,12 @@ export class AuthGuard implements CanActivate {
     private userService: UserService
   ) {}
 
-  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
+  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
     if (this.userService.getUser()) {
       return true;
     }
-
-    this.router.navigate(['/auth/login'], {
-      queryParams: { returnUrl: state.url },
-    });
+    this.router.navigate(['/auth/login'], { queryParams: { returnUrl: state.url } });
     return false;
   }
+
 }

src/app/authentication/user.service.ts

@@ -1,4 +1,4 @@
-import {EventEmitter, Injectable, Output} from "@angular/core";
+import { Injectable } from "@angular/core";
 import { SsrCookieService } from "ngx-cookie-service-ssr";
 import { Router } from "@angular/router";
 import { User } from "./user";
@@ -8,9 +8,10 @@ import {BehaviorSubject} from "rxjs";
   providedIn: 'root'
 })
 export class UserService {
-  user?: User;
+  private user?: User;
+  private userEmitter = new BehaviorSubject<string>('');
+  private initialized = false;
 
-  private userEmitter = new BehaviorSubject('');
   currentUser = this.userEmitter.asObservable();
 
   constructor(
@@ -18,30 +19,44 @@ export class UserService {
     private router: Router,
   ) {}
 
-  public getUser(): User | undefined {
-    const user = this.cookieService.get('swissuser');
+  initializeUser() {
+    if (this.initialized) return;
 
-    if (user) {
-      this.user = JSON.parse(user);
-      this.userEmitter.next(JSON.parse(user).username);
+    try {
+      const userCookie = this.cookieService.get('swissuser');
+      if (userCookie && userCookie.trim() !== '') {
+        this.user = JSON.parse(userCookie);
+        if (this.user?.username) {
+          this.userEmitter.next(this.user.username);
+        } else {
+          this.userEmitter.next('');
+        }
       } else {
         this.user = undefined;
+        this.userEmitter.next('');
+      }
+    } catch (error) {
+      console.error('Error parsing user cookie:', error);
+      this.user = undefined;
+      this.userEmitter.next('');
     }
 
+    this.initialized = true;
+  }
+
+  public getUser(): User | undefined {
+    this.initializeUser();
     return this.user;
   }
 
   public isLoggedIn(): boolean {
-    const user = this.cookieService.get('swissuser');
-
-    return !(user == undefined || false || user == "");
+    this.initializeUser();
+    return !!this.user;
   }
 
   public setUser(user: User) {
     this.cookieService.set('swissuser', JSON.stringify(user));
-
     this.user = user;
-
     this.userEmitter.next(this.user.username);
   }
 

src/app/components/tournament-manage/tournament-manage.component.html

@@ -124,7 +124,7 @@
             </ng-template>
 
             @if (this.activeMatches().length > 0) {
-              <h6 class="mt-3">Actieve wedstrijden</h6>
+              <h6 class="mt-3"></h6>
 
               @for (activeMatch of this.activeMatches(); track activeMatch.match.id) {
                 <mat-expansion-panel>

src/app/components/tournament-players/tournament-players.component.ts

@@ -34,25 +34,15 @@ import {MatTab, MatTabGroup, MatTabLabel} from "@angular/material/tabs";
   standalone: true,
   styleUrl: './tournament-players.component.scss'
 })
-export class TournamentPlayersComponent implements OnInit {
+export class TournamentPlayersComponent {
 
   @Input() tournament: Tournament;
 
   constructor(
     private tournamentService: TournamentService,
     private _snackBar: MatSnackBar,
-    private route: ActivatedRoute,
-    private router: Router,
   ) {}
 
-  ngOnInit() {
-    console.log('Tournament received from parent:', this.tournament);
-    // const id = this.route.snapshot.paramMap.get('id');
-    // this.tournamentService.getById(Number(id)).subscribe(data => {
-    //   this.tournament = data;
-    // });
-  }
-
   playerPaid($event: MatSlideToggleChange, playerId: number) {
     this.tournamentService.playerPaid(this.tournament.id, playerId, $event.checked).subscribe(() => {
       this._snackBar.open('Opgeslagen.');

src/app/service/header.service.ts

@@ -1,4 +1,3 @@
-// header.service.ts
 import { Injectable } from '@angular/core';
 import { BehaviorSubject } from 'rxjs';