refactor(lottery): improve code structure and readability

frontend/src/app/feature/game/blackjack/blackjack.component.ts

@@ -51,11 +51,19 @@ 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) => {
+      if (user) {
+        this.balance.set(user.balance);
+      }
+    });
   }
 
   private updateGameState(game: BlackjackGame) {
@@ -84,9 +92,19 @@ export default class BlackjackComponent implements OnInit {
     if (isGameOver) {
       console.log('Game is over, state:', game.state);
       this.userService.refreshCurrentUser();
-      timer(1500).subscribe(() => {
-        this.showGameResult.set(true);
-        console.log('Game result dialog shown after delay');
+      
+      // 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');
+            });
+          }
+        });
       });
     }
   }
@@ -165,12 +183,20 @@ export default class BlackjackComponent implements OnInit {
     this.blackjackService.doubleDown(this.currentGameId()!).subscribe({
       next: (game) => {
         this.updateGameState(game);
-        this.userService.getCurrentUser().subscribe((user) => {
-          if (user && user.balance < 0) {
-            this.debtAmount.set(Math.abs(user.balance));
-            this.showDebtDialog.set(true);
-          }
+        
+        // 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);
+              }
+            }
+          });
         });
+        
         this.isActionInProgress.set(false);
       },
       error: (error) => {
@@ -184,7 +210,13 @@ export default class BlackjackComponent implements OnInit {
   onCloseGameResult(): void {
     console.log('Closing game result dialog');
     this.showGameResult.set(false);
-    this.userService.refreshCurrentUser();
+    
+    // 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 {

frontend/src/app/service/user.service.ts

@@ -13,6 +13,19 @@ export class UserService {
   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<User | null> {
     return this.http.get<User | null>('/backend/users/me').pipe(
       catchError(() => EMPTY),

frontend/src/app/shared/components/navbar/navbar.component.ts

@@ -10,6 +10,7 @@ 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',
@@ -21,9 +22,11 @@ import { AnimatedNumberComponent } from '@blackjack/components/animated-number/a
 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() {
@@ -32,10 +35,22 @@ 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() {