mirror of https://github.com/embarklabs/embark.git
136 lines
6.1 KiB
JavaScript
136 lines
6.1 KiB
JavaScript
class FunctionForm extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
fields: {},
|
|
error: false,
|
|
message: null,
|
|
receipt: null
|
|
};
|
|
|
|
this.child = React.createRef();
|
|
|
|
this.showResults = this.showResults.bind(this);
|
|
this.handleCopyClick = this.handleCopyClick.bind(this);
|
|
}
|
|
|
|
handleCopyClick(e){
|
|
this.child.current.copyCommand(e);
|
|
}
|
|
|
|
_getFunctionParamFields(elem){
|
|
if(this.props.abi.type == 'fallback') return '';
|
|
|
|
return '(' + this.props.abi.inputs
|
|
.map((input, i) => <input type="text" data-var-type={input.type} data-type="inputParam" data-name={input.name} placeholder={input.name} title={input.type + ' ' + input.name} size={input.name.length} />)
|
|
.join(', ') + ')';
|
|
}
|
|
|
|
_getMethodType(elem){
|
|
return (this.props.abi.constant == true || this.props.abi.stateMutability == 'view' || this.props.abi.stateMutability == 'pure') ? 'call' : 'send';
|
|
}
|
|
|
|
render(){
|
|
const functionName = this.props.abi.name;
|
|
const isDuplicated = this.props.contract.options.jsonInterface.filter(x => x.name == functionName).length > 1;
|
|
const contract = this.props.contract;
|
|
const receipt = this.state.receipt;
|
|
|
|
return <div className="card function">
|
|
|
|
<div className="card-header">
|
|
<h3 className="card-title">{this.props.abi.type == 'function' ? this.props.abi.name : (this.props.abi.type == 'fallback' ? '(fallback)' : this.props.abi.name)}</h3>
|
|
<div className="card-options">
|
|
<a href="#" onClick={this.handleCopyClick} title="Copy to clipboard"><i className="fe fe-copy"></i></a>
|
|
</div>
|
|
</div>
|
|
|
|
<CardAlert show={this.state.error} message={this.state.message} />
|
|
|
|
<div className="card-body row">
|
|
<Function ref={this.child} definition={this.props.definition} contract={this.props.contract} contractName={this.props.contractName} duplicated={isDuplicated} abi={this.props.abi} resultHandler={this.showResults} />
|
|
</div>
|
|
{
|
|
receipt != null || !this.state.error && this.state.message != null
|
|
?
|
|
<div className="card-footer">
|
|
{ receipt != null ?
|
|
<ul>
|
|
<li>Status: {receipt.status}</li>
|
|
<li>Transaction Hash: {receipt.transactionHash}</li>
|
|
{
|
|
receipt.events != null ?
|
|
<li>Events:
|
|
<ul>
|
|
{
|
|
Object.keys(receipt.events).map(function(ev, index) {
|
|
if(!isNaN(ev)) return null;
|
|
const eventAbi = contract.options.jsonInterface.filter(x => x.name == ev)[0];
|
|
let props = [];
|
|
for(let prop in receipt.events[ev].returnValues){
|
|
if(isNaN(prop)){
|
|
let input = eventAbi.inputs.filter(x => x.name == prop)[0];
|
|
props.push(prop + ': '
|
|
+ (input.type.indexOf('int') == -1 ? '"' : '')
|
|
+ receipt.events[ev].returnValues[prop]
|
|
+ (input.type.indexOf('int') == -1 ? '"' : ''));
|
|
}
|
|
}
|
|
return <li key={index}>{ev}({props.join(', ')})</li>;
|
|
})
|
|
}
|
|
</ul>
|
|
</li>
|
|
: ''
|
|
}
|
|
</ul>
|
|
: ""
|
|
}
|
|
{
|
|
!this.state.error && this.state.message != null
|
|
?
|
|
<React.Fragment>{
|
|
(this.state.message !== null && typeof this.state.message === 'object')
|
|
?
|
|
(
|
|
<ul>
|
|
{
|
|
this.props.abi.outputs.filter(x => x.name !== "").length > 0
|
|
?
|
|
Object.keys(this.state.message).map((key, index) => {
|
|
if(isNaN(key)){
|
|
return <li key={index}>{key}: {this.state.message[key]}</li>
|
|
} else {
|
|
return '';
|
|
}
|
|
})
|
|
:
|
|
Object.keys(this.state.message).map((key, index) => {
|
|
return <li key={index}>{key}: {this.state.message[key]}</li>
|
|
})
|
|
|
|
}
|
|
</ul>
|
|
)
|
|
:
|
|
(typeof this.state.message === "boolean" ?
|
|
(this.state.message ? 'true' : 'false')
|
|
:
|
|
this.state.message)
|
|
}</React.Fragment>
|
|
: '' }
|
|
|
|
</div>
|
|
: ''
|
|
}
|
|
</div>;
|
|
}
|
|
|
|
showResults(_error, _message, _receipt){
|
|
this.setState({
|
|
error: _error,
|
|
message: _message,
|
|
receipt: _receipt
|
|
})
|
|
}
|
|
} |