Removed loadingEntities and added to FiddleContainer

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})
 };

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 (
-      <Button 
-        color="dark"
-        size="sm"
-        icon="upload-cloud"
-        onClick={(e) => this.props.onDeployClick(e)}>
-        Deploy
-      </Button>
-    );
-  }
-}
+const FiddleDeployButton = ({ onDeployClick }) => (
+  <Button 
+    color="dark"
+    size="sm"
+    icon="upload-cloud"
+    onClick={onDeployClick}>
+    Deploy
+  </Button>
+);
 
 FiddleDeployButton.propTypes = {
-  fiddle: PropTypes.object,
-  onDeployClick: PropTypes.func,
-  loading: PropTypes.bool,
-  compiledContract: PropTypes.object,
-  error: PropTypes.string
+  onDeployClick: PropTypes.func.isRequired
 };
 
 export default FiddleDeployButton;

embark-ui/src/components/FiddleResultsSummary.js

@@ -25,7 +25,7 @@ class FiddleResultsSummary extends Component{
         renderings.push(
           <React.Fragment key="success">
             <Badge className="badge-link" color="success">Compiled</Badge>
-            <FiddleDeployButton onDeployClick={this.props.onDeployClick} />
+            <FiddleDeployButton onDeployClick={(e) => this.props.onDeployClick(e)} />
           </React.Fragment>
         );
       }

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)}
         />
         <Fiddle
           value={this.state.value} 
@@ -136,8 +140,7 @@ function mapStateToProps(state) {
   const fiddle = getFiddle(state);
   return { 
     fiddle: fiddle.data, 
-    error: fiddle.error, 
-    loadingMessage: fiddle.loading,
+    error: fiddle.error,
     loading: state.loading
   };
 }
@@ -146,7 +149,6 @@ FiddleContainer.propTypes = {
   fiddle: PropTypes.object,
   error: PropTypes.string,
   loading: PropTypes.bool,
-  loadingMessage: PropTypes.string,
   postFiddle: PropTypes.func,
   postFiddleDeploy: PropTypes.func
 };

embark-ui/src/reducers/index.js

@@ -1,5 +1,6 @@
 import {combineReducers} from 'redux';
 import {REQUEST, SUCCESS} from "../actions";
+//import entitiesDefaultState from "../api/entities";
 
 const BN_FACTOR = 10000;
 const voidAddress = '0x0000000000000000000000000000000000000000';
@@ -114,16 +115,6 @@ function errorEntities(state = {}, action) {
   return {...state, ...newState};
 }
 
-function loadingEntities(state = {}, action) {
-  if (!action.type.endsWith(REQUEST)) {
-    return state;
-  }
-  let newState = {};
-  if(!newState[action.type]) newState[action.type] = {};
-  newState[action.type].loading = action.loading || 'Loading...';
-  return {...state, ...newState};
-}
-
 function loading(_state = false, action) {
   return action.type.endsWith(REQUEST);
 }
@@ -132,8 +123,7 @@ const rootReducer = combineReducers({
   entities,
   loading,
   errorMessage,
-  errorEntities,
-  loadingEntities
+  errorEntities
 });
 
 export default rootReducer;

embark-ui/src/reducers/selectors.js

@@ -1,5 +1,5 @@
 import _ from 'lodash';
-import {REQUEST, FIDDLE} from '../actions/index.js';
+import {REQUEST, FIDDLE, FIDDLE_DEPLOY} from '../actions/index.js';
 
 export function getAccounts(state) {
   return state.entities.accounts;
@@ -106,11 +106,9 @@ export function getMessages(state) {
 }
 
 export function getFiddle(state) {
-  const loadingEntity = state.loadingEntities[FIDDLE[REQUEST]];
-  return { 
+  return {
     data: _.last(state.entities.fiddles), 
-    error: _.last(state.errorEntities.fiddles), 
-    loading: loadingEntity ? loadingEntity.loading : undefined
+    error: _.last(state.errorEntities.fiddles)
   };
 }