Rework Auth for better stability

src/Client/src/app/app.config.ts

@@ -1,13 +1,18 @@
-import { ApplicationConfig, provideBrowserGlobalErrorListeners, provideZoneChangeDetection } from '@angular/core';
+import { ApplicationConfig, inject, provideAppInitializer, provideBrowserGlobalErrorListeners, provideZoneChangeDetection } from '@angular/core';
 import { provideRouter } from '@angular/router';
 import { routes } from './app.routes';
 import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
+import { Authentication } from './services/Authentication';
 
 export const appConfig: ApplicationConfig = {
   providers: [
     provideBrowserGlobalErrorListeners(),
     provideZoneChangeDetection({ eventCoalescing: true }),
     provideRouter(routes),
-    provideHttpClient(withInterceptorsFromDi())
+    provideHttpClient(withInterceptorsFromDi()),
+    provideAppInitializer(async () => {
+      const auth = inject(Authentication);
+      return auth.loadLoginState();
+    })
   ]
-};
+};

src/Client/src/app/app.ts

@@ -1,4 +1,4 @@
-import { Component, ElementRef, ViewChild } from '@angular/core';
+import { Component } from '@angular/core';
 import { Router, RouterModule, RouterOutlet, ActivatedRoute } from '@angular/router';
 import { Authentication } from './services/Authentication';
 import { CommonModule, Location } from '@angular/common';
@@ -14,32 +14,22 @@ import { isDevMode } from '@angular/core';
 export class App {
 
   devMode: boolean = false;
+  loginToken: string | null = null;
 
   constructor( private http: HttpClient, public auth: Authentication, private router: Router, private route: ActivatedRoute, private location: Location){
-    
     this.devMode = isDevMode();
-    
     this.route.queryParams.subscribe(params => {
-      const loginToken = params['LoginToken'];
+      this.loginToken = params['LoginToken'];
-      console.log("LoginToken : " + loginToken);
+      console.log("LoginToken : " + this.loginToken);
-      if (loginToken){
+      if (this.loginToken){
-        this.http.post( "api/account/loginticket", JSON.stringify(loginToken), { headers: {'Content-Type': 'application/json'} } ).subscribe({
+        this.http.post( "api/account/loginticket", JSON.stringify(this.loginToken), { headers: {'Content-Type': 'application/json'} } ).subscribe({
-          next: data => {
+          next: async() => {
-            auth.getLoginState();
+            await this.auth.loadLoginState();
-            const pathWithoutQuery = this.location.path().split('?')[0];
-            this.location.replaceState(pathWithoutQuery);
-          },
-          error: err => {
-            auth.getLoginState();
             const pathWithoutQuery = this.location.path().split('?')[0];
             this.location.replaceState(pathWithoutQuery);
           }
         })
-      }else{
-        auth.getLoginState();
       }
     });
-    
   }
-
 }

src/Client/src/app/services/Authentication.ts

@@ -1,7 +1,7 @@
 import { Injectable } from "@angular/core";
 import { Account } from "../models/Account";
-import { BehaviorSubject, Observable } from "rxjs";
+import { BehaviorSubject, firstValueFrom } from "rxjs";
-import { HttpClient } from "@angular/common/http";
+import { HttpClient, HttpErrorResponse } from "@angular/common/http";
 
 @Injectable({ providedIn: 'root' })
 export class Authentication{
@@ -11,17 +11,14 @@ export class Authentication{
 
     constructor( private http: HttpClient){ }
 
-    getLoginState(): Observable<Account> {
+    async loadLoginState(): Promise<void> {
-        let sub = this.http.post<Account>( "api/account/loginState", {}, {} );
+        try {
-        sub.subscribe({
+            this._user.next( await firstValueFrom(this.http.post<Account>( "api/account/loginState", {}, {} )) );
-            next: data => {
+        } catch (err: unknown){
-                this._user.next(data);
+            if (err instanceof HttpErrorResponse) {
-            },
+                console.error( err.error );
-            error: err => {
-                console.log("No login state found: ", err.error);
             }
-        });
+        }
-        return sub;
     }
 
     Logout(){