contracts/app/dapp.js

82 lines
2.3 KiB
JavaScript
Raw Permalink Normal View History

2018-05-13 01:31:01 -03:00
import React from 'react';
2019-03-28 20:10:02 -03:00
import ReactDOM from 'react-dom';
import {Tabs, Tab} from 'react-bootstrap';
2018-05-13 01:31:01 -03:00
import EmbarkJS from 'Embark/EmbarkJS';
2019-02-13 01:04:02 -02:00
import TestStatusNetworkUI from './components/TestStatusNetwork';
2018-05-13 01:31:01 -03:00
import './dapp.css';
2019-03-28 20:10:02 -03:00
class App extends React.Component {
2018-05-13 01:31:01 -03:00
constructor(props) {
super(props);
2019-03-28 20:10:02 -03:00
this.handleSelect = this.handleSelect.bind(this);
this.state = {
error: null,
activeKey: 1,
whisperEnabled: false,
storageEnabled: false,
blockchainEnabled: false
};
2018-05-13 01:31:01 -03:00
}
2019-03-28 20:10:02 -03:00
componentDidMount() {
EmbarkJS.onReady((err) => {
this.setState({blockchainEnabled: true});
if (err) {
// If err is not null then it means something went wrong connecting to ethereum
// you can use this to ask the user to enable metamask for e.g
return this.setState({error: err.message || err});
}
2019-03-28 20:10:02 -03:00
EmbarkJS.Messages.Providers.whisper.getWhisperVersion((err, _version) => {
if (err) {
return console.log(err);
}
this.setState({whisperEnabled: true});
});
2018-05-13 01:31:01 -03:00
2019-03-28 20:10:02 -03:00
EmbarkJS.Storage.isAvailable().then((result) => {
this.setState({storageEnabled: result});
}).catch(() => {
this.setState({storageEnabled: false});
});
});
}
2018-05-13 01:31:01 -03:00
2018-05-17 16:53:23 -03:00
_renderStatus(title, available) {
2018-05-13 01:31:01 -03:00
let className = available ? 'pull-right status-online' : 'pull-right status-offline';
return <React.Fragment>
2019-03-28 20:10:02 -03:00
{title}
2018-05-13 01:31:01 -03:00
<span className={className}></span>
</React.Fragment>;
}
2019-03-28 20:10:02 -03:00
handleSelect(key) {
this.setState({ activeKey: key });
}
2019-01-12 11:42:31 -02:00
2019-03-28 20:10:02 -03:00
render() {
const ensEnabled = EmbarkJS.Names.currentNameSystems && EmbarkJS.Names.isAvailable();
if (this.state.error) {
return (<div>
<div>Something went wrong connecting to ethereum. Please make sure you have a node running or are using metamask to connect to the ethereum network:</div>
<div>{this.state.error}</div>
2018-05-17 16:53:23 -03:00
</div>);
2019-03-28 20:10:02 -03:00
}
return (<div>
<h3>Status Network - Test </h3>
<Tabs onSelect={this.handleSelect} activeKey={this.state.activeKey} id="uncontrolled-tab-example">
<Tab eventKey={1} title={this._renderStatus('StatusNetwork', this.state.blockchainEnabled)}>
<TestStatusNetworkUI />
</Tab>
</Tabs>
</div>);
2018-05-13 01:31:01 -03:00
}
}
2019-03-28 20:10:02 -03:00
ReactDOM.render(<App></App>, document.getElementById('app'));