score adds to player data when purchasing a card:

src/components/Card/Card.tsx

@@ -1,4 +1,3 @@
-
 import { v4 } from 'uuid';
 import { CardProps } from '../../util/propTypes';
 import { ResourceCost } from '../../util/types';
@@ -10,6 +9,8 @@ const { buyCard, tooExpensive } = buyCardActions;
 export default function Card({ data, state, setState }: CardProps) {
     const currentPlayer = useCurrentPlayer(state);
 
+    if (!data) return <div className="card"></div>;
+
     return (
         <div className="card">
             <div className="top-row">

src/components/Player/ActionMethods/buyCardActions.ts

@@ -57,12 +57,10 @@ export const buyCard = (state: AppState, setState: setStateType, card: CardData)
             newResourcePool[typedKey] = adjustedResourcePoolValue;
         }
 
-        console.log(newResourcePool);
-        console.log(newPlayerInventory);
-
         // connect modified player state to updated list of all players
         updatedPlayer.inventory = newPlayerInventory;
         updatedPlayer.cards = [...updatedPlayer.cards, card];
+        updatedPlayer.points = updatedPlayer.points + (card.points || 0);
         newPlayers[idx] = updatedPlayer;
 
         // attempt to queue replacement card from full deck

src/components/Player/Player.tsx

@@ -86,7 +86,7 @@ export default function Player({ player, state, setState }: PlayerProps) {
 
             {/* Dynamic data from state */}
             <section className="turn-and-action-based">
-                <p>Score: {dynamic?.points}</p>
+                <p>Score: {dynamic && dynamic.points}</p>
                 <p>{dynamic?.turnActive ? "It's your turn!" : "..."}</p>
                 <button disabled={dynamic && hasMaxChips(dynamic)} onClick={() => handleClick(0)}>Get Chips</button>
                 <button onClick={() => handleClick(1)}>Buy Card</button>