diff --git a/embark-ui/src/actions/index.js b/embark-ui/src/actions/index.js index 74270b7d..685cee9d 100644 --- a/embark-ui/src/actions/index.js +++ b/embark-ui/src/actions/index.js @@ -1,12 +1,13 @@ export const REQUEST = 'REQUEST'; export const SUCCESS = 'SUCCESS'; export const FAILURE = 'FAILURE'; +export const ENTITY = 'ENTITY'; function createRequestTypes(base) { return [REQUEST, SUCCESS, FAILURE].reduce((acc, type) => { acc[type] = `${base}_${type}`; return acc; - }, {}); + }, { id: 0 }); } function action(type, payload = {}) { @@ -170,14 +171,14 @@ export const ensRecords = { export const FIDDLE = createRequestTypes('FIDDLE'); export const fiddle = { - request: (codeToCompile) => action(FIDDLE[REQUEST], {codeToCompile, loading: 'Compiling...'}), + request: (codeToCompile) => action(FIDDLE[REQUEST], {codeToCompile}), success: (fiddle) => action(FIDDLE[SUCCESS], {fiddles: [fiddle]}), failure: (error) => action(FIDDLE[FAILURE], {error}) }; export const FIDDLE_DEPLOY = createRequestTypes('FIDDLE_DEPLOY'); export const fiddleDeploy = { - request: (compiledCode) => action(FIDDLE_DEPLOY[REQUEST], {compiledCode, loading: 'Deploying...'}), + request: (compiledCode) => action(FIDDLE_DEPLOY[REQUEST], {compiledCode}), success: () => action(FIDDLE_DEPLOY[SUCCESS]), failure: (error) => action(FIDDLE_DEPLOY[FAILURE], {error}) }; diff --git a/embark-ui/src/components/FiddleDeployButton.js b/embark-ui/src/components/FiddleDeployButton.js index 9c30a2e1..ba2d11be 100644 --- a/embark-ui/src/components/FiddleDeployButton.js +++ b/embark-ui/src/components/FiddleDeployButton.js @@ -1,29 +1,19 @@ -import React, {Component} from 'react'; +import React from 'react'; import PropTypes from 'prop-types'; import {Button} from 'tabler-react'; -class FiddleDeployButton extends Component{ - - render (){ - - return ( - - ); - } -} +const FiddleDeployButton = ({ onDeployClick }) => ( + +); FiddleDeployButton.propTypes = { - fiddle: PropTypes.object, - onDeployClick: PropTypes.func, - loading: PropTypes.bool, - compiledContract: PropTypes.object, - error: PropTypes.string + onDeployClick: PropTypes.func.isRequired }; export default FiddleDeployButton; diff --git a/embark-ui/src/components/FiddleResultsSummary.js b/embark-ui/src/components/FiddleResultsSummary.js index 29843e99..0689f405 100644 --- a/embark-ui/src/components/FiddleResultsSummary.js +++ b/embark-ui/src/components/FiddleResultsSummary.js @@ -25,7 +25,7 @@ class FiddleResultsSummary extends Component{ renderings.push( Compiled - + this.props.onDeployClick(e)} /> ); } diff --git a/embark-ui/src/containers/FiddleContainer.js b/embark-ui/src/containers/FiddleContainer.js index 6cc9d1ff..0c0ae389 100644 --- a/embark-ui/src/containers/FiddleContainer.js +++ b/embark-ui/src/containers/FiddleContainer.js @@ -16,7 +16,8 @@ class FiddleContainer extends Component { constructor(props) { super(props); this.state = { - value: '' + value: '', + loadingMessage: '' }; this.compileTimeout = null; this.ace = null; @@ -27,6 +28,7 @@ class FiddleContainer extends Component { this.setState({value: newValue}); if (this.compileTimeout) clearTimeout(this.compileTimeout); this.compileTimeout = setTimeout(() => { + this.setState({loadingMessage: 'Compiling...'}); this.props.postFiddle(newValue); }, 1000); @@ -74,12 +76,14 @@ class FiddleContainer extends Component { scrollToComponent(this.ace); } - _onDeployClick(){ - this.props.postFiddleDeploy(this.props.fiddle); + _onDeployClick(_e){ + this.setState({loadingMessage: 'Deploying...'}); + this.props.postFiddleDeploy(this.props.fiddle.compilationResult); } render() { - const {fiddle, loading, loadingMessage, error} = this.props; + const {fiddle, loading, error} = this.props; + const {loadingMessage} = this.state; let renderings = []; let warnings = []; let errors = []; @@ -96,7 +100,7 @@ class FiddleContainer extends Component { loadingMessage={loadingMessage} hasResult={Boolean(fiddle)} fatal={error} - onDeployClick={this._onDeployClick} + onDeployClick={(e) => this._onDeployClick(e)} />