lunch/js/components/LunchApp.js
2017-01-10 08:46:34 -05:00

99 lines
2.9 KiB
JavaScript

var React = require('react');
var ReactBootstrap = require('react-bootstrap');
var Jumbotron = ReactBootstrap.Jumbotron;
var Tabs = ReactBootstrap.Tabs;
var Tab = ReactBootstrap.Tab;
var Modal = ReactBootstrap.Modal;
var TopBarContainer = require('../containers/TopBarContainer');
var RecordLunchContainer = require('../containers/RecordLunchContainer');
var AccountSettingsModalContainer = require('../containers/AccountSettingsModalContainer');
var LunchStatsContainer = require('../containers/LunchStatsContainer');
var NewUserModalContainer = require('../containers/NewUserModalContainer');
var NewGroupModalContainer = require('../containers/NewGroupModalContainer');
module.exports = React.createClass({
displayName: "LunchApp",
getInitialState: function() {
return {
showNewUserModal: false,
showNewGroupModal: false,
showAccountSettingsModal: false
};
},
componentDidMount: function() {
this.props.tryResumingSession();
this.props.fetchGroups();
},
handleAccountSettings: function() {
this.setState({showAccountSettingsModal: true});
},
handleSettingsSubmitted: function(user) {
this.setState({showAccountSettingsModal: false});
},
handleSettingsCanceled: function() {
this.setState({showAccountSettingsModal: false});
},
handleCreateNewUser: function() {
this.setState({showNewUserModal: true});
},
handleNewUserCreated: function() {
this.setState({showNewUserModal: false});
},
handleNewUserCanceled: function() {
this.setState({showNewUserModal: false});
},
handleCreateNewGroup: function() {
this.setState({showNewGroupModal: true});
},
handleNewGroupCreated: function() {
this.setState({showNewGroupModal: false});
},
handleNewGroupCanceled: function() {
this.setState({showNewGroupModal: false});
},
render: function() {
var mainContent;
if (this.props.user.isUser())
mainContent = (
<Tabs defaultActiveKey={1} id='mainNavigationTabs'>
<Tab title="Record Lunch" eventKey={1} >
<RecordLunchContainer />
</Tab>
<Tab title="Reports" eventKey={2} >
<LunchStatsContainer />
</Tab>
</Tabs>);
else
mainContent = (
<Jumbotron>
<center>
<h1>Lunch App</h1>
</center>
</Jumbotron>);
return (
<div className="fullheight ui">
<TopBarContainer
onCreateNewUser={this.handleCreateNewUser}
onCreateNewGroup={this.handleCreateNewGroup}
onAccountSettings={this.handleAccountSettings} />
{mainContent}
<NewUserModalContainer
show={this.state.showNewUserModal}
onSubmit={this.handleNewUserCreated}
onCancel={this.handleNewUserCanceled}/>
<NewGroupModalContainer
show={this.state.showNewGroupModal}
onSubmit={this.handleNewGroupCreated}
onCancel={this.handleNewGroupCanceled}/>
<AccountSettingsModalContainer
show={this.state.showAccountSettingsModal}
onSubmit={this.handleSettingsSubmitted}
onCancel={this.handleSettingsCanceled}/>
</div>
);
}
});