Merge pull request #46 from JollyGrin/feat/add-boost-from-top-of-deck

Feat/add boost from top of deck

components/DeckPool/PoolFns.ts

@@ -193,6 +193,22 @@ export const boostCard = (pool: PoolType, cardIndex: number): PoolType => {
   return pool;
 };
 
+export const boostFromTopDeck = (pool: PoolType): PoolType => {
+  if (!pool?.deck) return pool;
+  if (!pool?.hand) return pool;
+  if (pool.commit.boost) return pool;
+
+  if (pool.deck.length === 0) {
+    alert("No cards left");
+  }
+  const card = pool?.deck?.pop();
+  if (card) {
+    pool.commit.boost = card;
+  }
+
+  return pool;
+};
+
 export const cancelBoost = (pool: PoolType): PoolType => {
   if (!pool?.commit.boost) return pool;
   pool.hand.unshift(pool.commit.boost);

components/Game/game.carousel.tsx

@@ -1,19 +1,10 @@
 //@ts-nocheck
 import { mockDeck } from "@/_mocks_/deck";
-import React, { useEffect, useRef, useState } from "react";
+import React, { useRef, useState } from "react";
 import AliceCarousel from "react-alice-carousel";
 import "react-alice-carousel/lib/alice-carousel.css";
 import { CardFactory } from "../CardFactory/card.factory";
-import {
-  Box,
-  Button,
-  Flex,
-  Popover,
-  Select,
-  Skeleton,
-  Spacer,
-  Text,
-} from "@chakra-ui/react";
+import { Box, Flex, Skeleton, Spacer, Text } from "@chakra-ui/react";
 import {
   DeckImportCardType,
   DeckImportType,

components/Game/game.modal-body.tsx

@@ -5,6 +5,7 @@ import { PoolType } from "../DeckPool/PoolFns";
 import { useState } from "react";
 
 import { GiUpgrade as IconBoost } from "react-icons/gi";
+import { PopoverCardActions } from "./card-actions.popover";
 
 export const DeckModalContent = ({
   cards,
@@ -55,7 +56,8 @@ export const CommitModalContent: React.FC<{
   onClose: () => void;
   onFlip: () => void;
   onDiscard: () => void;
-}> = ({ commits, onClose, onFlip, onDiscard }) => {
+  onBoostTopDeck: () => void;
+}> = ({ commits, onClose, onFlip, onDiscard, onBoostTopDeck }) => {
   return (
     <Flex flexDir="column" justifyContent="space-evenly" gap={3} minH={"40svh"}>
       <Flex
@@ -72,6 +74,17 @@ export const CommitModalContent: React.FC<{
         <Button onClick={onClose}>Cancel</Button>
         <Button onClick={onFlip}>Flip</Button>
         <Button onClick={onDiscard}>Discard</Button>
+
+        <div style={{ fontSize: "2rem" }}>
+          <PopoverCardActions
+            actions={[
+              {
+                text: "Boost from top of deck",
+                fn: onBoostTopDeck,
+              },
+            ]}
+          />
+        </div>
       </Flex>
     </Flex>
   );

components/Game/game.modal-template.tsx

@@ -13,9 +13,9 @@ import {
   PlayerCommit,
 } from "./game.modal-body";
 import { ModalType } from "@/pages/game";
-import { useWebGame } from "@/lib/contexts/WebGameProvider";
 import {
   PoolType,
+  boostFromTopDeck,
   cancelCommit,
   discardCommit,
   drawDeck,
@@ -88,6 +88,11 @@ export const ModalContainer: React.FC<ModalTemplateType> = ({
       setGameState,
     );
 
+  const gBoostTopDeck = flow(
+    () => playerState?.pool && boostFromTopDeck(playerState?.pool),
+    setGameState,
+  );
+
   const gDrawDeck = (discardIndex: number) =>
     flow(
       () => playerState?.pool && drawDeck(playerState?.pool, discardIndex),
@@ -141,6 +146,7 @@ export const ModalContainer: React.FC<ModalTemplateType> = ({
                 commits={commits}
                 onFlip={gFlip}
                 onDiscard={gDiscardCommit}
+                onBoostTopDeck={gBoostTopDeck}
               />
             )}
           </ModalBody>