83 lines
2.2 KiB
JavaScript
83 lines
2.2 KiB
JavaScript
import React from 'react';
|
|
import ContractContext from './contract-context';
|
|
import CardAlert from './card-alert';
|
|
|
|
class AccountList extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
error: false,
|
|
errorMessage: "",
|
|
accounts: []
|
|
};
|
|
|
|
this.handleClick = this.handleClick.bind(this);
|
|
this.handleCopyClick = this.handleCopyClick.bind(this);
|
|
}
|
|
|
|
|
|
handleClick(e, updateAccountsCallback) {
|
|
e.preventDefault();
|
|
|
|
try {
|
|
updateAccountsCallback();
|
|
} catch (err) {
|
|
this.setState({
|
|
error: true,
|
|
errorMessage: e.name + ': ' + e.message
|
|
});
|
|
}
|
|
|
|
}
|
|
|
|
handleCopyClick(e) {
|
|
e.preventDefault();
|
|
|
|
var dummy = document.createElement("input");
|
|
document.body.appendChild(dummy);
|
|
dummy.setAttribute('value', "await web3.eth.getAccounts();");
|
|
dummy.select();
|
|
document.execCommand("copy");
|
|
document.body.removeChild(dummy);
|
|
}
|
|
|
|
render() {
|
|
return <ContractContext.Consumer>
|
|
{(context) => (
|
|
|
|
<div className="card function">
|
|
<div className="card-header">
|
|
<h3 className="card-title">Get Accounts</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.errorMessage}/>
|
|
<div className="card-body row">
|
|
<div className="col-md-11">
|
|
<code>
|
|
await web3.eth.getAccounts();
|
|
<input type="text" id="accountsTxt"/>
|
|
</code>
|
|
</div>
|
|
<div className="col-md-1">
|
|
<button className="btn btn-primary ml-auto"
|
|
onClick={event => this.handleClick(event, context.updateAccounts)}>⏎</button>
|
|
</div>
|
|
</div>
|
|
<div className="card-footer">
|
|
<p><tt>accounts</tt> variable is available in the console</p>
|
|
<ul>
|
|
{
|
|
context.accounts.map((account, i) => <li key={i}>{account}</li>)
|
|
}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
)}
|
|
</ContractContext.Consumer>;
|
|
}
|
|
}
|
|
|
|
export default AccountList;
|