1 files changed, 24 insertions, 27 deletions

diff --git a/frontend/src/components/game/GameScene.jsx b/frontend/src/components/game/GameScene.jsx
index cf3c91f8..0437c567 100644
--- a/frontend/src/components/game/GameScene.jsx
+++ b/frontend/src/components/game/GameScene.jsx
@@ -2,16 +2,14 @@ import { Button, Classes, Intent } from '@blueprintjs/core';
 import { List } from 'immutable';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
-import type { ApiHandCard, ApiPlayerTurnInfo } from '../../api/model';
+import type { ApiPlayerMove, ApiPlayerTurnInfo } from '../../api/model';
 import { Game } from '../../models/games';
 import { Player } from '../../models/players';
 import { actions } from '../../redux/actions/game';
 import { getCurrentTurnInfo } from '../../redux/currentGame';
 import { getCurrentGame } from '../../redux/games';
-
 import { getCurrentPlayer, getPlayers } from '../../redux/players';
 import { Hand } from './Hand';
-
 import './GameScene.css'
 
 type GameSceneProps = {
@@ -19,44 +17,42 @@ type GameSceneProps = {
   currentPlayer: Player,
   players: List<Player>,
   turnInfo: ApiPlayerTurnInfo,
-  sayReady: () => void
-}
-
-type GameSceneState = {
-  selectedCard: ApiHandCard | void
+  sayReady: () => void,
+  prepareMove: (move: ApiPlayerMove) => void,
 }
 
-class GameScenePresenter extends Component<GameSceneProps, GameSceneState> {
-
-  state = {
-    selectedCard: null
-  };
-
-  selectCard(c: ApiHandCard) {
-    this.setState({selectedCard: c})
-  }
+class GameScenePresenter extends Component<GameSceneProps> {
 
   render() {
     return (
       <div className='gameSceneRoot fullscreen'>
-        <h2>Now playing!</h2>
-        <p>{this.props.turnInfo ? this.props.turnInfo.message : 'Click "ready" when you are'}</p>
-
-        {this.props.turnInfo && <Hand cards={this.props.turnInfo.hand}
-                                      selectedCard={this.state.selectedCard}
-                                      onClick={(c) => this.selectCard(c)}/>}
-
-        {!this.props.turnInfo && <Button text="READY" className={Classes.LARGE} intent={Intent.PRIMARY} icon='play' onClick={this.props.sayReady} />}
+        <h1>{this.props.game.name}</h1>
+        {!this.props.turnInfo && <GamePreStart onReadyClicked={this.props.sayReady}/>}
+        {this.props.turnInfo && this.turnInfoScene()}
 
-        <h3>Turn Info</h3>
+        <h4 style={{marginTop: '2rem'}}>Debug</h4>
         <div>
           <pre>{JSON.stringify(this.props.turnInfo, null, 2) }</pre>
         </div>
       </div>
     );
   }
+
+  turnInfoScene() {
+    return <div>
+      <p>{this.props.turnInfo.message}</p>
+      <Hand cards={this.props.turnInfo.hand}
+            wonderUpgradable={this.props.turnInfo.wonderBuildability.buildable}
+            prepareMove={this.props.prepareMove}/>
+    </div>
+  }
 }
 
+const GamePreStart = ({onReadyClicked}) => <div>
+  <p>Click "ready" when you are</p>
+  <Button text="READY" className={Classes.LARGE} intent={Intent.PRIMARY} icon='play' onClick={onReadyClicked} />
+</div>;
+
 const mapStateToProps: (state) => GameSceneProps = state => {
   const game = getCurrentGame(state.get('games'));
   console.info(game);
@@ -65,12 +61,13 @@ const mapStateToProps: (state) => GameSceneProps = state => {
     game: game,
     currentPlayer: getCurrentPlayer(state),
     players: game ? getPlayers(state.get('players'), game.players) : new List(),
-    turnInfo: getCurrentTurnInfo(state.get('currentGame'))
+    turnInfo: getCurrentTurnInfo(state.get('currentGame')),
   };
 };
 
 const mapDispatchToProps = {
   sayReady: actions.sayReady,
+  prepareMove: actions.prepareMove,
 };
 
 export const GameScene = connect(mapStateToProps, mapDispatchToProps)(GameScenePresenter);