reserve card action defined

src/components/Card/Card.tsx

@@ -28,7 +28,7 @@ export default function Card({ data, state, setState }: CardProps) {
                 }
                 { state.actions.reserveCard.active &&
                     <button
-                        onClick={() => reserveCard(state)}>
+                        onClick={() => reserveCard(state, setState, data)}>
                         Reserve This Card
                     </button>
                 }

src/components/Player/ActionMethods/buyCardActions.ts

@@ -1,3 +1,4 @@
+import cardTierToKey from "../../../util/cardTierToKey";
 import { turnOrderUtil } from "../../../util/turnOrderUtil";
 import { AppState, CardData, FullDeck, PlayerData, ResourceCost, setStateType } from "../../../util/types";
 import { useCurrentPlayer } from "../../../util/useCurrentPlayer";
@@ -71,10 +72,7 @@ export const buyCard = (card: CardData, state: AppState, setState: setStateType)
 
         let updatedPlayer: PlayerData = {
             ...currentPlayer,
-            cards: [
+            cards: [...currentPlayer.cards, card],
-                ...currentPlayer.cards,
-                card
-            ],
             inventory: newPlayerInventory
         }
 
@@ -86,26 +84,11 @@ export const buyCard = (card: CardData, state: AppState, setState: setStateType)
         updatedPlayer.points = newScore;
         const idx = newPlayers.findIndex((one: PlayerData) => one.id === currentPlayer?.id);
         newPlayers[idx] = updatedPlayer;
