add gas station to Contract functions

embark-ui/src/components/GasStation.js

@@ -75,7 +75,7 @@ class GasStation extends Component {
           <Card.Header>
             <Card.Title>Gas Price Estimator (for Mainnet)</Card.Title>
             <Card.Options>
-              <CopyToClipboard text={currentGasStep.price}
+              <CopyToClipboard text={currentGasStep.price / 10}
                                onCopy={() => this.setState({copied: true})}
                                title="Copy gas price to clipboard">
                 <span><Stamp color="blue" icon="copy"/></span>

embark-ui/src/containers/ContractDeploymentContainer.js

@@ -36,7 +36,6 @@ class ContractDeploymentContainer extends Component {
                      render={({gasStats}) => (
                        <GasStation gasStats={gasStats}/>
                      )}/>
-
       </React.Fragment>
     );
   }
@@ -58,6 +57,7 @@ ContractDeploymentContainer.propTypes = {
   contractFunctions: PropTypes.arrayOf(PropTypes.object),
   postContractDeploy: PropTypes.func,
   fetchContractProfile: PropTypes.func,
+  fetchEthGas: PropTypes.func,
   error: PropTypes.string
 };
 

embark-ui/src/containers/ContractFunctionsContainer.js

@@ -3,18 +3,25 @@ import {connect} from 'react-redux';
 import PropTypes from 'prop-types';
 import {withRouter} from 'react-router-dom';
 
-import {contractProfile as contractProfileAction, contractFunction as contractFunctionAction} from '../actions';
+import {
+  contractProfile as contractProfileAction,
+  contractFunction as contractFunctionAction,
+  ethGas as ethGasAction
+} from '../actions';
 import ContractFunctions from '../components/ContractFunctions';
 import DataWrapper from "../components/DataWrapper";
-import {getContractProfile, getContractFunctions} from "../reducers/selectors";
+import GasStation from "../components/GasStation";
+import {getContractProfile, getContractFunctions, getGasStats} from "../reducers/selectors";
 
 class ContractFunctionsContainer extends Component {
   componentDidMount() {
     this.props.fetchContractProfile(this.props.match.params.contractName);
+    this.props.fetchEthGas();
   }
 
   render() {
     return (
+      <React.Fragment>
         <DataWrapper shouldRender={this.props.contractProfile !== undefined}
                      {...this.props}
                      render={({contractProfile, contractFunctions, postContractFunction}) => (
@@ -22,6 +29,13 @@ class ContractFunctionsContainer extends Component {
                                           contractFunctions={contractFunctions}
                                           postContractFunction={postContractFunction}/>
                      )}/>
+
+        <DataWrapper shouldRender={this.props.gasStats !== undefined}
+                     {...this.props}
+                     render={({gasStats}) => (
+                       <GasStation gasStats={gasStats}/>
+                     )}/>
+      </React.Fragment>
     );
   }
 }
@@ -30,6 +44,7 @@ function mapStateToProps(state, props) {
   return {
     contractProfile: getContractProfile(state, props.match.params.contractName),
     contractFunctions: getContractFunctions(state, props.match.params.contractName),
+    gasStats: getGasStats(state),
     error: state.errorMessage,
     loading: state.loading
   };
@@ -41,6 +56,7 @@ ContractFunctionsContainer.propTypes = {
   contractFunctions: PropTypes.arrayOf(PropTypes.object),
   postContractFunction: PropTypes.func,
   fetchContractProfile: PropTypes.func,
+  fetchEthGas: PropTypes.func,
   error: PropTypes.string
 };
 
@@ -48,6 +64,7 @@ export default withRouter(connect(
   mapStateToProps,
   {
     fetchContractProfile: contractProfileAction.request,
-    postContractFunction: contractFunctionAction.post
+    postContractFunction: contractFunctionAction.post,
+    fetchEthGas: ethGasAction.request
   }
 )(ContractFunctionsContainer));