From bb21cf56d30578bab3ece32c2968cd119a4237af Mon Sep 17 00:00:00 2001 From: Jonas Schwabe Date: Mon, 30 Jan 2017 21:46:58 +0100 Subject: [PATCH] Use new modal for edit functionality --- src/browser/components/NewTeamModal.jsx | 15 ++++++++-- src/browser/components/TeamList.jsx | 37 +++++++++++++++++++------ 2 files changed, 42 insertions(+), 10 deletions(-) diff --git a/src/browser/components/NewTeamModal.jsx b/src/browser/components/NewTeamModal.jsx index d7b7b2f5..a871d1a3 100644 --- a/src/browser/components/NewTeamModal.jsx +++ b/src/browser/components/NewTeamModal.jsx @@ -13,6 +13,15 @@ class NewTeamModal extends React.Component { }; } + componentWillMount() { + this.state = { + teamName: this.props.team ? this.props.team.name : '', + teamUrl: this.props.team ? this.props.team.url : '', + teamIndex: this.props.team ? this.props.team.index : false, + saveStarted: false + }; + } + getTeamNameValidationError() { if (!this.state.saveStarted) { return null; @@ -69,7 +78,8 @@ class NewTeamModal extends React.Component { if (this.validateForm()) { this.props.onSave({ url: this.state.teamUrl, - name: this.state.teamName + name: this.state.teamName, + index: this.state.teamIndex }); } }); @@ -159,7 +169,8 @@ class NewTeamModal extends React.Component { NewTeamModal.propTypes = { onClose: React.PropTypes.func, - onSave: React.PropTypes.func + onSave: React.PropTypes.func, + team: React.PropTypes.object }; module.exports = NewTeamModal; diff --git a/src/browser/components/TeamList.jsx b/src/browser/components/TeamList.jsx index 5ddd1bf0..8e85c56c 100644 --- a/src/browser/components/TeamList.jsx +++ b/src/browser/components/TeamList.jsx @@ -14,7 +14,7 @@ const TeamList = React.createClass({ getInitialState() { return { - showTeamListItemNew: false, + showEditTeamForm: false, indexToRemoveServer: -1, team: { url: '', @@ -41,7 +41,7 @@ const TeamList = React.createClass({ } this.setState({ - showTeamListItemNew: false, + showEditTeamForm: false, team: { url: '', name: '', @@ -53,7 +53,7 @@ const TeamList = React.createClass({ }, handleTeamEditing(teamName, teamUrl, teamIndex) { this.setState({ - showTeamListItemNew: true, + showEditTeamForm: true, team: { url: teamUrl, name: teamName, @@ -94,19 +94,40 @@ const TeamList = React.createClass({ }); var addTeamForm; - if (this.props.showAddTeamForm || this.state.showTeamListItemNew) { + if (this.props.showAddTeamForm || this.state.showEditTeamForm) { addTeamForm = ( { + onClose={() => { this.setState({ - showNewTeamModal: false + showNewTeamModal: false, + showEditTeamForm: false, + team: { + name: '', + url: '', + index: false + } + }); + }} + onSave={(newTeam) => { + if (this.props.showAddTeamForm) { + this.props.teams.push(newTeam); + } else { + this.props.teams[newTeam.index] = newTeam; + } + this.setState({ + showNewTeamModal: false, + showEditTeamForm: false, + team: { + name: '', + url: '', + index: false + } }); - this.props.teams.push(newTeam); this.render(); this.props.onTeamsChange(this.props.teams); }} + team={this.state.team} />); } else { addTeamForm = '';