Merge pull request #3984 from towerofnix/treat-defaultValue-properly

Treat defaultValue from Blockly prompts properly

src/components/prompt/prompt.jsx

@@ -47,9 +47,10 @@ const PromptComponent = props => (
                 <input
                     autoFocus
                     className={styles.variableNameTextInput}
+                    defaultValue={props.defaultValue}
                     name={props.label}
-                    placeholder={props.placeholder}
                     onChange={props.onChange}
+                    onFocus={props.onFocus}
                     onKeyPress={props.onKeyPress}
                 />
             </Box>
@@ -137,16 +138,17 @@ const PromptComponent = props => (
 PromptComponent.propTypes = {
     canAddCloudVariable: PropTypes.bool.isRequired,
     cloudSelected: PropTypes.bool.isRequired,
+    defaultValue: PropTypes.string,
     globalSelected: PropTypes.bool.isRequired,
     isStage: PropTypes.bool.isRequired,
     label: PropTypes.string.isRequired,
     onCancel: PropTypes.func.isRequired,
     onChange: PropTypes.func.isRequired,
     onCloudVarOptionChange: PropTypes.func,
+    onFocus: PropTypes.func.isRequired,
     onKeyPress: PropTypes.func.isRequired,
     onOk: PropTypes.func.isRequired,
     onScopeOptionSelection: PropTypes.func.isRequired,
-    placeholder: PropTypes.string,
     showCloudOption: PropTypes.bool.isRequired,
     showVariableOptions: PropTypes.bool.isRequired,
     title: PropTypes.string.isRequired

src/containers/blocks.jsx

@@ -460,9 +460,9 @@ class Blocks extends React.Component {
                 />
                 {this.state.prompt ? (
                     <Prompt
+                        defaultValue={this.state.prompt.defaultValue}
                         isStage={vm.runtime.getEditingTarget().isStage}
                         label={this.state.prompt.message}
-                        placeholder={this.state.prompt.defaultValue}
                         showCloudOption={this.state.prompt.showCloudOption}
                         showVariableOptions={this.state.prompt.showVariableOptions}
                         title={this.state.prompt.title}

src/containers/prompt.jsx

@@ -25,6 +25,9 @@ class Prompt extends React.Component {
     handleKeyPress (event) {
         if (event.key === 'Enter') this.handleOk();
     }
+    handleFocus (event) {
+        event.target.select();
+    }
     handleOk () {
         this.props.onOk(this.state.inputValue, {
             scope: this.state.globalSelected ? 'global' : 'local',
@@ -54,16 +57,17 @@ class Prompt extends React.Component {
             <PromptComponent
                 canAddCloudVariable={this.state.canAddCloudVariable}
                 cloudSelected={this.state.cloudSelected}
+                defaultValue={this.props.defaultValue}
                 globalSelected={this.state.globalSelected}
                 isStage={this.props.isStage}
                 label={this.props.label}
-                placeholder={this.props.placeholder}
                 showCloudOption={this.props.showCloudOption}
                 showVariableOptions={this.props.showVariableOptions}
                 title={this.props.title}
                 onCancel={this.handleCancel}
                 onChange={this.handleChange}
                 onCloudVarOptionChange={this.handleCloudVariableOptionChange}
+                onFocus={this.handleFocus}
                 onKeyPress={this.handleKeyPress}
                 onOk={this.handleOk}
                 onScopeOptionSelection={this.handleScopeOptionSelection}
@@ -73,11 +77,11 @@ class Prompt extends React.Component {
 }
 
 Prompt.propTypes = {
+    defaultValue: PropTypes.string,
     isStage: PropTypes.bool.isRequired,
     label: PropTypes.string.isRequired,
     onCancel: PropTypes.func.isRequired,
     onOk: PropTypes.func.isRequired,
-    placeholder: PropTypes.string,
     showCloudOption: PropTypes.bool.isRequired,
     showVariableOptions: PropTypes.bool.isRequired,
     title: PropTypes.string.isRequired,