SyntaxSquad/DADProject#14 Bot works and play works, still has some bugs

frontend/src/components/game/GameBoard.vue

@@ -2,7 +2,6 @@
   <div
     class="min-h-screen bg-linear-to-br from-green-700 via-green-800 to-green-900 grid grid-rows-[auto_auto_1fr_auto] grid-cols-[1fr_3fr_1fr] gap-6 p-8"
   >
-    <!-- Score Display (Top Left) -->
     <div class="col-start-1 col-end-4 row-start-1 flex justify-start items-start">
       <ScoreDisplay
         :player-score="playerScore"
@@ -12,17 +11,14 @@
       />
     </div>
 
-    <!-- Opponent Hand -->
     <div class="col-start-2 col-end-3 row-start-2 flex justify-center">
       <PlayerHand
         :cards="opponentHand"
         :face-down="true"
         :max-cards="maxCards"
-        :playable-cards="[]"
       />
     </div>
 
-    <!-- Play Area -->
     <div class="col-start-2 col-end-3 row-start-3 flex items-center justify-center">
       <PlayArea
         :player-card="currentTrick.playerCard"
@@ -31,18 +27,15 @@
       />
     </div>
 
-    <!-- Deck Area -->
     <div class="col-start-3 col-end-4 row-start-3 flex items-center justify-center">
       <DeckArea :trump-card="trumpCard" :cards-remaining="cardsRemaining" :is-empty="deckIsEmpty" />
     </div>
 
-    <!-- Player Hand -->
     <div class="col-start-2 col-end-3 row-start-4 flex justify-center">
       <PlayerHand
         :cards="playerHand"
         :face-down="false"
         :max-cards="maxCards"
-        :playable-cards="playableCardIndices"
         @card-clicked="handleCardClick"
       />
     </div>
@@ -55,52 +48,20 @@ import PlayArea from './PlayArea.vue'
 import DeckArea from './DeckArea.vue'
 import ScoreDisplay from './ScoreDisplay.vue'
 
-// Props for testing - in real implementation, these come from Pinia store
 const props = defineProps({
-  playerHand: {
-    type: Array,
-    default: () => [],
-  },
-  opponentHand: {
-    type: Array,
-    default: () => [],
-  },
+  playerHand: { type: Array, default: () => [] },
+  opponentHand: { type: Array, default: () => [] },
   currentTrick: {
     type: Object,
-    default: () => ({
-      playerCard: null,
-      opponentCard: null,
-      winner: null,
-    }),
-  },
-  trumpCard: {
-    type: Object,
-    required: true,
-  },
-  cardsRemaining: {
-    type: Number,
-    default: 0,
-  },
-  deckIsEmpty: {
-    type: Boolean,
-    default: false,
-  },
-  maxCards: {
-    type: Number,
-    default: 3,
-  },
-  playableCardIndices: {
-    type: Array,
-    default: () => [],
-  },
-  playerScore: {
-    type: Number,
-    default: 0,
-  },
-  opponentScore: {
-    type: Number,
-    default: 0,
+    default: () => ({ playerCard: null, opponentCard: null, winner: null }),
   },
+  trumpCard: { type: Object, required: true },
+  cardsRemaining: { type: Number, default: 0 },
+  deckIsEmpty: { type: Boolean, default: false },
+  maxCards: { type: Number, default: 3 },
+  // REMOVIDO: playableCardIndices (já não precisamos dele)
+  playerScore: { type: Number, default: 0 },
+  opponentScore: { type: Number, default: 0 },
   currentTurn: {
     type: String,
     default: 'player',
@@ -108,13 +69,9 @@ const props = defineProps({
   },
 })
 
-const emit = defineEmits(['card-clicked'])
+const emit = defineEmits(['play-card'])
 
 const handleCardClick = (payload) => {
-  emit('card-clicked', payload)
+  emit('play-card', payload.card)
 }
-
-const handlePlayCard = (card) => {
-  store.playerPlayCard(card)
-}
-</script>
+</script>