add network indicator

This commit is contained in:
Barry Gitarts 2018-06-19 15:05:42 -04:00
parent 10500ac171
commit 8d9dae20c6
3 changed files with 23 additions and 8 deletions

View File

@ -81,7 +81,7 @@ const tooltip = (
const TokenPermissions = (props) => ( const TokenPermissions = (props) => (
<Fragment> <Fragment>
<OverlayTrigger placement="right" overlay={tooltip}> <OverlayTrigger placement="top" overlay={tooltip}>
<h3>Token Permissions</h3> <h3>Token Permissions</h3>
</OverlayTrigger> </OverlayTrigger>
<hr/> <hr/>

View File

@ -12,9 +12,20 @@ import ENSSubdomainRegistry from 'Embark/contracts/ENSSubdomainRegistry';
import NameLookup from './components/ens/nameLookup'; import NameLookup from './components/ens/nameLookup';
import AdminMode from './components/AdminMode'; import AdminMode from './components/AdminMode';
import TokenPermissions from './components/standard/TokenPermissionConnect'; import TokenPermissions from './components/standard/TokenPermissionConnect';
import web3 from "Embark/web3";
import Paper from '@material-ui/core/Paper';
import Typography from '@material-ui/core/Typography';
import './dapp.css'; import './dapp.css';
const { getNetworkType } = web3.eth.net;
const symbols = {
'ropsten': 'STT',
'private': 'SNT',
'main': 'SNT'
}
class App extends React.Component { class App extends React.Component {
constructor(props) { constructor(props) {
super(props) super(props)
@ -23,6 +34,7 @@ class App extends React.Component {
componentDidMount(){ componentDidMount(){
__embarkContext.execWhenReady(() => { __embarkContext.execWhenReady(() => {
getNetworkType().then(network => { this.setState({ network })});
}); });
} }
@ -37,7 +49,7 @@ class App extends React.Component {
} }
render() { render() {
const { admin } = this.state; const { admin, network } = this.state;
return ( return (
<div> <div>
<div style={{ display: admin ? 'block' : 'none' }} > <div style={{ display: admin ? 'block' : 'none' }} >
@ -45,10 +57,13 @@ class App extends React.Component {
</div> </div>
{!admin && {!admin &&
<Fragment> <Fragment>
<Paper elevation={4}>
<Typography style={{ fontSize: '2.5rem', padding: '0.5%', textAlign: 'center' }} variant="headline" component="h3"><i style={{ fontSize: '1rem' }}>network </i>{network}</Typography>
</Paper>
<NameLookup /> <NameLookup />
<div style={{ textAlign: 'center', marginTop: '10%' }}> <div style={{ textAlign: 'center' }}>
<TokenPermissions <TokenPermissions
symbol='SNT' symbol={symbols[network] || 'SNT'}
spender={ENSSubdomainRegistry._address} spender={ENSSubdomainRegistry._address}
methods={TestToken.methods} /> methods={TestToken.methods} />
<hr/> <hr/>

View File

@ -10,10 +10,10 @@ const StyledCard = styled.div`
border: ${({ border }) => border || `1px solid ${theme.contentBorder}`}; border: ${({ border }) => border || `1px solid ${theme.contentBorder}`};
border-radius: 3px; border-radius: 3px;
min-height: 30vh; min-height: 30vh;
${media.desktop`margin-top: 10%;`} ${media.desktop`margin-top: 5%;`}
${media.giant`margin-top: 10%;`} ${media.giant`margin-top: 5%;`}
${media.tablet`margin-top: 50%;`} ${media.tablet`margin-top: 25%;`}
${media.phone`margin-top: 50%;`} ${media.phone`margin-top: 25%;`}
` `
export default StyledCard export default StyledCard