allows player to take gold chip when reserving card

src/components/Player/ActionMethods/buyCardActions.ts

@@ -76,6 +76,8 @@ export const buyCard = (state: AppState, setState: setStateType, card: CardData)
                     availableGold--;
                     cardCostPointer--;
                     goldToReturn++;
+                } else {
+                    break;
                 }
             }
 

src/components/Player/ActionMethods/reserveCardActions.ts

@@ -29,13 +29,25 @@ export const reserveCard = (state: AppState, setState: setStateType, card: CardD
     setState((prev: AppState) => {
         const { newPlayers, roundIncrement } = turnOrderUtil(prev, currentPlayer);
 
-        const updatedPlayer = {
-            ...currentPlayer,
-            reservedCards: currentPlayer.reservedCards ? [...currentPlayer.reservedCards, card] : [card],
-            inventory: goldAllowable(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 updatedPlayer = currentPlayer;
+        updatedPlayer.reservedCards = currentPlayer.reservedCards ? [
+            ...currentPlayer.reservedCards, card
+        ] : [card];
+
+        if (prev.actions.reserveCard.includeGold) {
+            updatedPlayer.inventory = {
                 ...currentPlayer.inventory,
-                gold: currentPlayer.inventory.gold && currentPlayer.inventory.gold + 1
-            } : currentPlayer.inventory
+                gold: currentPlayer.inventory.gold ? currentPlayer.inventory.gold + 1 : 1
+            }
         }
 
         const idx = newPlayers.indexOf(currentPlayer);

src/components/Resources/SelectionView.tsx

@@ -5,12 +5,12 @@ import { GetChipsHTML, ReserveCardHTML } from "./ViewHTML";
 
 export default function SelectionView({ state, setState }: StateProps) {
     const [currentPlayer, setCurrentPlayer] = useState(useCurrentPlayer(state));
-
     const actionTypes = [
         state.actions.getChips,
         state.actions.buyCard,
         state.actions.reserveCard
     ]
+
     const [view, setView] = useState(<></>);
 
     useEffect(() => {

src/components/Resources/ViewHTML.tsx

@@ -1,10 +1,10 @@
-import { v4 } from "uuid";
 import { useEffect, useState } from "react";
-import { setStateGetChips } from "../../hooks/stateSetters";
+import { v4 } from "uuid";
+import { setStateGetChips, setStateReserveCard, setStateReservePlusGold } from "../../hooks/stateSetters";
+import { useCurrentPlayer } from "../../hooks/useCurrentPlayer";
 import { StateProps } from "../../util/propTypes";
 import { ResourceCost } from "../../util/types";
 import { getChipsActions } from "../Player/ActionMethods";
-import { useCurrentPlayer } from "../../hooks/useCurrentPlayer";
 import { hasMaxChips } from "../Player/ActionMethods/getChipsActions";
 const { getChips } = getChipsActions;
 
@@ -42,12 +42,21 @@ export const GetChipsHTML = ({ state, setState }: StateProps) => {
 }
 
 export const ReserveCardHTML = ({ state, setState }: StateProps) => {
-    const [takeGold, setTakeGold] = useState("");
+    const [takeGold, setTakeGold] = useState(false);
     const currentPlayer = useCurrentPlayer(state);
 
     useEffect(() => {
-
-    })
+        switch (takeGold) {
+            case true:
+                setState((prev) => setStateReservePlusGold(prev));
+                break;
+            case false:
+                setState((prev) => setStateReserveCard(prev));
+                break;
+            default:
+                break;
+        }
+    }, [takeGold]);
 
     return (
         <div className="selection-view">
@@ -60,8 +69,8 @@ export const ReserveCardHTML = ({ state, setState }: StateProps) => {
                     <input
                         id="take-gold-yes"
                         value="Yes"
-                        checked={takeGold === "Yes"}
-                        onChange={() => setTakeGold("Yes")}
+                        checked={takeGold}
+                        onChange={() => setTakeGold(true)}
                         type="radio"
                     >
                     </input>
@@ -70,8 +79,8 @@ export const ReserveCardHTML = ({ state, setState }: StateProps) => {
                     <input
                         id="take-gold-no"
                         value="No"
-                        checked={takeGold === "No"}
-                        onChange={() => setTakeGold("No")}
+                        checked={!takeGold}
+                        onChange={() => setTakeGold(false)}
                         type="radio">
                     </input>
                 </div>

src/hooks/stateSetters.ts

@@ -78,6 +78,20 @@ export const setStateReserveCard = (prev: AppState) => {
     }
 }
 
+export const setStateReservePlusGold = (prev: AppState) => {
+    return {
+        ...prev,
+        actions: {
+            ...initialState.actions,
+            reserveCard: {
+                active: true,
+                includeGold: true,
+                valid: false
+            }
+        }
+    }
+}
+
 export const setStateGetNoble = (prev: AppState, noble: NobleData, prevPlayer: PlayerData) => {
     const updatedPlayer = {
         ...prevPlayer,