style: fix formatting and add missing commas in code

frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.html

@@ -34,7 +34,7 @@
               [disabled]="!hasEnoughBalance()"
               [ngClass]="{
                 'button-primary': hasEnoughBalance(),
-                'bg-gray-500 cursor-not-allowed': !hasEnoughBalance()
+                'bg-gray-500 cursor-not-allowed': !hasEnoughBalance(),
               }"
               class="w-full py-3 text-lg font-semibold rounded"
             >
@@ -91,14 +91,14 @@
               class="flex justify-center gap-4 mt-8 animation-fade"
               [class.visible]="animationCompleted"
             >
-              <button 
-                (click)="openAgain()" 
+              <button
+                (click)="openAgain()"
                 [disabled]="!animationCompleted || !hasEnoughBalance()"
                 [ngClass]="{
                   'button-primary': hasEnoughBalance(),
-                  'bg-gray-500 cursor-not-allowed': !hasEnoughBalance()
+                  'bg-gray-500 cursor-not-allowed': !hasEnoughBalance(),
                 }"
-                class="px-6 py-2 font-semibold rounded" 
+                class="px-6 py-2 font-semibold rounded"
                 [attr.aria-hidden]="!animationCompleted"
               >
                 <span *ngIf="hasEnoughBalance()">Nochmal Öffnen</span>

frontend/src/app/feature/lootboxes/lootbox-opening/lootbox-opening.component.ts

@@ -33,7 +33,7 @@ export default class LootboxOpeningComponent {
     private cdr: ChangeDetectorRef
   ) {
     this.loadLootbox();
-    this.userService.currentUser$.subscribe(user => {
+    this.userService.currentUser$.subscribe((user) => {
       this.currentUser = user;
       this.cdr.detectChanges();
     });
@@ -64,7 +64,7 @@ export default class LootboxOpeningComponent {
 
   openLootbox(): void {
     if (!this.lootbox || this.isOpening) return;
-    
+
     // Check if user has enough balance
     if (!this.hasEnoughBalance()) {
       this.error = 'Nicht genug Guthaben, um diese Lootbox zu öffnen.';
@@ -78,7 +78,7 @@ export default class LootboxOpeningComponent {
     }
 
     this.resetState(true);
-    
+
     if (this.lootbox.price) {
       this.userService.updateLocalBalance(-this.lootbox.price);
     }
@@ -96,7 +96,7 @@ export default class LootboxOpeningComponent {
     this.generateCasePrizes(reward);
     this.isOpening = false;
     this.isOpen = true;
-    
+
     this.cdr.detectChanges();
   }
 
@@ -105,7 +105,7 @@ export default class LootboxOpeningComponent {
 
     const rewards = this.lootbox.rewards;
     const fallback = rewards[Math.floor(Math.random() * rewards.length)];
-    
+
     this.wonReward = fallback;
     this.generateCasePrizes(fallback);
     this.isOpening = false;
@@ -142,11 +142,11 @@ export default class LootboxOpeningComponent {
 
     setTimeout(() => {
       this.animationCompleted = true;
-      
+
       if (this.wonReward) {
         this.userService.updateLocalBalance(this.wonReward.value);
       }
-      
+
       this.userService.refreshCurrentUser();
       this.cdr.detectChanges();
     }, 10000);

frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.html

@@ -47,7 +47,7 @@
             [disabled]="!hasEnoughBalance(lootbox.price)"
             [ngClass]="{
               'button-primary': hasEnoughBalance(lootbox.price),
-              'bg-gray-500 cursor-not-allowed': !hasEnoughBalance(lootbox.price)
+              'bg-gray-500 cursor-not-allowed': !hasEnoughBalance(lootbox.price),
             }"
             class="w-full py-2 rounded font-semibold"
           >

frontend/src/app/feature/lootboxes/lootbox-selection/lootbox-selection.component.ts

@@ -95,7 +95,7 @@ export default class LootboxSelectionComponent implements OnInit {
 
   ngOnInit(): void {
     this.loadLootboxes();
-    this.userService.currentUser$.subscribe(user => {
+    this.userService.currentUser$.subscribe((user) => {
       this.currentUser = user;
       this.cdr.detectChanges();
     });
@@ -128,12 +128,12 @@ export default class LootboxSelectionComponent implements OnInit {
   }
 
   openLootbox(lootboxId: number): void {
-    const lootbox = this.lootboxes.find(box => box.id === lootboxId);
-    
+    const lootbox = this.lootboxes.find((box) => box.id === lootboxId);
+
     if (!lootbox) {
       return;
     }
-    
+
     if (!this.currentUser || this.currentUser.balance < lootbox.price) {
       this.error = 'Nicht genug Guthaben, um diese Lootbox zu öffnen.';
       // Scroll to top to see the error message
@@ -145,7 +145,7 @@ export default class LootboxSelectionComponent implements OnInit {
       }, 5000);
       return;
     }
-    
+
     this.router.navigate(['/game/lootboxes/open', lootboxId]);
   }
 

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

@@ -36,9 +36,9 @@ export class UserService {
   public updateLocalBalance(amount: number): void {
     const currentUser = this.currentUserSubject.getValue();
     if (currentUser) {
-      const updatedUser = { 
+      const updatedUser = {
         ...currentUser,
-        balance: currentUser.balance + amount 
+        balance: currentUser.balance + amount,
       };
       this.currentUserSubject.next(updatedUser);
     }

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

@@ -33,7 +33,7 @@ export class NavbarComponent implements OnInit, OnDestroy {
       this.balance.set(user?.balance ?? 0);
       console.log('Updated navbar balance:', user?.balance);
     });
-    
+
     this.userService.refreshCurrentUser();
   }