feat: implement authentication with JWT and user management

This commit is contained in:
Constantin Simonis 2025-05-07 13:42:04 +02:00
commit 35d8fbaea0
No known key found for this signature in database
GPG key ID: 3878FF77C24AF4D2
42 changed files with 989 additions and 397 deletions

View file

@ -12,7 +12,8 @@
<div class="hidden md:flex items-center space-x-4">
@if (!isLoggedIn) {
<button (click)="login()" class="button-primary px-4 py-1.5">Anmelden</button>
<a routerLink="/login" class="button-primary px-4 py-1.5">Anmelden</a>
<a routerLink="/register" class="bg-emerald-700 text-white hover:bg-emerald-600 px-4 py-1.5 rounded">Registrieren</a>
}
@if (isLoggedIn) {
<div
@ -66,7 +67,8 @@
<a routerLink="/games" class="nav-mobile-link">Spiele</a>
<div class="pt-2 space-y-2">
@if (!isLoggedIn) {
<button (click)="login()" class="button-primary w-full py-1.5">Anmelden</button>
<a routerLink="/login" class="button-primary w-full py-1.5 block text-center">Anmelden</a>
<a routerLink="/register" class="bg-emerald-700 text-white hover:bg-emerald-600 w-full py-1.5 rounded block text-center">Registrieren</a>
}
@if (isLoggedIn) {
<button (click)="logout()" class="button-primary w-full py-1.5">Abmelden</button>

View file

@ -26,10 +26,13 @@ export class NavbarComponent implements OnInit, OnDestroy {
private userService = inject(UserService);
private userSubscription: Subscription | undefined;
private authSubscription: Subscription | undefined;
public balance = signal(0);
ngOnInit() {
this.userSubscription = this.userService.currentUser$.subscribe((user) => {
// Subscribe to auth changes
this.authSubscription = this.authService.currentUser.subscribe(user => {
this.isLoggedIn = !!user;
this.balance.set(user?.balance ?? 0);
console.log('Updated navbar balance:', user?.balance);
});
@ -41,13 +44,8 @@ export class NavbarComponent implements OnInit, OnDestroy {
if (this.userSubscription) {
this.userSubscription.unsubscribe();
}
}
login() {
try {
this.authService.login();
} catch (error) {
console.error('Login failed:', error);
if (this.authSubscription) {
this.authSubscription.unsubscribe();
}
}