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

const LoginContainer = require('./login.container');
const GameContainer = require('./game.container');
const Instance = require('./instance.component');
const Team = require('./team');
const List = require('./list');

const addState = connect(
    state => {
        const { game, instance, account, nav } = state;
        return { game, instance, account, nav };
    }
);

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

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

    if (game) {
        return <GameContainer />;
    }

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

    if (nav === 'team') return <Team />;
    if (nav === 'list') return <List />;

    return (
        <main></main>
    );
}

module.exports = addState(Main);