var React = require('react');
var LauncherView = require('./components/launcher/launcher-view.jsx');
var EditView = require('./components/edit/edit-view.jsx');
var Provider = require('react-redux').Provider;
var connect = require('react-redux').connect;
var store = require('./store');

// Main component
var App = React.createClass({

  render: function() {

    var editMode = this.props.processOpts.edit || false;

    var view = editMode ?
      <Provider store={store}>
        { function() { return <EditView />; }.bind(this) }
      </Provider> :
      <Provider store={store}>
        { function() { return <LauncherView />; }.bind(this) }
      </Provider>
    ;

    return (
      <div id="pitaya">
        {view}
      </div>
    );

  },

});

// Select props to inject from store state
function select(state) {
  return {
    processOpts: state.processOpts
  }
}

// Connect App to Redux store
App = connect(select)(App);

React.render(
  <Provider store={store}>
    { function() { return <App />; } }
  </Provider>
  ,
  document.body
);