From b0ba46a0a924b76b183071593868a1a46d94b8d2 Mon Sep 17 00:00:00 2001 From: emizzle Date: Fri, 24 Aug 2018 21:08:05 +1000 Subject: [PATCH] Fiddle deploy integration Fiddle is properly deploying now, except the source code needs to be saved to the filesystem in order to be recalled later. Fixes for handling errors on deploy and compilation. Update contract state UI for determining state / interface / deployed. --- embark-ui/src/actions/index.js | 4 +- embark-ui/src/components/Contract.js | 72 ++++++++++--------- embark-ui/src/components/ContractLayout.js | 4 +- embark-ui/src/components/Contracts.js | 8 ++- embark-ui/src/components/FiddleResults.js | 71 +++++++++++------- .../src/components/FiddleResultsSummary.js | 61 +++++++++------- embark-ui/src/containers/FiddleContainer.js | 23 +++--- embark-ui/src/reducers/selectors.js | 4 +- embark-ui/src/utils/presentation.js | 19 +++++ lib/modules/contracts_manager/index.js | 35 ++++++++- lib/modules/solidity/index.js | 10 ++- 11 files changed, 205 insertions(+), 106 deletions(-) create mode 100644 embark-ui/src/utils/presentation.js diff --git a/embark-ui/src/actions/index.js b/embark-ui/src/actions/index.js index 327c10d8..fd162838 100644 --- a/embark-ui/src/actions/index.js +++ b/embark-ui/src/actions/index.js @@ -170,14 +170,14 @@ export const ensRecords = { export const FIDDLE = createRequestTypes('FIDDLE'); export const fiddle = { - request: (codeToCompile) => action(FIDDLE[REQUEST], {codeToCompile}), + post: (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}), + post: (compiledCode) => action(FIDDLE_DEPLOY[REQUEST], {compiledCode}), success: (response) => { return action(FIDDLE_DEPLOY[SUCCESS], {fiddleDeploys: [response.contractNames]}); }, diff --git a/embark-ui/src/components/Contract.js b/embark-ui/src/components/Contract.js index a5e22d16..658e6dac 100644 --- a/embark-ui/src/components/Contract.js +++ b/embark-ui/src/components/Contract.js @@ -6,40 +6,46 @@ import { Card, Table } from "tabler-react"; +import {formatContractForDisplay} from '../utils/presentation'; +import {withRouter} from 'react-router-dom'; -const Contract = ({contract}) => ( - - - - - - - - Name - Address - State - - - - - {(contract.name || contract.className)} - {(contract.address || contract.deployedAddress)} - {contract.deploy} - - -
- - - - -); - -Contract.propTypes = { - contract: PropTypes.object +const Contract = ({contract, match}) => { + const contractDisplay = formatContractForDisplay(contract); + return ( + + + + + + + + Name + Address + State + + + + + {(contract.name || contract.className)} + {contractDisplay.address} + {contractDisplay.state} + + +
+ + + + + ); }; -export default Contract; +Contract.propTypes = { + contract: PropTypes.object, + match: PropTypes.object +}; + +export default withRouter(Contract); diff --git a/embark-ui/src/components/ContractLayout.js b/embark-ui/src/components/ContractLayout.js index 930d609c..13360ac9 100644 --- a/embark-ui/src/components/ContractLayout.js +++ b/embark-ui/src/components/ContractLayout.js @@ -17,7 +17,7 @@ import ContractSourceContainer from '../containers/ContractSourceContainer'; const ContractLayout = ({match}) => ( - Contract +  
( icon="corner-left-up" RootComponent={NavLink} > - Back to {match.params.contractName} + Overview ( @@ -28,11 +29,12 @@ const Contracts = ({contracts}) => ( { contracts.map((contract) => { + const contractDisplay = formatContractForDisplay(contract); return ( - + {contract.className} - {contract.address || 'Interface or not set to deploy'} - {contract.deploy ? 'Deployed' : 'Not deployed'} + {contractDisplay.address} + {contractDisplay.state} ); }) diff --git a/embark-ui/src/components/FiddleResults.js b/embark-ui/src/components/FiddleResults.js index f3c58174..5bf2460d 100644 --- a/embark-ui/src/components/FiddleResults.js +++ b/embark-ui/src/components/FiddleResults.js @@ -57,29 +57,51 @@ class FiddleResults extends Component { } render() { - const {warnings, errors, fatal, isLoading, deployedContracts} = this.props; - + const {warnings, errors, fatalFiddle, fatalFiddleDeploy, isLoading, deployedContracts} = this.props; + const hasFatal = fatalFiddle || fatalFiddleDeploy; let renderings = []; - if(fatal){ - renderings.push( - - - - ); - } - else if(isLoading){ + if(isLoading){ renderings.push(
{loadingMessage} ); } - else { - if(hasResult && !errors.length){ - renderings.push( - - Compiled - this.props.onDeployClick(e)} /> - - ); - } - if(errors.length) renderings.push( + if(fatalFiddle) { + renderings.push( - {errors.length} error{errors.length > 1 ? "s" : ""} - - ); - if(warnings.length) renderings.push( - - {warnings.length} warning{warnings.length > 1 ? "s" : ""} + Compilation ); } + + if(fatalFiddleDeploy) { + renderings.push( + + Deployment + + ); + } + + if(errors.length) renderings.push( + + {errors.length} error{errors.length > 1 ? "s" : ""} + + ); + if(warnings.length) renderings.push( + + {warnings.length} warning{warnings.length > 1 ? "s" : ""} + + ); + if(hasResult && !errors.length){ + renderings.push( + + Compiled + this.props.onDeployClick(e)} /> + + ); + } + return (
{renderings} @@ -55,7 +63,8 @@ FiddleResultsSummary.propTypes = { isLoading: PropTypes.bool, loadingMessage: PropTypes.string, hasResult: PropTypes.bool, - fatal: PropTypes.string, + fatalFiddle: PropTypes.string, + fatalFiddleDeploy: PropTypes.string, onDeployClick: PropTypes.func }; diff --git a/embark-ui/src/containers/FiddleContainer.js b/embark-ui/src/containers/FiddleContainer.js index 6e9ed8e5..9dc41067 100644 --- a/embark-ui/src/containers/FiddleContainer.js +++ b/embark-ui/src/containers/FiddleContainer.js @@ -82,7 +82,7 @@ class FiddleContainer extends Component { } render() { - const {fiddle, loading, error, deployedContracts} = this.props; + const {fiddle, loading, fiddleError, fiddleDeployError, deployedContracts} = this.props; const {loadingMessage} = this.state; let renderings = []; let warnings = []; @@ -99,7 +99,8 @@ class FiddleContainer extends Component { isLoading={loading} loadingMessage={loadingMessage} hasResult={Boolean(fiddle)} - fatal={error} + fatalFiddle={fiddleError} + fatalFiddleDeploy={fiddleDeployError} onDeployClick={(e) => this._onDeployClick(e)} /> ); - if (fiddle || (this.state.value && error)) { + if (fiddle || (this.state.value && (fiddleError || fiddleDeployError))) { renderings.push( ); @@ -143,23 +145,26 @@ function mapStateToProps(state) { return { fiddle: fiddle.data, deployedContracts: deployedFiddle.data, - error: fiddle.error || deployedFiddle.error, + fiddleError: fiddle.error, + fiddleDeployError: deployedFiddle.error, loading: state.loading }; } FiddleContainer.propTypes = { fiddle: PropTypes.object, - error: PropTypes.string, + fiddleError: PropTypes.string, + fiddleDeployError: PropTypes.string, loading: PropTypes.bool, postFiddle: PropTypes.func, - postFiddleDeploy: PropTypes.func + postFiddleDeploy: PropTypes.func, + deployedContracts: PropTypes.object }; export default connect( mapStateToProps, { - postFiddle: fiddleAction.request, - postFiddleDeploy: fiddleDeployAction.request + postFiddle: fiddleAction.post, + postFiddleDeploy: fiddleDeployAction.post }, )(FiddleContainer); diff --git a/embark-ui/src/reducers/selectors.js b/embark-ui/src/reducers/selectors.js index 847f59ba..9887a181 100644 --- a/embark-ui/src/reducers/selectors.js +++ b/embark-ui/src/reducers/selectors.js @@ -107,14 +107,14 @@ export function getMessages(state) { export function getFiddle(state) { return { data: _.last(state.entities.fiddles), - error: _.last(state.errorEntities.fiddles) + error: state.errorEntities.fiddles }; } export function getFiddleDeploy(state) { return { data: _.last(state.entities.fiddleDeploys), - error: _.last(state.errorEntities.fiddleDeploys) + error: state.errorEntities.fiddleDeploys }; } diff --git a/embark-ui/src/utils/presentation.js b/embark-ui/src/utils/presentation.js new file mode 100644 index 00000000..43ff127e --- /dev/null +++ b/embark-ui/src/utils/presentation.js @@ -0,0 +1,19 @@ +export function formatContractForDisplay(contract) { + let address = (contract.address || contract.deployedAddress); + let state = 'Deployed'; + let stateColor = 'success'; + if (contract.deploy === false) { + address = 'Interface or set to not deploy'; + state = 'N/A'; + stateColor = 'info'; + } else if (contract.error) { + address = contract.error; + state = 'Error'; + stateColor = 'danger'; + } else if (!address) { + address = '...'; + state = 'Pending'; + stateColor = 'warning'; + } + return {address, state, stateColor}; +} diff --git a/lib/modules/contracts_manager/index.js b/lib/modules/contracts_manager/index.js index b2a05ca8..2ffa1118 100644 --- a/lib/modules/contracts_manager/index.js +++ b/lib/modules/contracts_manager/index.js @@ -1,6 +1,7 @@ let toposort = require('toposort'); let async = require('async'); const cloneDeep = require('clone-deep'); +const _ = require('lodash'); let utils = require('../../utils/utils.js'); @@ -169,22 +170,44 @@ class ContractsManager { 'post', '/embark-api/contract/deploy', (req, res) => { + this.logger.trace(`POST request /embark-api/contract/deploy:\n ${JSON.stringify(req.body)}`); self.compiledContracts = Object.assign(self.compiledContracts, req.body.compiledContract); + const contractNames = Object.keys(req.body.compiledContract); self.build((err, _mgr) => { - const responseData = {errors: err, contractNames: Object.keys(req.body.compiledContract)}; + if(err){ + return res.send({error: err.message}); + } + // pick the compiled contracts that have been built + const builtContracts = _.pick(self.contracts, contractNames); + + // for each contract, deploy (in parallel) + async.eachOf(builtContracts, (contract, contractName, callback) => { + contract.args = []; /* TODO: override contract.args */ + contract.className = contractName; + self.events.request("deploy:contract", contract, (err) => { + callback(err); + }); + }, (err) => { + let responseData = {}; + if(err){ + responseData.error = err.message; + } + else responseData.result = contractNames; this.logger.trace(`POST response /embark-api/contract/deploy:\n ${JSON.stringify(responseData)}`); res.send(responseData); - }, false); + }); + }, false, false); } ); } - build(done, useContractFiles = true) { + build(done, useContractFiles = true, resetContracts = true) { let self = this; self.contracts = {}; let compilerOptions = {disableOptimizations: this.disableOptimizations}; + if(resetContracts) self.contracts = {}; async.waterfall([ function loadContractFiles(callback) { self.events.request("config:contractsFiles", (contractsFiles) => { @@ -210,6 +233,12 @@ class ContractsManager { }, function prepareContractsFromConfig(callback) { self.events.emit("status", __("Building...")); + + // if we are appending contracts (ie fiddle), we + // don't need to build a contract from config, so + // we can skip this entirely + if(!resetContracts) return callback(); + let className, contract; for (className in self.contractsConfig.contracts) { contract = self.contractsConfig.contracts[className]; diff --git a/lib/modules/solidity/index.js b/lib/modules/solidity/index.js index ced9c980..ab30cc13 100644 --- a/lib/modules/solidity/index.js +++ b/lib/modules/solidity/index.js @@ -1,5 +1,6 @@ let async = require('../../utils/async_extend.js'); let SolcW = require('./solcW.js'); +const fs = require('../../core/fs'); class Solidity { @@ -19,8 +20,12 @@ class Solidity { 'post', '/embark-api/contract/compile', (req, res) => { - const input = {'fiddler': {content: req.body.code.replace(/\r\n/g, '\n')}}; + const input = {'fiddle': {content: req.body.code.replace(/\r\n/g, '\n')}}; this.compile_solidity_code(input, {}, true, (errors, compilationResult) => { + // write code to filesystem so we can view the source after page refresh + const filePath = `.embark/fiddles/${Object.keys(compilationResult).join('_')}.sol`; + fs.writeFile(filePath, req.body.code, 'utf8'); // async, do not need to wait + const responseData = {errors: errors, compilationResult: compilationResult}; this.logger.trace(`POST response /embark-api/contract/compile:\n ${JSON.stringify(responseData)}`); res.send(responseData); @@ -122,7 +127,8 @@ class Solidity { let contract = json[contractFile][contractName]; const className = contractName; - const filename = contractFile; + let filename = contractFile; + if(filename === 'fiddle') filename = `.embark/fiddles/${className}.sol`; compiled_object[className] = {}; compiled_object[className].code = contract.evm.bytecode.object;