// eslint-disable-next-line
const preact = require('preact');
const { connect } = require('preact-redux');

const LoginContainer = require('./login.container');
const MenuContainer = require('./menu.container');
const GameContainer = require('./game.container');
const InstanceContainer = require('./instance.container');

const addState = connect(
    state => {
        const { game, instance, ws, account } = state;

        if (!game) {
            ws.clearGameStateTimeout();
        }

        if (!instance) {
            ws.clearInstanceStateTimeout();
        }


        return { game, instance, account };
    }
);

function renderBody(props) {
    const { game, instance, account } = props;

    if (!account) {
        return (
            <main>
                <LoginContainer />
            </main>
        );
    }
    if (game) {
        return (
            <GameContainer />
        );
    }

    if (instance) {
        return (
            <InstanceContainer />
        );
    }

    return (
        <MenuContainer />
    );
}

module.exports = addState(renderBody);