-        let updatedRows = { ...prev.gameboard.cardRows }
+        let updatedRows = prev.gameboard.cardRows;
 
         if (card.tier) {
-            let tierKey;
+            const tierKey = cardTierToKey(card.tier);
-            switch (card.tier) {
+            updatedRows[tierKey] = prev.gameboard.cardRows[tierKey].filter((found: CardData) => found.resourceCost !== card.resourceCost);
-                case 1:
-                    tierKey = "tierOne"
-                    break;
-                case 2:
-                    tierKey = "tierTwo"
-                    break;
-                case 3:
-                    tierKey = "tierThree"
-                    break;
-                default:
-                    break;
-            }
-
-            updatedRows[tierKey as keyof FullDeck] = 
-            prev.gameboard.cardRows[tierKey as keyof FullDeck].filter((found: CardData) => found.resourceCost !== card.resourceCost);
         }
 
         return {

src/components/Player/ActionMethods/getChipsActions.ts

@@ -1,8 +1,19 @@
-import { AppState, setStateType } from '../../../util/types';
+import { AppState, PlayerData, setStateType } from '../../../util/types';
 import { useCurrentPlayer } from '../../../util/useCurrentPlayer';
+// @ts-ignore
 import { turnOrderUtil } from '../../../util/turnOrderUtil';
 import { initialActions } from "../../../util/stateSetters";
 
+export const hasMaxChips = (player: PlayerData | null): boolean => {
+    if (!player) return true;
+    let sum = 0;
+    for (let count of Object.values(player.inventory)) {
+        sum += count;
+    }
+    if (sum >= 10) return true;
+    return false;
+}
+
 export const validateChips = (state: AppState): boolean => {
     if (!state.actions.getChips.active || !state.actions.getChips.selection) return false;
     const selection = state.actions.getChips.selection;

src/components/Player/ActionMethods/reserveCardActions.ts

@@ -1,7 +1,62 @@
-import { AppState } from "../../../util/types";
+import cardTierToKey from "../../../util/cardTierToKey";
+import { turnOrderUtil } from "../../../util/turnOrderUtil";
+import { AppState, CardData, FullDeck, PlayerData, setStateType } from "../../../util/types";
 import { useCurrentPlayer } from "../../../util/useCurrentPlayer";
 
-export const reserveCard = (state: AppState) => {
+export const goldAllowable = (player: PlayerData | null): boolean => {
+    if (!player) return false;
+    let chipCount = 0;
+    for (let quantity of Object.values(player.inventory)) {
+        chipCount += quantity;
+    }
+
+    if (chipCount >= 10) return false;
+    return true;
+}
+
+export const hasMaxReserved = (player: PlayerData | null): boolean => {
+    if (!player) return true;
+    if (player.reservedCards && player.reservedCards.length >= 3) return true;
+    return false;
+}
+
+export const reserveCard = (state: AppState, setState: setStateType, card: CardData) => {
     const currentPlayer = useCurrentPlayer(state);
-    console.log(currentPlayer);
+    if (!currentPlayer) return;
+    if (hasMaxReserved(currentPlayer)) return;
+    
+    setState((prev: AppState) => {
+        const { newPlayers, roundIncrement } = turnOrderUtil(prev, currentPlayer);
+
+        const updatedPlayer = {
+            ...currentPlayer,
+            reservedCards: currentPlayer.reservedCards ? [
+                ...currentPlayer.reservedCards, card
+            ] : [card],
+            inventory: goldAllowable(currentPlayer) ? {
+                ...currentPlayer.inventory,
+                gold: currentPlayer.inventory.gold && currentPlayer.inventory.gold + 1
+            } : currentPlayer.inventory
+        }
+
+        const idx = newPlayers.indexOf(currentPlayer);
+        newPlayers[idx] = updatedPlayer;
+        
+        const newCardRows = prev.gameboard.cardRows;
+        const targetTier: keyof FullDeck = cardTierToKey(card.tier);
+
+        let updatedRow = newCardRows[targetTier];
+        updatedRow = updatedRow.filter((each: CardData) => each.resourceCost !== card.resourceCost);
+        newCardRows[targetTier] = updatedRow;
+        
+        return {
+            ...prev,
+            round: (roundIncrement ? prev.round + 1 : prev.round),
+            players: newPlayers,
+            gameboard: {
+                ...prev.gameboard,
+                cardRows: newCardRows
+            }
+        }
+    })
 }

src/components/Player/Player.tsx

@@ -2,6 +2,8 @@ import { PlayerProps } from "../../util/propTypes";
 import { CardData, PlayerData } from "../../util/types"
 import { useEffect, useState } from "react";
 import { v4 } from "uuid";
+import { hasMaxReserved } from "./ActionMethods/reserveCardActions";
+import { hasMaxChips } from "./ActionMethods/getChipsActions";
 
 export default function Player({ player, state, setState, setActionState }: PlayerProps) {
     const [dynamic, setDynamic] = useState<PlayerData>();
@@ -12,6 +14,11 @@ export default function Player({ player, state, setState, setActionState }: Play
         setDynamic(state.players.find((element: PlayerData) => element.id === player.id))
     }, [state]);
 
+    // sets action label back to default on setstate (round change)
+    useEffect(() => {
+        setActionState(-1, dynamic);
+    }, [setState])
+
     useEffect(() => {
         setActionState(actionSelection, dynamic);
 
@@ -38,9 +45,9 @@ export default function Player({ player, state, setState, setActionState }: Play
             <section className="turn-and-action-based">
                 <p>Score: {dynamic?.points}</p>
                 <p>{dynamic?.turnActive ? prompt : '...'}</p>
-                <button onClick={() => setActionSelection(0)}>Get Chips</button>
+                <button disabled={dynamic && hasMaxChips(dynamic)} onClick={() => setActionSelection(0)}>Get Chips</button>
                 <button onClick={() => setActionSelection(1)}>Buy Card</button>
-                <button onClick={() => setActionSelection(2)}>Reserve Card</button>
+                <button disabled={dynamic && hasMaxReserved(dynamic)} onClick={() => setActionSelection(2)}>Reserve Card</button>
             </section>
 
             <section className="resources">

src/util/cardTierToKey.ts

@@ -0,0 +1,14 @@
+import { FullDeck } from "./types"
+
+export default function cardTierToKey(tier: number): keyof FullDeck {
+    switch (tier) {
+        case 1:
+            return "tierOne"
+        case 2:
+            return "tierTwo"
+        case 3:
+            return "tierThree"
+        default:
+            throw new Error("Invalid input to cardTierToKey");
+    }
+}

src/util/types.ts

@@ -77,7 +77,7 @@ export interface FullDeck {
 
 export interface CardData {
     gemValue: GemValue | string
-    tier?: number
+    tier: number
     points?: number
     resourceCost: ResourceCost
 }