aclindsa/moneygo
1
0
Fork 0
mirror of https://github.com/aclindsa/moneygo.git synced 2025-07-01 20:08:39 -04:00
Code Issues Releases Wiki Activity

Convert NewUserPanel to a Modal, and to use redux

Browse Source
This commit is contained in:
Aaron Lindsay
2017-01-08 21:04:01 -05:00
parent 4f940b31a1
commit 871aa88ea6
5 changed files with 117 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
js/components/MoneyGoApp.js
View File

@ -7,7 +7,7 @@ var Tab = ReactBootstrap.Tab;
var Modal = ReactBootstrap.Modal;
var TopBarContainer = require('../containers/TopBarContainer');
var NewUserForm = require('./NewUserForm');
var NewUserModalContainer = require('../containers/NewUserModalContainer');
var AccountSettingsModalContainer = require('../containers/AccountSettingsModalContainer');
var AccountsTabContainer = require('../containers/AccountsTabContainer');
var SecuritiesTabContainer = require('../containers/SecuritiesTabContainer');
@ -16,75 +16,56 @@ module.exports = React.createClass({
displayName: "MoneyGoApp",
getInitialState: function() {
return {
hash: "home",
showNewUserModal: false,
showAccountSettingsModal: false
};
},
componentDidMount: function() {
this.props.tryResumingSession();
this.handleHashChange();
if ("onhashchange" in window) {
window.onhashchange = this.handleHashChange;
}
},
handleHashChange: function() {
var hash = location.hash.replace(/^#/, '');
if (hash.length == 0)
hash = "home";
if (hash != this.state.hash)
this.setHash(hash);
},
setHash: function(hash) {
location.hash = hash;
if (this.state.hash != hash)
this.setState({hash: hash});
},
handleAccountSettings: function() {
this.setState({showAccountSettingsModal: true});
},
handleSettingsSubmitted: function(user) {
this.setState({
showAccountSettingsModal: false
});
this.setState({showAccountSettingsModal: false});
},
handleSettingsCanceled: function() {
this.setState({showAccountSettingsModal: false});
},
handleCreateNewUser: function() {
this.setHash("new_user");
this.setState({showNewUserModal: true});
},
handleGoHome: function() {
this.setHash("home");
handleNewUserCreated: function() {
this.setState({showNewUserModal: false});
},
handleNewUserCanceled: function() {
this.setState({showNewUserModal: false});
},
render: function() {
var mainContent;
if (this.state.hash == "new_user") {
mainContent = <NewUserForm onNewUser={this.handleGoHome} onCancel={this.handleGoHome}/>
} else {
if (this.props.user.isUser())
mainContent = (
<Tabs defaultActiveKey={1} id='mainNavigationTabs'>
<Tab title="Accounts" eventKey={1} >
<AccountsTabContainer
className="fullheight" />
</Tab>
<Tab title="Securities" eventKey={2} >
<SecuritiesTabContainer
className="fullheight" />
</Tab>
<Tab title="Scheduled Transactions" eventKey={3} >Scheduled transactions go here...</Tab>
<Tab title="Budgets" eventKey={4} >Budgets go here...</Tab>
<Tab title="Reports" eventKey={5} >Reports go here...</Tab>
</Tabs>);
else
mainContent = (
<Jumbotron>
<center>
<h1>Money<i>Go</i></h1>
<p><i>Go</i> manage your money.</p>
</center>
</Jumbotron>);
}
if (this.props.user.isUser())
mainContent = (
<Tabs defaultActiveKey={1} id='mainNavigationTabs'>
<Tab title="Accounts" eventKey={1} >
<AccountsTabContainer
className="fullheight" />
</Tab>
<Tab title="Securities" eventKey={2} >
<SecuritiesTabContainer
className="fullheight" />
</Tab>
<Tab title="Scheduled Transactions" eventKey={3} >Scheduled transactions go here...</Tab>
<Tab title="Budgets" eventKey={4} >Budgets go here...</Tab>
<Tab title="Reports" eventKey={5} >Reports go here...</Tab>
</Tabs>);
else
mainContent = (
<Jumbotron>
<center>
<h1>Money<i>Go</i></h1>
<p><i>Go</i> manage your money.</p>
</center>
</Jumbotron>);
return (
<div className="fullheight ui">
@ -92,6 +73,10 @@ module.exports = React.createClass({
onCreateNewUser={this.handleCreateNewUser}
onAccountSettings={this.handleAccountSettings} />
{mainContent}
<NewUserModalContainer
show={this.state.showNewUserModal}
onSubmit={this.handleNewUserCreated}
onCancel={this.handleNewUserCanceled}/>
<AccountSettingsModalContainer
show={this.state.showAccountSettingsModal}
onSubmit={this.handleSettingsSubmitted}