handle busy state

This commit is contained in:
Richard Ramos 2019-03-09 10:47:26 -04:00
parent 8c69fbf792
commit 25f0956b95

View File

@ -71,6 +71,7 @@ class App extends React.Component {
state = { state = {
error: null, error: null,
busy: true,
selectedContributors: [], selectedContributors: [],
contributorList: [], contributorList: [],
currentContributor: { currentContributor: {
@ -97,11 +98,12 @@ class App extends React.Component {
componentDidMount() { componentDidMount() {
EmbarkJS.onReady(async (err) => { EmbarkJS.onReady(async (err) => {
// TODO: check for chain // TODO: check for chain
this.setState({blockchainEnabled: true});
if (err) { if (err) {
return this.setState({error: err.message || err}); return this.setState({error: err.message || err});
} }
this.setState({busy: false});
this.getCurrentContributorData(); this.getCurrentContributorData();
this.getContributors(); this.getContributors();
@ -173,6 +175,8 @@ class App extends React.Component {
} }
try { try {
this.setState({busy: true});
const estimatedGas = await toSend.estimateGas({from: web3.eth.defaultAccount}); const estimatedGas = await toSend.estimateGas({from: web3.eth.defaultAccount});
const receipt = await toSend.send({from: web3.eth.defaultAccount, gas: estimatedGas + 1000}); const receipt = await toSend.send({from: web3.eth.defaultAccount, gas: estimatedGas + 1000});
@ -181,6 +185,8 @@ class App extends React.Component {
} catch(e) { } catch(e) {
console.log('tx failed? got enough tokens to award?'); console.log('tx failed? got enough tokens to award?');
console.log(e); console.log(e);
} finally {
this.setState({busy: false});
} }
} }
@ -201,17 +207,21 @@ class App extends React.Component {
const toSend = Meritocracy.methods.withdraw(); const toSend = Meritocracy.methods.withdraw();
try { try {
this.setState({busy: true});
const estimatedGas = await toSend.estimateGas({from: web3.eth.defaultAccount}); const estimatedGas = await toSend.estimateGas({from: web3.eth.defaultAccount});
const receipt = await toSend.send({from: web3.eth.defaultAccount, gas: estimatedGas + 1000}); const receipt = await toSend.send({from: web3.eth.defaultAccount, gas: estimatedGas + 1000});
this.getCurrentContributorData(); this.getCurrentContributorData();
} catch(e) { } catch(e) {
console.log('tx failed? Did you allocate all your tokens first?'); console.log('tx failed? Did you allocate all your tokens first?');
} finally {
this.setState({busy: false});
} }
} }
render() { render() {
const { selectedContributors, contributorList, award, currentContributor } = this.state; const { selectedContributors, contributorList, award, currentContributor, busy } = this.state;
if (this.state.error) { if (this.state.error) {
return (<div> return (<div>
@ -235,20 +245,21 @@ class App extends React.Component {
onChange={this.handleContributorSelection} onChange={this.handleContributorSelection}
options={contributorList} options={contributorList}
placeholder="Choose Contributor(s)..." placeholder="Choose Contributor(s)..."
isDisabled={busy}
/> />
<span>Your Allocatable Kudos: { currentContributor.allocation } SNT</span> <br/> <span>Your Allocatable Kudos: { currentContributor.allocation } SNT</span> <br/>
<br/> <br/>
<NumericInput mobile step={5} min={0} max={maxAllocation} onChange={this.handleAwardChange} defaultValue={award} /> <br/> <NumericInput mobile step={5} min={0} max={maxAllocation} onChange={this.handleAwardChange} defaultValue={award} disabled={busy} /> <br/>
<input placeholder="Enter your praise..." onChange={this.handlePraiseChange}/> <br/> <input disabled={busy} placeholder="Enter your praise..." onChange={this.handlePraiseChange}/> <br/>
<span> Total Awarding: {award * selectedContributors.length} SNT </span> <br/> <span> Total Awarding: {award * selectedContributors.length} SNT </span> <br/>
<Button variant="outline-primary" onClick={this.awardTokens}>Award</Button> <Button disabled={busy} variant="outline-primary" onClick={this.awardTokens}>Award</Button>
<h4>Your Kudos History</h4> <h4>Your Kudos History</h4>
<span>Your Received Kudos: <b>{ currentContributor.received } SNT</b> <Button variant="outline-primary" onClick={this.withdrawTokens}>Withdraw</Button></span> <br/> <span>Your Received Kudos: <b>{ currentContributor.received } SNT</b> <Button variant="outline-primary" onClick={this.withdrawTokens} disabled={busy}>Withdraw</Button></span> <br/>
<Grid> <Grid>
<Row> <Row>
<Col>0x00 has sent you 500 SNT "keep up the good work"</Col> <Col>0x00 has sent you 500 SNT "keep up the good work"</Col>