const preact = require('preact');
const { connect } = require('preact-redux');

const Main = require('./main');
// const Nav = require('./nav');
const Controls = require('./controls');
const Footer = require('./footer');

const addState = connect(
    state => ({ showNav: state.showNav })
);

class Mnml extends preact.Component {
    shouldComponentUpdate(newProps) {
        if (newProps.showNav !== this.props.showNav) return true;
        return false;
    }

    render(args) {
        return (
            <div id="mnml" class={args.showNav ? 'nav-visible' : ''}>
                <Main />
                <Controls />
                <Footer />
            </div>
        );
    }
}

module.exports = addState(Mnml);