Merge pull request 'perf: increase slots performance by 1500% !!!!' (!174) from perf-slots into main

Reviewed-on: #174
Reviewed-by: Jan K9f <jan@kjan.email>

frontend/src/app/feature/game/slots/slots.component.html

@@ -9,15 +9,27 @@
       <div class="card">
         <!-- Slot Machine Top -->
         <div class="p-6">
-          <div class="flex items-center justify-between">
+          <div class="flex items-center justify-between gap-4">
+            <!-- Wrapper for title and win amount -->
+            <div class="flex items-baseline space-x-2">
               <h2 class="text-xl font-bold text-white">Slot Machine</h2>
+              <span
+                *ngIf="slotResult().status === 'win' && slotResult().amount > 0"
+                class="text-emerald text-lg font-semibold"
+                aria-live="polite"
+              >
+                +{{ slotResult().amount | currency: 'EUR' }}
+              </span>
+            </div>
+
+            <!-- Status Badge -->
             <div
               [ngClass]="{
                 'bg-emerald': slotResult().status === 'win',
                 'bg-accent-red': slotResult().status === 'lose',
                 'bg-deep-blue-light': slotResult().status === 'start',
               }"
-              class="px-3 py-1 rounded-full text-sm font-semibold"
+              class="px-3 py-1 rounded-full text-sm font-semibold whitespace-nowrap"
             >
               <span class="text-white">
                 {{
@@ -50,12 +62,7 @@
             </div>
           </div>
 
-          <!-- Game Result -->
-          <div class="text-center mb-6" *ngIf="slotResult().status === 'win'">
-            <div class="text-emerald text-xl font-bold">
-              +{{ slotResult().amount | currency: 'EUR' }}
-            </div>
-          </div>
+          <!-- Game Result (This section was removed as it's now at the top) -->
 
           <!-- Controls -->
           <div class="flex flex-col sm:flex-row gap-4 items-center justify-center">

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

@@ -119,7 +119,7 @@ export default class SlotsComponent implements OnInit, OnDestroy {
           this.userService.refreshCurrentUser();
 
           this.isSpinning = false;
-        }, 1500);
+        }, 100);
       },
       error: (err) => {
         console.error('Error spinning slot machine:', err);