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

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

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