diff --git a/client/common/Button.jsx b/client/common/Button.jsx index f1f6cfe28c..b7f3c3bddd 100644 --- a/client/common/Button.jsx +++ b/client/common/Button.jsx @@ -257,7 +257,7 @@ Button.propTypes = { * The visible part of the button, telling the user what * the action is */ - children: PropTypes.element, + children: PropTypes.oneOfType([PropTypes.element, PropTypes.string]), /** If the button can be activated or not */ diff --git a/client/modules/IDE/components/Toolbar.jsx b/client/modules/IDE/components/Toolbar.jsx index fc6d1d95b6..9658c72223 100644 --- a/client/modules/IDE/components/Toolbar.jsx +++ b/client/modules/IDE/components/Toolbar.jsx @@ -18,6 +18,7 @@ class Toolbar extends React.Component { super(props); this.handleKeyPress = this.handleKeyPress.bind(this); this.handleProjectNameChange = this.handleProjectNameChange.bind(this); + this.handleProjectNameClick = this.handleProjectNameClick.bind(this); this.handleProjectNameSave = this.handleProjectNameSave.bind(this); this.state = { @@ -36,6 +37,17 @@ class Toolbar extends React.Component { this.setState({ projectNameInputValue: event.target.value }); } + handleProjectNameClick() { + if (this.canEditProjectName) { + this.props.showEditProjectName(); + setTimeout(() => { + if (this.projectNameInput) { + this.projectNameInput.focus(); + } + }, 140); + } + } + handleProjectNameSave() { const newProjectName = this.state.projectNameInputValue.trim(); if (newProjectName.length === 0) { @@ -132,12 +144,7 @@ class Toolbar extends React.Component {