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

Added payable functionality

This commit is contained in:
Richard Ramos 2018-05-11 14:16:27 -04:00 committed by Pascal Precht
parent c562128365
commit 435b18d074
No known key found for this signature in database
GPG Key ID: 0EE28D8D6FD85D7D
1 changed files with 36 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -3,7 +3,7 @@ import {{contractName}} from 'Embark/contracts/{{contractName}}';
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import { FormGroup, ControlLabel, FormControl, Checkbox, Button, Alert } from 'react-bootstrap'; import { FormGroup, ControlLabel, FormControl, Checkbox, Button, Alert, InputGroup } from 'react-bootstrap';
{{#each functions}} {{#each functions}}
@ -18,12 +18,14 @@ class {{capitalize name}}_{{@index}}_Form extends React.Component {
{{/each}} {{/each}}
}, },
{{/if}} {{/if}}
{{#if payable}}
value: 0,
{{/if}}
{{#ifview stateMutability}} {{#ifview stateMutability}}
output: null, output: null,
{{/ifview}} {{/ifview}}
error: null, error: null,
mined: null, mined: null
loading: false
}; };
} }
@ -39,8 +41,8 @@ class {{capitalize name}}_{{@index}}_Form extends React.Component {
async handleClick(e){ async handleClick(e){
e.preventDefault(); e.preventDefault();
this.setState({output: null, error: null, receipt: null, loading: true}); this.setState({output: null, error: null, receipt: null});
try { try {
{{#ifview stateMutability}} {{#ifview stateMutability}}
{{../contractName}}.methods{{methodname ../functions name inputs}}({{#each inputs}}this.state.input.{{name}}{{#unless @last}}, {{/unless}}{{/each}}) {{../contractName}}.methods{{methodname ../functions name inputs}}({{#each inputs}}this.state.input.{{name}}{{#unless @last}}, {{/unless}}{{/each}})
@ -51,31 +53,34 @@ class {{capitalize name}}_{{@index}}_Form extends React.Component {
{{#each outputs}} {{#each outputs}}
{{emptyname name @index}}: result[{{@index}}]{{#unless @last}},{{/unless}} {{emptyname name @index}}: result[{{@index}}]{{#unless @last}},{{/unless}}
{{/each}} {{/each}}
}, loading: false}); }});
{{else}} {{else}}
this.setState({output: result, loading: false}); this.setState({output: result});
{{/iflengthgt}} {{/iflengthgt}}
}) })
.catch((err) => { .catch((err) => {
this.setState({error: err.message, loading: false}); this.setState({error: err.message});
}); });
{{else}} {{else}}
{{../contractName}}.methods{{methodname ../functions name inputs}}({{#each inputs}}this.state.input.{{name}}{{#unless @last}}, {{/unless}}{{/each}}) {{../contractName}}.methods{{methodname ../functions name inputs}}({{#each inputs}}this.state.input.{{name}}{{#unless @last}}, {{/unless}}{{/each}})
.send({ .send({
{{#if payable}}
value: this.state.value,
{{/if}}
from: web3.eth.defaultAccount from: web3.eth.defaultAccount
}) })
.then((_receipt) => { .then((_receipt) => {
console.log(_receipt); console.log(_receipt);
this.setState({receipt: _receipt, loading: false}) this.setState({receipt: _receipt})
}) })
.catch((err) => { .catch((err) => {
console.log(err); console.log(err);
this.setState({error: err.message, loading: false}); this.setState({error: err.message});
}); });
// TODO payable // TODO payable
{{/ifview}} {{/ifview}}
} catch(err) { } catch(err) {
this.setState({error: err.message, loading: false}); this.setState({error: err.message});
} }
// TODO validate // TODO validate
@ -104,13 +109,28 @@ class {{capitalize name}}_{{@index}}_Form extends React.Component {
</FormGroup> </FormGroup>
{{/each}} {{/each}}
{{/if}} {{/if}}
{{#if payable}}
<FormGroup>
<ControlLabel>Value</ControlLabel>
<InputGroup>
<InputGroup.Addon>Ξ</InputGroup.Addon>
<FormControl
type="text"
defaultValue={ this.state.value }
placeholder="{{type}}"
onChange={(e) => { this.setState({value: e.target.value}); }}
/>
<InputGroup.Addon>wei</InputGroup.Addon>
</InputGroup>
</FormGroup>
{{/if}}
{ {
this.state.error != null ? this.state.error != null ?
<Alert bsStyle="danger">{this.state.error}</Alert> <Alert bsStyle="danger">{this.state.error}</Alert>
: '' : ''
} }
{{#ifview stateMutability}} {{#ifview stateMutability}}
<Button disabled={this.state.loading} 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 ? this.state.output != null ?
<React.Fragment> <React.Fragment>
@ -128,10 +148,12 @@ class {{capitalize name}}_{{@index}}_Form extends React.Component {
: '' : ''
} }
{{else}} {{else}}
<Button disabled={this.state.loading} type="submit" bsStyle="primary" onClick={(e) => this.handleClick(e)}>{this.state.loading ? 'Sending...' : 'Send'}</Button> <Button type="submit" bsStyle="primary" onClick={(e) => this.handleClick(e)}>Send</Button>
{ {
this.state.receipt != null ? this.state.receipt != null ?
<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>
<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>
: '' : ''
} }
{{/ifview}} {{/ifview}}