api/app/Http/Controllers/ProfileController.php

@@ -82,7 +82,7 @@ class ProfileController extends Controller
         ]);
     }
 
-    public function updateAvatar(Request $request)
+    public function uploadAvatar(Request $request)
     {
         $request->validate([
             "avatar" => "required|image|mimes:jpeg,png,jpg,gif|max:2048",

frontend/src/pages/game/SinglePlayerGamePage.vue

@@ -1,47 +1,32 @@
 <template>
   <div class="relative min-h-screen overflow-hidden">
     <div v-if="store.isGameRunning" class="absolute top-4 right-4 z-50">
-      <button
-        @click="handleSurrender"
-        class="bg-red-600 hover:bg-red-700 text-white font-bold py-2 px-4 rounded-lg shadow-lg border-2 border-red-800 transition-all transform hover:scale-105 flex items-center gap-2"
-      >
+      <button @click="handleSurrender"
+        class="bg-red-600 hover:bg-red-700 text-white font-bold py-2 px-4 rounded-lg shadow-lg border-2 border-red-800 transition-all transform hover:scale-105 flex items-center gap-2">
         <span>🏳️</span> Surrender
       </button>
     </div>
 
     <div v-if="store.isGameRunning">
-      <GameBoard
-        :trump-card="store.trumpCard"
-        :cards-remaining="store.deck.length + (store.trumpCard ? 1 : 0)"
-        :player-hand="store.playerHand"
-        :opponent-hand="store.opponentHand"
-        :player-score="store.playerScore"
-        :opponent-score="store.opponentScore"
-        :current-turn="store.currentTurn"
-        :current-trick="store.table"
-        @play-card="handlePlayCard"
-      />
+      <GameBoard :trump-card="store.trumpCard" :cards-remaining="store.deck.length + (store.trumpCard ? 1 : 0)"
+        :player-hand="store.playerHand" :opponent-hand="store.opponentHand" :player-score="store.playerScore"
+        :opponent-score="store.opponentScore" :current-turn="'player'" :is-my-turn="true" :current-trick="store.table"
+        :player-name="'You'" :opponent-name="'CPU'" @play-card="handlePlayCard" />
     </div>
 
     <div v-else class="flex h-screen items-center justify-center bg-green-900 text-white">
       <div class="animate-pulse text-xl">Preparing game...</div>
     </div>
 
-    <GameOver
-      :is-visible="store.isGameOver"
-      :winner="store.winner || 'draw'"
-      :player-score="store.playerScore"
+    <GameOver :is-visible="store.isGameOver" :winner="store.winner || 'draw'" :player-score="store.playerScore"
       :opponent-score="store.opponentScore"
       :stats="{ playerTricks: store.playerTricks, opponentTricks: store.opponentTricks }"
-      :is-logging-out="store.isLoggingOut"
-      @play-again="handlePlayAgain"
-      @close="handleCloseModal"
-    />
+      :is-logging-out="store.isLoggingOut" @play-again="handlePlayAgain" @close="handleCloseModal" />
   </div>
 </template>
 
 <script setup>
-import { onMounted, onUnmounted, onBeforeMount } from 'vue'
+import { onMounted, onUnmounted, onBeforeMount, watch } from 'vue'
 import { useRouter, onBeforeRouteLeave } from 'vue-router'
 import { toast } from 'vue-sonner' // Import Toast for feedback
 import { useBiscaStore } from '@/stores/bisca'
@@ -60,6 +45,11 @@ const store = useBiscaStore()
 const router = useRouter()
 const authStore = useAuthStore()
 
+// DEBUG: Watch the store state
+watch(() => store.playerHand, (newHand) => {
+  console.log('Player hand updated:', newHand)
+}, { deep: true })
+
 onBeforeMount(() => {
   store.isGameOver = false
 })
@@ -67,6 +57,15 @@ onBeforeMount(() => {
 onMounted(() => {
   store.startGame(props.gameType)
   window.addEventListener('beforeunload', handleBrowserUnload)
+
+  // DEBUG: Log initial state
+  setTimeout(() => {
+    console.log('Game state after init:', {
+      playerHand: store.playerHand,
+      currentTurn: store.currentTurn,
+      isGameRunning: store.isGameRunning
+    })
+  }, 500)
 })
 
 onUnmounted(() => {

websockets/classes/BiscaGame.js

@@ -48,8 +48,11 @@ class BiscaGame {
 
     this.dealInitialCards();
 
-    const playerIds = Object.keys(this.players);
-    this.currentTurn = playerIds.find((id) => id != 1) || playerIds[0];
+    // --- FIX: Ensure currentTurn uses the original ID type (Number) ---
+    // Object.keys returns strings ("1"), which breaks strict checks against user.id (1)
+    const playerKeys = Object.keys(this.players);
+    const startKey = playerKeys.find((key) => key != 1) || playerKeys[0];
+    this.currentTurn = this.players[startKey].id; 
 
     this.startTime = Date.now();
     this.status = "playing";
@@ -189,8 +192,7 @@ class BiscaGame {
     this.players[winnerId].tricks += 1;
     this.currentTurn = winnerId;
 
-    // --- CRITICAL FIX: Always draw if cards remain ---
-    // Removed "if (this.type == 3)" check
+    // --- FIX: Always draw if deck has cards (Removed type check) ---
     if (this.deck.length > 0 || this.trumpCard) {
       this.drawCard(winnerId);
       this.drawCard(this.getOpponentId(winnerId));