status-im
/
embark-area-51
mirror of https://github.com/status-im/embark-area-51.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Changing promises to async and created consts

This commit is contained in:
Richard Ramos 2018-10-05 15:57:00 -04:00 committed by Pascal Precht
parent b93d2d1145
commit d3961783b4
No known key found for this signature in database
GPG Key ID: 0EE28D8D6FD85D7D
1 changed files with 44 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

100
lib/modules/scaffolding-react/templates/dapp.js.tpl
View File

@ -1,13 +1,13 @@
import EmbarkJS from 'Embark/EmbarkJS';
import {{contractName}} from 'Embark/contracts/{{contractName}}';
import React from 'react';
import React, { Component, Fragment } from 'react';
import ReactDOM from 'react-dom';
import { FormGroup, ControlLabel, FormControl, Checkbox, Button, Alert, InputGroup } from 'react-bootstrap';
{{#each functions}}
class {{capitalize name}}Form{{@index}} extends React.Component {
class {{capitalize name}}Form{{@index}} extends Component {
constructor(props){
super(props);
this.state = {
@ -45,45 +45,42 @@ class {{capitalize name}}Form{{@index}} extends React.Component {
try {
{{#ifview stateMutability}}
{{../contractName}}.methods{{methodname ../functions name inputs}}({{#each inputs}}this.state.input.{{name}}{{#unless @last}}, {{/unless}}{{/each}})
.call()
.then((result) => {
const result = await {{../contractName}}.methods{{methodname ../functions name inputs}}({{#each inputs}}this.state.input.{{name}}{{#unless @last}}, {{/unless}}{{/each}}).call()
{{#iflengthgt outputs 1}}
this.setState({output: {
this.setState({output: {
{{#each outputs}}
{{emptyname name @index}}: result[{{@index}}]{{#unless @last}},{{/unless}}
{{emptyname name @index}}: result[{{@index}}]{{#unless @last}},{{/unless}}
{{/each}}
}});
}});
{{else}}
this.setState({output: result});
{{/iflengthgt}}
})
.catch((err) => {
this.setState({error: err.message});
});
this.setState({output: result});
{{/iflengthgt}}
{{else}}
{{../contractName}}.methods{{methodname ../functions name inputs}}({{#each inputs}}this.state.input.{{name}}{{#unless @last}}, {{/unless}}{{/each}})
.send({
{{#if payable}}
value: this.state.value,
{{/if}}
from: web3.eth.defaultAccount
})
.then((_receipt) => {
console.log(_receipt);
this.setState({receipt: _receipt})
})
.catch((err) => {
console.log(err);
this.setState({error: err.message});
});
const toSend = {{../contractName}}.methods{{methodname ../functions name inputs}}({{#each inputs}}this.state.input.{{name}}{{#unless @last}}, {{/unless}}{{/each}});
const estimatedGas = await toSend.estimateGas({from: web3.eth.defaultAccount});
const receipt = await toSend.send({
{{#if payable}}
value: this.state.value,
{{/if}}
from: web3.eth.defaultAccount,
gasLimit: estimatedGas
});
console.log(receipt);
this.setState({receipt});
{{/ifview}}
} catch(err) {
console.error(err);
this.setState({error: err.message});
}
}
render(){
const {input, value, error, output, receipt} = this.state;
return <div className="formSection">
<h3>{{name}}</h3>
<form>
@ -98,7 +95,7 @@ class {{capitalize name}}Form{{@index}} extends React.Component {
{{else}}
<FormControl
type="text"
defaultValue={ this.state.input.{{name}} }
defaultValue={ input.{{name}} }
placeholder="{{type}}"
onChange={(e) => this.handleChange(e, '{{name}}')}
/>
@ -113,7 +110,7 @@ class {{capitalize name}}Form{{@index}} extends React.Component {
<InputGroup.Addon>Ξ</InputGroup.Addon>
<FormControl
type="text"
defaultValue={ this.state.value }
defaultValue={ value }
placeholder="{{type}}"
onChange={(e) => { this.setState({value: e.target.value}); }}
/>
@ -121,37 +118,34 @@ class {{capitalize name}}Form{{@index}} extends React.Component {
</InputGroup>
</FormGroup>
{{/if}}
{
this.state.error != null ?
<Alert bsStyle="danger">{this.state.error}</Alert>
: ''
}
{ error != null && <Alert bsStyle="danger">{error}</Alert> }
{{#ifview stateMutability}}
<Button type="submit" bsStyle="primary" onClick={(e) => this.handleClick(e)}>Call</Button>
{
this.state.output != null ?
<React.Fragment>
output &&
<Fragment>
<h4>Results</h4>
{{#iflengthgt outputs 1}}
<ul>
{{#each outputs}}
<li>{{emptyname name @index}}: { this.state.output.{{emptyname name @index}} }</li>
<li>{{emptyname name @index}}: { output.{{emptyname name @index}} }</li>
{{/each}}
</ul>
{{else}}
{this.state.output.toString()}
{output.toString()}
{{/iflengthgt}}
</React.Fragment>
: ''
</Fragment>
}
{{else}}
<Button type="submit" bsStyle="primary" onClick={(e) => this.handleClick(e)}>Send</Button>
{
this.state.receipt != null ?
<React.Fragment>
<Alert bsStyle={this.state.receipt.status == "0x1" ? 'success' : 'danger'}>{this.state.receipt.status == "0x1" ? 'Success' : 'Failure / Revert'} - Transaction Hash: {this.state.receipt.transactionHash}</Alert>
</React.Fragment>
: ''
receipt &&
<Fragment>
<Alert bsStyle={receipt.status == "0x1" ? 'success' : 'danger'}>{receipt.status == "0x1" ? 'Success' : 'Failure / Revert'} - Transaction Hash: {receipt.transactionHash}</Alert>
</Fragment>
}
{{/ifview}}
</form>
@ -161,8 +155,7 @@ class {{capitalize name}}Form{{@index}} extends React.Component {
{{/each}}
class {{contractName}}UI extends React.Component {
class {{contractName}}UI extends Component {
constructor (props) {
super(props);
this.state = {
@ -171,6 +164,7 @@ class {{contractName}}UI extends React.Component {
render(){
return (<div>
<h1>{{title}}</h1>
{{#each functions}}
<{{capitalize name}}Form{{@index}} />
{{/each}}
@ -179,10 +173,4 @@ class {{contractName}}UI extends React.Component {
}
ReactDOM.render(<div>
<h1>{{title}}</h1>
<{{contractName}}UI />
</div>,
document.getElementById('app')
);
ReactDOM.render(<{{contractName}}UI />, document.getElementById('app'));