diff --git a/frontend/src/app/feature/game/blackjack/blackjack.component.ts b/frontend/src/app/feature/game/blackjack/blackjack.component.ts index 973754a..c21a012 100644 --- a/frontend/src/app/feature/game/blackjack/blackjack.component.ts +++ b/frontend/src/app/feature/game/blackjack/blackjack.component.ts @@ -14,6 +14,7 @@ import { NavbarComponent } from '@shared/components/navbar/navbar.component'; import { UserService } from '@service/user.service'; import { timer } from 'rxjs'; import { DebtDialogComponent } from '@shared/components/debt-dialog/debt-dialog.component'; +import { AuthService } from '@service/auth.service'; @Component({ selector: 'app-blackjack', @@ -34,6 +35,7 @@ import { DebtDialogComponent } from '@shared/components/debt-dialog/debt-dialog. export default class BlackjackComponent implements OnInit { private router = inject(Router); private userService = inject(UserService); + private authService = inject(AuthService); private blackjackService = inject(BlackjackService); dealerCards = signal([]); @@ -51,15 +53,8 @@ export default class BlackjackComponent implements OnInit { debtAmount = signal(0); ngOnInit(): void { - // Initial user load from server - this.userService.getCurrentUser().subscribe((user) => { - if (user) { - this.balance.set(user.balance); - } - }); - // Subscribe to user updates for real-time balance changes - this.userService.currentUser$.subscribe((user) => { + this.authService.userSubject.subscribe((user) => { if (user) { this.balance.set(user.balance); } @@ -95,15 +90,10 @@ export default class BlackjackComponent implements OnInit { // Get the latest balance before showing the result dialog timer(1000).subscribe(() => { - this.userService.getCurrentUser().subscribe((user) => { - if (user) { - this.balance.set(user.balance); - // Show the result dialog after updating the balance - timer(500).subscribe(() => { - this.showGameResult.set(true); - console.log('Game result dialog shown after delay'); - }); - } + // Show the result dialog after refreshing user data + timer(500).subscribe(() => { + this.showGameResult.set(true); + console.log('Game result dialog shown after delay'); }); }); } @@ -186,15 +176,11 @@ export default class BlackjackComponent implements OnInit { // Wait a bit to ensure the backend has finished processing timer(1000).subscribe(() => { - this.userService.getCurrentUser().subscribe((user) => { - if (user) { - this.balance.set(user.balance); - if (user.balance < 0) { - this.debtAmount.set(Math.abs(user.balance)); - this.showDebtDialog.set(true); - } - } - }); + const user = this.authService.currentUserValue; + if (user && user.balance < 0) { + this.debtAmount.set(Math.abs(user.balance)); + this.showDebtDialog.set(true); + } }); this.isActionInProgress.set(false); @@ -210,13 +196,6 @@ export default class BlackjackComponent implements OnInit { onCloseGameResult(): void { console.log('Closing game result dialog'); this.showGameResult.set(false); - - // Refresh the balance when dialog is closed and update local state - this.userService.getCurrentUser().subscribe((user) => { - if (user) { - this.balance.set(user.balance); - } - }); } onCloseDebtDialog(): void { diff --git a/frontend/src/app/feature/game/slots/slots.component.ts b/frontend/src/app/feature/game/slots/slots.component.ts index e395cd0..71fa482 100644 --- a/frontend/src/app/feature/game/slots/slots.component.ts +++ b/frontend/src/app/feature/game/slots/slots.component.ts @@ -13,6 +13,7 @@ import { FormsModule } from '@angular/forms'; import { UserService } from '@service/user.service'; import { Subscription } from 'rxjs'; import { AnimatedNumberComponent } from '@blackjack/components/animated-number/animated-number.component'; +import { AuthService } from '@service/auth.service'; interface SlotResult { status: 'win' | 'lose' | 'blank' | 'start'; @@ -39,6 +40,7 @@ interface SlotResult { export default class SlotsComponent implements OnInit, OnDestroy { private httpClient: HttpClient = inject(HttpClient); private userService = inject(UserService); + private authService = inject(AuthService); private userSubscription: Subscription | undefined; slotInfo = signal | null>(null); @@ -61,7 +63,7 @@ export default class SlotsComponent implements OnInit, OnDestroy { this.slotInfo.set(data); }); - this.userSubscription = this.userService.getCurrentUser().subscribe((user) => { + this.userSubscription = this.authService.userSubject.subscribe((user) => { this.balance.set(user?.balance ?? 0); }); diff --git a/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.ts b/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.ts index 3d84d9d..97e5200 100644 --- a/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.ts +++ b/frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.ts @@ -6,6 +6,7 @@ import { LootBox, Reward } from 'app/model/LootBox'; import { NavbarComponent } from '@shared/components/navbar/navbar.component'; import { UserService } from '@service/user.service'; import { User } from 'app/model/User'; +import { AuthService } from '@service/auth.service'; @Component({ selector: 'app-lootbox-opening', @@ -30,10 +31,11 @@ export default class LootboxOpeningComponent { private router: Router, private lootboxService: LootboxService, private userService: UserService, + private authService: AuthService, private cdr: ChangeDetectorRef ) { this.loadLootbox(); - this.userService.currentUser$.subscribe((user) => { + this.authService.userSubject.subscribe((user) => { this.currentUser = user; this.cdr.detectChanges(); }); diff --git a/frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.ts b/frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.ts index 747e29e..dc39869 100644 --- a/frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.ts +++ b/frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.ts @@ -5,8 +5,9 @@ import { LootboxService } from '../services/lootbox.service'; import { LootBox } from 'app/model/LootBox'; import { Router } from '@angular/router'; import { timeout } from 'rxjs'; -import { UserService } from '@service/user.service'; import { User } from 'app/model/User'; +import { AuthService } from '@service/auth.service'; +import { UserService } from '@service/user.service'; @Component({ selector: 'app-lootbox-selection', @@ -90,12 +91,13 @@ export default class LootboxSelectionComponent implements OnInit { private lootboxService: LootboxService, private router: Router, private cdr: ChangeDetectorRef, + private authService: AuthService, private userService: UserService ) {} ngOnInit(): void { this.loadLootboxes(); - this.userService.currentUser$.subscribe((user) => { + this.authService.userSubject.subscribe((user) => { this.currentUser = user; this.cdr.detectChanges(); }); diff --git a/frontend/src/app/service/user.service.ts b/frontend/src/app/service/user.service.ts index 5233d00..ad2d2c8 100644 --- a/frontend/src/app/service/user.service.ts +++ b/frontend/src/app/service/user.service.ts @@ -1,51 +1,33 @@ import { inject, Injectable } from '@angular/core'; -import { HttpClient } from '@angular/common/http'; -import { BehaviorSubject, catchError, EMPTY, Observable, tap } from 'rxjs'; -import { User } from '../model/User'; import { AuthService } from '@service/auth.service'; +import { User } from '../model/User'; @Injectable({ providedIn: 'root', }) export class UserService { - public currentUserSubject = new BehaviorSubject(null); - public currentUser$ = this.currentUserSubject.asObservable(); - private http: HttpClient = inject(HttpClient); private authService = inject(AuthService); - constructor() { - // Initialize with the current user from AuthService if available - const currentUser = this.authService.getUser(); - if (currentUser) { - this.currentUserSubject.next(currentUser); - } - - // Subscribe to auth service user updates - this.authService.userSubject.subscribe((user) => { - this.currentUserSubject.next(user); - }); - } - - public getCurrentUser(): Observable { - return this.http.get('/backend/users/me').pipe( - catchError(() => EMPTY), - tap((user) => this.currentUserSubject.next(user)) - ); - } - - public refreshCurrentUser(): void { - this.getCurrentUser().subscribe(); - this.authService.loadCurrentUser(); - } - + /** + * Updates the user's balance locally for immediate UI feedback + * This should be called before a server-side balance change is made + * The server update will be reflected when AuthService.loadCurrentUser() is called + */ public updateLocalBalance(amount: number): void { - const currentUser = this.currentUserSubject.getValue(); + const currentUser = this.authService.currentUserValue; if (currentUser) { - const updatedUser = { + const updatedUser: User = { ...currentUser, balance: currentUser.balance + amount, }; - this.currentUserSubject.next(updatedUser); + this.authService.userSubject.next(updatedUser); } } + + /** + * Refreshes the current user's data from the server + */ + public refreshCurrentUser(): void { + this.authService.loadCurrentUser(); + } } diff --git a/frontend/src/app/shared/components/navbar/navbar.component.ts b/frontend/src/app/shared/components/navbar/navbar.component.ts index cd252f3..5d44f60 100644 --- a/frontend/src/app/shared/components/navbar/navbar.component.ts +++ b/frontend/src/app/shared/components/navbar/navbar.component.ts @@ -10,7 +10,6 @@ import { RouterModule } from '@angular/router'; import { AuthService } from '@service/auth.service'; import { Subscription } from 'rxjs'; import { AnimatedNumberComponent } from '@blackjack/components/animated-number/animated-number.component'; -import { UserService } from '@service/user.service'; @Component({ selector: 'app-navbar', @@ -22,11 +21,9 @@ import { UserService } from '@service/user.service'; export class NavbarComponent implements OnInit, OnDestroy { isMenuOpen = false; private authService: AuthService = inject(AuthService); - private userService: UserService = inject(UserService); isLoggedIn = this.authService.isLoggedIn(); private authSubscription!: Subscription; - private userSubscription!: Subscription; public balance = signal(0); ngOnInit() { @@ -35,22 +32,10 @@ export class NavbarComponent implements OnInit, OnDestroy { this.balance.set(user?.balance ?? 0); }, }); - - // Also subscribe to UserService for real-time balance updates - this.userSubscription = this.userService.currentUser$.subscribe({ - next: (user) => { - if (user) { - this.balance.set(user.balance); - } - }, - }); } ngOnDestroy() { this.authSubscription.unsubscribe(); - if (this.userSubscription) { - this.userSubscription.unsubscribe(); - } } logout() {