Remove default exports everywhere

23 files changed, 107 insertions, 56 deletions

diff --git a/frontend/src/components/errors/Error404.js b/frontend/src/components/errors/Error404.js
index 9a5e005e..07046632 100644
--- a/frontend/src/components/errors/Error404.js
+++ b/frontend/src/components/errors/Error404.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
 
-const Error404 = () => (
+export const Error404 = () => (
   <div>
     <h1>No Match</h1>
     <Link to="/">
@@ -9,4 +9,3 @@ const Error404 = () => (
     </Link>
   </div>
 );
-export default Error404;
diff --git a/frontend/src/components/errors/errorToastContainer.js b/frontend/src/components/errors/errorToastContainer.js
index 65711073..d8da6af6 100644
--- a/frontend/src/components/errors/errorToastContainer.js
+++ b/frontend/src/components/errors/errorToastContainer.js
@@ -2,8 +2,6 @@ import React from 'react';
 import ReduxToastr from 'react-redux-toastr';
 import './react-redux-toastr.min.css';
 
-const ErrorToastContainer = props => (
+export const ErrorToastContainer = props => (
   <ReduxToastr timeOut={4000} preventDuplicates position="bottom-left" progressBar />
 );
-
-export default ErrorToastContainer;
diff --git a/frontend/src/components/gameList.js b/frontend/src/components/gameList.js
index 0a478b96..0b4091a7 100644
--- a/frontend/src/components/gameList.js
+++ b/frontend/src/components/gameList.js
@@ -5,7 +5,7 @@ import { Button, Space, Text } from 'rebass';
 import { Flex } from 'reflexbox';
 import type { Game } from '../models/games';
 
-const GameList = ({ games, joinGame }: { games: List<Game>, joinGame: (gameId: string) => void }) => (
+export const GameList = ({ games, joinGame }: { games: List<Game>, joinGame: (gameId: string) => void }) => (
   <div>
     {games.map((game: Game, index: number) => {
       return (
@@ -18,5 +18,3 @@ const GameList = ({ games, joinGame }: { games: List<Game>, joinGame: (gameId: s
     })}
   </div>
 );
-
-export default GameList;
diff --git a/frontend/src/components/modals/username.js b/frontend/src/components/modals/username.js
index 19b7eeb0..f6127667 100644
--- a/frontend/src/components/modals/username.js
+++ b/frontend/src/components/modals/username.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import { Button, Close, Input, Overlay, Panel, PanelFooter, PanelHeader, Space } from 'rebass';
 
-const Modal = ({ modalOpen, toggleModal }) => (
+export const Modal = ({ modalOpen, toggleModal }) => (
   <Overlay open={modalOpen} onDismiss={toggleModal('usernameModal')}>
     <Panel theme="info">
       <PanelHeader>
@@ -17,5 +17,3 @@ const Modal = ({ modalOpen, toggleModal }) => (
     </Panel>
   </Overlay>
 );
-
-export default Modal;
diff --git a/frontend/src/components/playerList.js b/frontend/src/components/playerList.js
index 4ddbe056..cc247668 100644
--- a/frontend/src/components/playerList.js
+++ b/frontend/src/components/playerList.js
@@ -2,7 +2,7 @@ import React from 'react';
 import { Text } from 'rebass';
 import { Flex } from 'reflexbox';
 
-const PlayerList = ({ players }) => (
+export const PlayerList = ({ players }) => (
   <div>
     {players.map(player => {
       return (
@@ -14,5 +14,3 @@ const PlayerList = ({ players }) => (
     })}
   </div>
 );
-
-export default PlayerList;
diff --git a/frontend/src/index.js b/frontend/src/index.js
index 8c52b440..f8841abc 100644
--- a/frontend/src/index.js
+++ b/frontend/src/index.js
@@ -7,8 +7,9 @@ import { ConnectedRouter } from 'react-router-redux';
 import './global-styles.css';
 import '@blueprintjs/core/dist/blueprint.css';
 
-import configureStore from './store';
+import { configureStore } from './store';
 import { Application } from './scenes';
+
 const initialState = {};
 const { store, history } = configureStore(initialState);
 
diff --git a/frontend/src/layouts/LobbyLayout.js b/frontend/src/layouts/LobbyLayout.js
index 389c4096..85316bad 100644
--- a/frontend/src/layouts/LobbyLayout.js
+++ b/frontend/src/layouts/LobbyLayout.js
@@ -1,10 +1,10 @@
 import type { Children } from 'react';
 import React from 'react';
 import { Banner } from 'rebass';
-import ErrorToastContainer from '../components/errors/errorToastContainer';
+import { ErrorToastContainer } from '../components/errors/errorToastContainer';
 import logo from './logo-7-wonders.png';
 
-export default ({ children }: { children: Children }) => (
+export const LobbyLayout = ({ children }: { children: Children }) => (
   <div>
     <Banner
       align="center"
diff --git a/frontend/src/models/games.js b/frontend/src/models/games.js
index dd660d45..6420e06d 100644
--- a/frontend/src/models/games.js
+++ b/frontend/src/models/games.js
@@ -64,7 +64,7 @@ const GamesRecord: GamesType = Record({
   all: new Map(),
   current: null,
 });
-export default class GamesState extends GamesRecord {
+export class GamesState extends GamesRecord {
   addGame(g: GameShape) {
     const game: Game = new Game(g);
     return this.mergeDeepIn(['all', game.id], game);
diff --git a/frontend/src/models/players.js b/frontend/src/models/players.js
index 8fb17128..2af6b0f7 100644
--- a/frontend/src/models/players.js
+++ b/frontend/src/models/players.js
@@ -29,7 +29,7 @@ const PlayersRecord: PlayersType = Record({
   current: '',
 });
 // $FlowFixMe
-export default class PlayerState extends PlayersRecord {
+export class PlayerState extends PlayersRecord {
   addPlayer(p: PlayerShape) {
     const player: Player = new Player(p);
     const playerMap = Map({ [player.username]: player });
diff --git a/frontend/src/reducers.js b/frontend/src/reducers.js
index 076d269e..97c5259e 100644
--- a/frontend/src/reducers.js
+++ b/frontend/src/reducers.js
@@ -2,10 +2,10 @@
 import { reducer as toastrReducer } from 'react-redux-toastr';
 import { routerReducer } from 'react-router-redux';
 import { combineReducers } from 'redux-immutable';
-import gamesReducer from './redux/games';
-import playersReducer from './redux/players';
+import { gamesReducer } from './redux/games';
+import { playersReducer } from './redux/players';
 
-export default function createReducer() {
+export function createReducer() {
   return combineReducers({
     games: gamesReducer,
     players: playersReducer,
diff --git a/frontend/src/redux/games.js b/frontend/src/redux/games.js
index e89bb842..22b0d6bc 100644
--- a/frontend/src/redux/games.js
+++ b/frontend/src/redux/games.js
@@ -2,7 +2,7 @@
 import type { List, Map } from 'immutable';
 import { fromJS } from 'immutable';
 import type { Game, GameMapType, GameNormalMapType, GameShape } from '../models/games';
-import GamesState from '../models/games';
+import { GamesState } from '../models/games';
 
 export const types = {
   UPDATE_GAMES: 'GAMES/UPDATE_GAMES',
@@ -29,7 +29,7 @@ export const actions = {
   enterGame: () => ({ type: types.ENTER_GAME }),
 };
 
-export default (state: GamesState = new GamesState(), action: Actions) => {
+export const gamesReducer = (state: GamesState = new GamesState(), action: Actions) => {
   switch (action.type) {
     case types.UPDATE_GAMES:
       return state.addGames(action.games);
diff --git a/frontend/src/redux/players.js b/frontend/src/redux/players.js
index 85b579f3..de68ae13 100644
--- a/frontend/src/redux/players.js
+++ b/frontend/src/redux/players.js
@@ -1,4 +1,4 @@
-import PlayerState, { Player } from '../models/players';
+import { Player, PlayerState } from '../models/players';
 
 export const types = {
   REQUEST_CHOOSE_USERNAME: 'USER/REQUEST_CHOOSE_USERNAME',
@@ -21,7 +21,7 @@ export const actions = {
   }),
 };
 
-export default (state = new PlayerState(), action) => {
+export const playersReducer = (state = new PlayerState(), action) => {
   switch (action.type) {
     case types.SET_CURRENT_PLAYER:
       return state.addPlayer(action.player);
diff --git a/frontend/src/sagas.js b/frontend/src/sagas.js
index 4a93ffb4..457dac04 100644
--- a/frontend/src/sagas.js
+++ b/frontend/src/sagas.js
@@ -2,12 +2,12 @@
 import type { History } from 'react-router';
 import { call, fork } from 'redux-saga/effects';
 import { connectToGame, SevenWondersSession } from './api/sevenWondersApi';
-import errorHandlingSaga from './sagas/errors';
-import homeSaga from './sagas/home';
-import gameBrowserSaga from './sagas/gameBrowser';
-import lobbySaga from './sagas/lobby';
+import { errorHandlingSaga } from './sagas/errors';
+import { homeSaga } from './sagas/home';
+import { gameBrowserSaga } from './sagas/gameBrowser';
+import { lobbySaga } from './sagas/lobby';
 
-export default function* rootSaga(history: History): * {
+export function* rootSaga(history: History): * {
   let sevenWondersSession: SevenWondersSession | void;
   try {
     sevenWondersSession = yield call(connectToGame);
diff --git a/frontend/src/sagas/errors.js b/frontend/src/sagas/errors.js
index b6ccb91d..6598da6c 100644
--- a/frontend/src/sagas/errors.js
+++ b/frontend/src/sagas/errors.js
@@ -6,7 +6,7 @@ import { apply, cancelled, take } from 'redux-saga/effects';
 import type { ApiError } from '../api/model';
 import type { SevenWondersSession } from '../api/sevenWondersApi';
 
-export default function* errorHandlingSaga(session: SevenWondersSession): * {
+export function* errorHandlingSaga(session: SevenWondersSession): * {
   const errorChannel: Channel = yield eventChannel(session.watchErrors());
   try {
     while (true) {
diff --git a/frontend/src/sagas/gameBrowser.js b/frontend/src/sagas/gameBrowser.js
index 81b2a848..f6aa77bd 100644
--- a/frontend/src/sagas/gameBrowser.js
+++ b/frontend/src/sagas/gameBrowser.js
@@ -54,7 +54,7 @@ function* joinGame(session: SevenWondersSession): * {
   }
 }
 
-function* gameBrowserSaga(session: SevenWondersSession): * {
+export function* gameBrowserSaga(session: SevenWondersSession): * {
   yield all([
     call(watchGames, session),
     call(watchLobbyJoined, session),
@@ -62,5 +62,3 @@ function* gameBrowserSaga(session: SevenWondersSession): * {
     call(joinGame, session),
   ]);
 }
-
-export default gameBrowserSaga;
diff --git a/frontend/src/sagas/home.js b/frontend/src/sagas/home.js
index 89271706..db273d28 100644
--- a/frontend/src/sagas/home.js
+++ b/frontend/src/sagas/home.js
@@ -25,8 +25,6 @@ function* validateUsername(session: SevenWondersSession): * {
   }
 }
 
-function* homeSaga(session: SevenWondersSession): * {
+export function* homeSaga(session: SevenWondersSession): * {
   yield all([call(sendUsername, session), call(validateUsername, session)]);
 }
-
-export default homeSaga;
diff --git a/frontend/src/sagas/lobby.js b/frontend/src/sagas/lobby.js
index 3f23a125..2deb5035 100644
--- a/frontend/src/sagas/lobby.js
+++ b/frontend/src/sagas/lobby.js
@@ -48,8 +48,6 @@ function* startGame(session: SevenWondersSession): * {
   }
 }
 
-function* lobbySaga(session: SevenWondersSession): * {
+export function* lobbySaga(session: SevenWondersSession): * {
   yield all([call(watchLobbyUpdates, session), call(watchGameStart, session), call(startGame, session)]);
 }
-
-export default lobbySaga;
diff --git a/frontend/src/scenes/GameBrowser/index.js b/frontend/src/scenes/GameBrowser/index.js
new file mode 100644
index 00000000..20a835d1
--- /dev/null
+++ b/frontend/src/scenes/GameBrowser/index.js
@@ -0,0 +1,65 @@
+// @flow
+import type { List } from 'immutable';
+import React, { Component } from 'react';
+import { connect } from 'react-redux';
+import { InlineForm, Space, Text } from 'rebass';
+import { Flex } from 'reflexbox';
+import { GameList } from '../../components/gameList';
+import type { Game } from '../../models/games';
+import type { Player } from '../../models/players';
+import { actions, getAllGames } from '../../redux/games';
+import { getCurrentPlayer } from '../../redux/players';
+
+class GameBrowserPresenter extends Component {
+  props: {
+    currentPlayer: Player,
+    games: List<Game>,
+    createGame: (gameName: string) => void,
+    joinGame: (gameId: string) => void
+  };
+
+  _gameName: string | void = undefined;
+
+  createGame = (e: SyntheticEvent): void => {
+    e.preventDefault();
+    if (this._gameName !== undefined) {
+      this.props.createGame(this._gameName);
+    }
+  };
+
+  render() {
+    return (
+      <div>
+        <Flex align="center" p={1}>
+          <InlineForm
+            buttonLabel="Create Game"
+            label="Game name"
+            name="game_name"
+            onChange={(e: SyntheticInputEvent) => (this._gameName = e.target.value)}
+            onClick={this.createGame}
+          />
+          <Space auto />
+          <Text>
+            <b>Username:</b>
+            {' '}
+            {this.props.currentPlayer && this.props.currentPlayer.displayName}
+          </Text>
+          <Space x={1} />
+        </Flex>
+        <GameList games={this.props.games} joinGame={this.props.joinGame} />
+      </div>
+    );
+  }
+}
+
+const mapStateToProps = state => ({
+  currentPlayer: getCurrentPlayer(state.get('players')),
+  games: getAllGames(state.get('games')),
+});
+
+const mapDispatchToProps = {
+  createGame: actions.requestCreateGame,
+  joinGame: actions.requestJoinGame,
+};
+
+export const GameBrowser = connect(mapStateToProps, mapDispatchToProps)(GameBrowserPresenter);
diff --git a/frontend/src/scenes/Lobby/index.js b/frontend/src/scenes/Lobby/index.js
index 1b5a11ff..57ad5c7f 100644
--- a/frontend/src/scenes/Lobby/index.js
+++ b/frontend/src/scenes/Lobby/index.js
@@ -2,11 +2,11 @@ import { List } from 'immutable';
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { Button } from 'rebass';
-import PlayerList from '../../components/playerList';
+import { PlayerList } from '../../components/playerList';
 import { actions, getCurrentGame } from '../../redux/games';
 import { getPlayers } from '../../redux/players';
 
-class Lobby extends Component {
+class LobbyPresenter extends Component {
   getTitle() {
     if (this.props.currentGame) {
       return this.props.currentGame.name + ' — Lobby';
@@ -39,4 +39,4 @@ const mapDispatchToProps = {
   startGame: actions.requestStartGame,
 };
 
-export default connect(mapStateToProps, mapDispatchToProps)(Lobby);
+export const Lobby = connect(mapStateToProps, mapDispatchToProps)(LobbyPresenter);
diff --git a/frontend/src/scenes/SplashScreen/components/HomeLayout.js b/frontend/src/scenes/SplashScreen/components/HomeLayout.js
index 86666eb2..2a3fd856 100644
--- a/frontend/src/scenes/SplashScreen/components/HomeLayout.js
+++ b/frontend/src/scenes/SplashScreen/components/HomeLayout.js
@@ -2,11 +2,11 @@
 import type { Children } from 'react';
 import React from 'react';
 import { Banner } from 'rebass';
-import ErrorToastContainer from '../../../components/errors/errorToastContainer';
+import { ErrorToastContainer } from '../../../components/errors/errorToastContainer';
 import background from './background-zeus-temple.jpg';
 import logo from './logo-7-wonders.png';
 
-export default ({ children }: { children: Children }) => (
+export const HomeLayout = ({ children }: { children: Children }) => (
   <div>
     <Banner align="center" backgroundImage={background}>
       <img src={logo} alt="Seven Wonders" />
diff --git a/frontend/src/scenes/SplashScreen/index.js b/frontend/src/scenes/SplashScreen/index.js
index feff8b1e..dca8bc49 100644
--- a/frontend/src/scenes/SplashScreen/index.js
+++ b/frontend/src/scenes/SplashScreen/index.js
@@ -5,9 +5,9 @@ import { Container } from 'rebass';
 import { actions } from '../../redux/players';
 
 import { InputGroup, Button, Classes, Intent } from '@blueprintjs/core';
-import HomeLayout from './components/HomeLayout';
+import { HomeLayout } from './components/HomeLayout';
 
-class SplashScreen extends Component {
+class SplashScreenPresenter extends Component {
   _username = '';
 
   play = e => {
@@ -42,4 +42,4 @@ const mapDispatchToProps = {
   chooseUsername: actions.chooseUsername,
 };
 
-export default connect(null, mapDispatchToProps)(SplashScreen);
+export const SplashScreen = connect(null, mapDispatchToProps)(SplashScreenPresenter);
diff --git a/frontend/src/scenes/index.js b/frontend/src/scenes/index.js
index ffc2c856..0229e850 100644
--- a/frontend/src/scenes/index.js
+++ b/frontend/src/scenes/index.js
@@ -1,14 +1,14 @@
 import React from 'react';
 import { Route, Redirect, Switch } from 'react-router-dom';
 
-import SplashScreen from './SplashScreen';
-import Games from './Games';
-import Lobby from './Lobby';
+import { SplashScreen } from './SplashScreen';
+import { GameBrowser } from './GameBrowser';
+import { Lobby } from './Lobby';
 
 export const Application = () => (
   <Switch>
     <Route path="/splash-screen" component={SplashScreen} />
-    <Route path="/games" component={Games} />
+    <Route path="/games" component={GameBrowser} />
     <Route path="/lobby" component={Lobby} />
     <Redirect from="*" to="/splash-screen" />
   </Switch>
diff --git a/frontend/src/store.js b/frontend/src/store.js
index 37bc0822..3170d194 100644
--- a/frontend/src/store.js
+++ b/frontend/src/store.js
@@ -4,10 +4,10 @@ import createHistory from 'history/createBrowserHistory';
 import { routerMiddleware } from 'react-router-redux';
 import { fromJS } from 'immutable';
 import createSagaMiddleware from 'redux-saga';
-import createReducer from './reducers';
-import rootSaga from './sagas';
+import { createReducer } from './reducers';
+import { rootSaga } from './sagas';
 
-export default function configureStore(initialState: Object = {}) {
+export function configureStore(initialState: Object = {}) {
   const sagaMiddleware = createSagaMiddleware();
 
   const history = createHistory();