availabe mtx btn fix

client/src/components/controls.jsx

@@ -38,7 +38,7 @@ function Controls(args) {
 
     if (game) return <GameCtrl />;
     if (instance) return <InstanceCtrl />;
-    if (nav === 'play' || !nav) return <PlayCtrl />
+    if (nav === 'play' || nav === 'shop' || !nav) return <PlayCtrl />
     if (nav === 'team' || nav === 'account') return <TeamCtrl />
 
     return false;

client/src/components/instance.ctrl.btns.jsx

@@ -36,10 +36,12 @@ function InstanceCtrlBtns(args) {
         sendReady,
     } = args;
 
+    const finished = instance && instance.phase === 'Finished';
+
     return (
         <div class="instance-ctrl-btns">
             <button>Chat</button>
-            <button class="ready" onClick={() => sendReady()}>Ready</button>
+            <button disabled={finished} class="ready" onClick={() => sendReady()}>Ready</button>
         </div>
     );
 }

client/src/components/play.jsx

@@ -71,9 +71,9 @@ function Play(args) {
     };
 
     const availableMtx = (item, i) => (
-        <figure key={i} onClick={() => mtxBuy(item)} >
+        <figure key={i}>
-            <figcaption>{item.variant}</figcaption>
+            <figcaption>Enable {item.variant}</figcaption>
-            <button disabled={account.balance < item.credits}>¤{item.credits}</button>
+            <button onClick={() => mtxBuy(item)} disabled={account.balance < item.credits}>¤{item.credits}</button>
         </figure>
     );
 

client/src/components/player.box.jsx

@@ -29,6 +29,7 @@ function Scoreboard(args) {
     if (!isPlayer) {
         return (
             <div class={`player-box top ${player.ready ? 'ready' : ''}`}>
+                <div></div>
                 <div class="score">{scoreText()}</div>
                 <div class="name">{player.name}</div>
                 <div class="img avatar"