Hide buttons while playing dev cards

ui/src/pages/ActionsToolbar.js

@@ -47,13 +47,14 @@ function PlayButtons() {
     [enqueueSnackbar, closeSnackbar]
   );
 
-  const { gameState, isPlayingMonopoly, isPlayingYearOfPlenty } = state;
+  const { gameState, isPlayingMonopoly, isPlayingYearOfPlenty, isRoadBuilding } = state;
   const key = playerKey(gameState, gameState.current_color);
   const isRoll =
     gameState.current_prompt === "PLAY_TURN" &&
     !gameState.player_state[`${key}_HAS_ROLLED`];
   const isDiscard = gameState.current_prompt === "DISCARD";
   const isMoveRobber = gameState.current_prompt === "MOVE_ROBBER";
+  const isPlayingDevCard = isPlayingMonopoly || isPlayingYearOfPlenty || isRoadBuilding;
   const playableDevCardTypes = new Set(
     gameState.current_playable_actions
       .filter((action) => action[1].startsWith("PLAY"))
@@ -198,51 +199,51 @@ function PlayButtons() {
   return (
     <>
       <OptionsButton
-        disabled={playableDevCardTypes.size === 0 || isPlayingYearOfPlenty}
+        disabled={playableDevCardTypes.size === 0 || isPlayingDevCard}
         menuListId="use-menu-list"
         icon={<SimCardIcon />}
         items={useItems}
       >
         Use
       </OptionsButton>
       <OptionsButton
-        disabled={buildActionTypes.size === 0 || isPlayingYearOfPlenty}
+        disabled={buildActionTypes.size === 0 || isPlayingDevCard}
         menuListId="build-menu-list"
         icon={<BuildIcon />}
         items={buildItems}
       >
         Buy
       </OptionsButton>
       <OptionsButton
-        disabled={tradeItems.length === 0 || isPlayingYearOfPlenty}
+        disabled={tradeItems.length === 0 || isPlayingDevCard}
         menuListId="trade-menu-list"
         icon={<AccountBalanceIcon />}
         items={tradeItems}
       >
         Trade
       </OptionsButton>
       <Button
-        disabled={gameState.is_initial_build_phase}
+        disabled={gameState.is_initial_build_phase || isRoadBuilding}
         variant="contained"
         color="primary"
         startIcon={<NavigateNextIcon />}
         onClick={
-          isRoll
-            ? rollAction
-            : isDiscard
+          isDiscard
             ? proceedAction
             : isMoveRobber
             ? setIsMovingRobber
             : isPlayingYearOfPlenty || isPlayingMonopoly
             ? handleOpenResourceSelector
+            : isRoll
+            ? rollAction
             : endTurnAction
         }
       >
         {
-          isRoll ? "ROLL" : 
           isDiscard ? "DISCARD" : 
           isMoveRobber ? "ROB" : 
           isPlayingYearOfPlenty || isPlayingMonopoly ? "SELECT" : 
+          isRoll ? "ROLL" : 
           "END"
         }
       </Button>