recognizes gold chip requirement

src/components/Player/ActionMethods/buyCardActions.ts

@@ -52,6 +52,17 @@ export const buyCard = (state: AppState, setState: setStateType, card: CardData)
         const newResourcePool = prev.gameboard.tradingResources;
         let availableGold = updatedPlayer.inventory.gold || 0;
 
+        // evaluate whether gold must be used, assign to boolean
+        let buyingPowerTotal = 0;
+        let cardCostTotal = 0;
+        for (let key of Object.keys(playerBuyingPower)) {
+            if (key === 'gold') continue;
+            buyingPowerTotal += playerBuyingPower[key as keyof ResourceCost];
+            cardCostTotal += cardCost[key as keyof ResourceCost] || 0;
+        }
+
+        let useGold = buyingPowerTotal < cardCostTotal;
+
         for (let key of Object.keys(cardCost)) {
             const typedKey = key as keyof ResourceCost;
             let adjustedCost = cardCost[typedKey];
@@ -63,6 +74,16 @@ export const buyCard = (state: AppState, setState: setStateType, card: CardData)
             const buyingPowerDifference = playerBuyingPower[typedKey] - adjustedInventoryValue;
             adjustedCost -= buyingPowerDifference;
 
+            // logic to handle the use of a gold chip
+            let newGoldCount = newResourcePool['gold'] || 0;
+            while (useGold) {
+                availableGold--;
+                adjustedCost--;
+                buyingPowerTotal++;
+                newGoldCount++;
+                useGold = buyingPowerTotal < cardCostTotal;
+            }
+
             while (adjustedCost > 0) {
                 adjustedInventoryValue--;
                 adjustedCost--;
@@ -72,8 +93,11 @@ export const buyCard = (state: AppState, setState: setStateType, card: CardData)
             // assign modified values to player inventory and resource pool
             newPlayerInventory[typedKey] = adjustedInventoryValue;
             newResourcePool[typedKey] = adjustedResourcePoolValue;
+            newResourcePool['gold'] = newGoldCount;
         }
 
+        newPlayerInventory['gold'] = availableGold;
+
         // connect modified player state to updated list of all players
         const typeofCard = card.gemValue as keyof PlayerCards;
         updatedPlayer.cards[typeofCard] = [...updatedPlayer.cards[typeofCard], card]

src/components/Player/ActionMethods/tests/buyCard.test.tsx

@@ -7,9 +7,6 @@ import { AppState, PlayerData, setStateType } from "../../../../util/types"
 import { buyCard, tooExpensive } from "../buyCardActions"
 import { configure } from "enzyme";
 import Player from "../../Player"
-import Gameboard from "../../../Gameboard/Gameboard";
-import initializeBoard from "../../../../util/initializeBoard";
-import React from "react";
 
 configure({ adapter: new Adapter() });
 
@@ -19,7 +16,13 @@ const testPlayer: PlayerData = {
     starter: true,
     turnActive: true,
     points: 0,
-    cards: [],
+    cards: {
+        ruby: [],
+        sapphire: [],
+        emerald: [],
+        diamond: [],
+        onyx:[]
+    },
     nobles: [],
     inventory: {
         ruby: 1,

src/components/Player/Player.tsx

@@ -1,7 +1,7 @@
 import { setStateAwaitAction, setStateBuyCard, setStateGetChips, setStateReserveCard } from "../../hooks/stateSetters";
 import { useEffect, useState } from "react";
 import { PlayerProps } from "../../util/propTypes";
-import { CardData, GemValue, PlayerData } from "../../util/types"
+import { CardData, PlayerData } from "../../util/types"
 import { hasMaxReserved } from "./ActionMethods/reserveCardActions";
 import { hasMaxChips } from "./ActionMethods/getChipsActions";
 import { v4 } from "uuid";
@@ -20,32 +20,11 @@ export default function Player({ player, state, setState }: PlayerProps) {
             <div className="card-view">
                 <p>Cards:</p>
                 {
-                    Object.entries(dynamic.cards).map(([key, value]) => value.length > 0 && <p key={v4()}>{key}: {value.length}</p>)
+                    Object.entries(dynamic.cards).map(([key, value]) => value.length > 0 && <p className={`mini-card ${key}`} key={v4()}>{key}: {value.length}</p>)
                 }
             </div>
         )
 
-        // dynamic && setCardView(
-        //     <div className="card-view">
-        //     <p>Cards:</p>
-        //     {
-        //         dynamic.cards.map((data: CardData) => {
-        //             return (
-        //                 <div key={v4()} className="mini-card" style={{backgroundColor: 'white'}}>
-        //                     <p>{data.gemValue} card</p>
-        //                     <p>{data.points + " points" || null}</p>
-        //                     {
-        //                         Object.entries(data.resourceCost).map(([key, value]) => {
-        //                             return value > 0 && <p key={v4()}>{key}: {value}</p>
-        //                         })
-        //                     }
-        //                 </div>
-        //             )
-        //         })
-        //     }
-        //     </div>
-        // )
-
         dynamic && setReservedView(
             <>
             <p>Reserved cards:</p>

src/util/types.ts

@@ -84,7 +84,7 @@ export interface FullDeck {
 }
 
 export interface CardData {
-    gemValue: GemValue | string
+    gemValue: string
     tier: number
     points?: number
     resourceCost: ResourceCost
@@ -104,12 +104,3 @@ export interface NobleData {
     points: number,
     resourceCost: ResourceCost
 }
-
-export enum GemValue {
-    ruby,
-    sapphire,
-    emerald,
-    diamond,
-    onyx,
-    gold,
-}