topic-democracy/app/TopicDemocracy.jsx

89 lines
2.4 KiB
JavaScript

import React from 'react';
import ReactDOM from 'react-dom';
import EmbarkJS from 'Embark/EmbarkJS';
import Delegation from 'Embark/contracts/Delegation';
import { HashRouter, Route, Redirect, Link } from "react-router-dom";
import './TopicDemocracy.css';
import DelegationUI from './components/DelegationUI';
import DelegationFactoryUI from './components/DelegationFactoryUI';
import { CssBaseline, AppBar, Toolbar, Typography, withStyles } from '@material-ui/core';
const styles = theme => ({
appBar: {
position: 'relative',
},
layout: {
width: 'auto',
marginLeft: theme.spacing.unit * 2,
marginRight: theme.spacing.unit * 2,
[theme.breakpoints.up(600 + theme.spacing.unit * 2 * 2)]: {
width: 600,
marginLeft: 'auto',
marginRight: 'auto',
},
},
})
class TopicDemocracy extends React.Component {
constructor(props) {
super(props);
//this.handleSelect = this.handleSelect.bind(this);
this.state = {
error: null,
defaultAccount: null
};
}
componentDidMount() {
EmbarkJS.onReady((err) => {
if (err) {
return this.setState({ error: err.message || err });
}
this.setState({ defaultAccount: web3.eth.defaultAccount, blockchainEnabled: true })
});
}
render() {
const { classes } = this.props;
const { blockchainEnabled, defaultAccount } = this.state;
if (!blockchainEnabled) {
return (
<div>Waiting for blockchain.</div>
)
}
if (!defaultAccount) {
return (
<div>Waiting for account.</div>
)
}
return (
<HashRouter hashType="noslash">
<CssBaseline />
<AppBar position="absolute" color="default" className={classes.appBar}>
<Toolbar>
<Typography variant="h6" color="inherit" noWrap>
Topic Democracy
</Typography>
</Toolbar>
</AppBar>
<main className={classes.layout}>
<Route exact path="/" render={({ match }) => (
<DelegationFactoryUI account={defaultAccount} />
)} />
<Route path="/:address" render={({ match }) => (
<DelegationUI account={defaultAccount} Delegation={new EmbarkJS.Blockchain.Contract({ abi: Delegation._jsonInterface, address: match.params.address }) } />
)} />
</main>
</HashRouter>
)
}
}
export default withStyles(styles)(TopicDemocracy);