move all routes to maincontainer
This commit is contained in:
parent
53c52dfa69
commit
20de2d202b
|
@ -20,6 +20,7 @@ import ListItemText from '@material-ui/core/ListItemText';
|
||||||
import InboxIcon from '@material-ui/icons/MoveToInbox';
|
import InboxIcon from '@material-ui/icons/MoveToInbox';
|
||||||
import FundsManagement from './FundsManagement'
|
import FundsManagement from './FundsManagement'
|
||||||
import ContractAdmin from './ContractAdmin'
|
import ContractAdmin from './ContractAdmin'
|
||||||
|
import TransferGraph from './TransfersGraph'
|
||||||
|
|
||||||
const drawerWidth = 240
|
const drawerWidth = 240
|
||||||
|
|
||||||
|
@ -156,10 +157,12 @@ class PersistentDrawerLeft extends React.Component {
|
||||||
</Link>
|
</Link>
|
||||||
</List>
|
</List>
|
||||||
<List>
|
<List>
|
||||||
<ListItem button>
|
<Link to="/insights/" className={classes.link}>
|
||||||
<ListItemIcon><InboxIcon /></ListItemIcon>
|
<ListItem button>
|
||||||
<ListItemText primary="Insights" />
|
<ListItemIcon><InboxIcon /></ListItemIcon>
|
||||||
</ListItem>
|
<ListItemText primary="Insights" />
|
||||||
|
</ListItem>
|
||||||
|
</Link>
|
||||||
</List>
|
</List>
|
||||||
<List>
|
<List>
|
||||||
<Link to="/admin/" className={classes.link}>
|
<Link to="/admin/" className={classes.link}>
|
||||||
|
@ -182,6 +185,7 @@ class PersistentDrawerLeft extends React.Component {
|
||||||
})}>
|
})}>
|
||||||
<Route path="/funds-management" render={() => <FundsManagement open={open} />} />
|
<Route path="/funds-management" render={() => <FundsManagement open={open} />} />
|
||||||
<Route path="/admin" component={ContractAdmin} />
|
<Route path="/admin" component={ContractAdmin} />
|
||||||
|
<Route path="/insights" component={TransferGraph} />
|
||||||
{this.props.children}
|
{this.props.children}
|
||||||
</div>
|
</div>
|
||||||
</main>
|
</main>
|
||||||
|
|
|
@ -1,10 +1,11 @@
|
||||||
import Cytoscape from 'cytoscape'
|
import Cytoscape from 'cytoscape'
|
||||||
import dagre from 'cytoscape-dagre'
|
import dagre from 'cytoscape-dagre'
|
||||||
import React, { Fragment, memo } from 'react'
|
import React, { Fragment } from 'react'
|
||||||
import CytoscapeComponent from 'react-cytoscapejs'
|
import CytoscapeComponent from 'react-cytoscapejs'
|
||||||
import { uniq } from 'ramda'
|
import { uniq } from 'ramda'
|
||||||
import { toEther } from '../utils/conversions'
|
import { toEther } from '../utils/conversions'
|
||||||
import { getTokenLabel } from '../utils/currencies'
|
import { getTokenLabel } from '../utils/currencies'
|
||||||
|
import { FundingContext } from '../context'
|
||||||
|
|
||||||
Cytoscape.use(dagre)
|
Cytoscape.use(dagre)
|
||||||
const layout = { name: 'dagre' }
|
const layout = { name: 'dagre' }
|
||||||
|
@ -68,17 +69,21 @@ const createElements = (transfers, vaultEvents) => {
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
||||||
const TransfersGraph = ({ transfers, vaultEvents }) => {
|
const TransfersGraph = () => {
|
||||||
return (
|
return (
|
||||||
<Fragment>
|
<FundingContext.Consumer>
|
||||||
<CytoscapeComponent
|
{({ transfers, vaultEvents }) =>
|
||||||
elements={createElements(transfers, vaultEvents)}
|
<Fragment>
|
||||||
style={ { width: '100%', height: '600px', fontSize: '14px' } }
|
<CytoscapeComponent
|
||||||
stylesheet={stylesheet}
|
elements={createElements(transfers, vaultEvents)}
|
||||||
layout={layout}
|
style={ { width: '100%', height: '600px', fontSize: '14px' } }
|
||||||
/>
|
stylesheet={stylesheet}
|
||||||
</Fragment>
|
layout={layout}
|
||||||
|
/>
|
||||||
|
</Fragment>
|
||||||
|
}
|
||||||
|
</FundingContext.Consumer>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
export default memo(TransfersGraph)
|
export default TransfersGraph
|
||||||
|
|
13
app/dapp.js
13
app/dapp.js
|
@ -9,7 +9,6 @@ import { getAllLPEvents, getAllVaultEvents, getProfileEvents, formatFundProfileE
|
||||||
import { getAllPledges, appendToExistingPledges, transferBetweenPledges } from './utils/pledges';
|
import { getAllPledges, appendToExistingPledges, transferBetweenPledges } from './utils/pledges';
|
||||||
import { FundingContext } from './context'
|
import { FundingContext } from './context'
|
||||||
import { cancelProfile } from './utils/fundProfiles'
|
import { cancelProfile } from './utils/fundProfiles'
|
||||||
import TransfersGraph from './components/TransfersGraph'
|
|
||||||
import MainCointainer from './components/MainCointainer'
|
import MainCointainer from './components/MainCointainer'
|
||||||
|
|
||||||
const { getNetworkType } = web3.eth.net
|
const { getNetworkType } = web3.eth.net
|
||||||
|
@ -35,7 +34,7 @@ class App extends React.Component {
|
||||||
const authorizedPayments = await getAuthorizedPayments()
|
const authorizedPayments = await getAuthorizedPayments()
|
||||||
const account = await web3.eth.getCoinbase()
|
const account = await web3.eth.getCoinbase()
|
||||||
const allLpEvents = await getAllLPEvents()
|
const allLpEvents = await getAllLPEvents()
|
||||||
const allVaultEvents = await getAllVaultEvents()
|
const vaultEvents = await getAllVaultEvents()
|
||||||
const transfers = allLpEvents.filter(obj => obj.event === 'Transfer')
|
const transfers = allLpEvents.filter(obj => obj.event === 'Transfer')
|
||||||
this.setState({
|
this.setState({
|
||||||
account,
|
account,
|
||||||
|
@ -47,7 +46,7 @@ class App extends React.Component {
|
||||||
allPledges,
|
allPledges,
|
||||||
authorizedPayments,
|
authorizedPayments,
|
||||||
allLpEvents,
|
allLpEvents,
|
||||||
allVaultEvents,
|
vaultEvents,
|
||||||
transfers
|
transfers
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
@ -80,15 +79,13 @@ class App extends React.Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const { account, needsInit, lpAllowance, fundProfiles, allPledges, authorizedPayments, transfers, allVaultEvents } = this.state
|
const { account, needsInit, lpAllowance, fundProfiles, allPledges, authorizedPayments, transfers, vaultEvents } = this.state
|
||||||
const { appendFundProfile, appendPledges, transferPledgeAmounts, cancelFundProfile } = this
|
const { appendFundProfile, appendPledges, transferPledgeAmounts, cancelFundProfile } = this
|
||||||
const fundingContext = { allPledges, appendPledges, appendFundProfile, account, transferPledgeAmounts, authorizedPayments, cancelFundProfile, fundProfiles, needsInit, initVaultAndLP, standardTokenApproval }
|
const fundingContext = { allPledges, appendPledges, appendFundProfile, account, transferPledgeAmounts, authorizedPayments, cancelFundProfile, fundProfiles, needsInit, initVaultAndLP, standardTokenApproval, transfers, vaultEvents }
|
||||||
return (
|
return (
|
||||||
<FundingContext.Provider value={fundingContext}>
|
<FundingContext.Provider value={fundingContext}>
|
||||||
<Router>
|
<Router>
|
||||||
<MainCointainer>
|
<MainCointainer />
|
||||||
{false &&transfers && <TransfersGraph transfers={transfers} vaultEvents={allVaultEvents} />}
|
|
||||||
</MainCointainer>
|
|
||||||
</Router>
|
</Router>
|
||||||
</FundingContext.Provider>
|
</FundingContext.Provider>
|
||||||
)
|
)
|
||||||
|
|
Loading…
Reference in New Issue