diff --git a/app/components/TransfersGraph.jsx b/app/components/TransfersGraph.jsx new file mode 100644 index 0000000..e298f77 --- /dev/null +++ b/app/components/TransfersGraph.jsx @@ -0,0 +1,54 @@ +import Cytoscape from 'cytoscape' +import dagre from 'cytoscape-dagre' +import React, { Fragment } from 'react' +import CytoscapeComponent from 'react-cytoscapejs' + +Cytoscape.use(dagre) +const layout = { name: 'dagre' } + +const stylesheet = [ + { + selector: 'node', + style: { + width: 5, + height: 5, + fontSize: '5px', + color: 'blue', + label: 'data(label)' + } + }, + { + selector: 'edge', + style: { + label: 'data(label)', + curveStyle: 'bezier', + targetArrowShape: 'triangle', + arrowScale: 0.5, + fontSize: '5px', + width: 1 + } + } +] + +const TransfersGraph = () => { + const elements = [ + { data: { id: 'one', label: 'Node 1' } }, + { data: { id: 'two', label: 'Node 2' } }, + { data: { id: 'three', label: 'Node 3' } }, + { data: { source: 'one', target: 'two', label: 'Edge from Node1 to Node2' } }, + { data: { source: 'one', target: 'three', label: 'Edge from Node1 to Node3' } } + ] + + return ( + + + + ) +} + +export default TransfersGraph diff --git a/app/utils/events.js b/app/utils/events.js index 03dc307..56006a9 100644 --- a/app/utils/events.js +++ b/app/utils/events.js @@ -6,6 +6,7 @@ const AUTHORIZE_PAYMENT = 'AuthorizePayment' const GIVER_ADDED = 'GiverAdded' const DELEGATE_ADDED = 'DelegateAdded' const PROJECT_ADDED = 'ProjectAdded' +const ALL_EVENTS = 'allEvents' const lookups = { [GIVER_ADDED]: { id: 'idGiver', @@ -59,20 +60,31 @@ export const formatFundProfileEvent = async event => { } } -const getPastEvents = async event => { +const getPastEvents = async (event, raw = false) => { const events = await LiquidPledgingMock.getPastEvents(event, { addr: await web3.eth.getCoinbase(), fromBlock: 0, toBlock: 'latest' }) + if (raw) return events const formattedEvents = await Promise.all( events.map(formatFundProfileEvent) ) return formattedEvents } + +export const lpEventsSubscription = async () => { + //todo add on event handlers + const events = await LiquidPledgingMock.events.allEvents({ + fromBlock: 0, + toBlock: 'latest' + }) + return events +} export const getFunderProfiles = async () => await getPastEvents(GIVER_ADDED) export const getDelegateProfiles = async () => await getPastEvents(DELEGATE_ADDED) export const getProjectProfiles = async () => await getPastEvents(PROJECT_ADDED) +export const getAllLPEvents = async () => await getPastEvents(ALL_EVENTS, true) export const getAuthorizedPayments = async () => getPastVaultEvents(AUTHORIZE_PAYMENT) export const getProfileEvents = async () => { const [ funderProfiles, delegateProfiles, projectProfiles] diff --git a/package.json b/package.json index e581c56..4fc0c76 100644 --- a/package.json +++ b/package.json @@ -38,11 +38,11 @@ "babel-cli": "^6.26.0", "babel-eslint": "^10.0.1", "babel-preset-env": "^1.6.0", + "eslint": "^5.9.0", "eslint-config-airbnb": "^15.0.1", + "eslint-plugin-babel": "^5.3.0", "eslint-plugin-import": "^2.6.0", "eslint-plugin-jsx-a11y": "^6.0.2", - "eslint": "^5.9.0", - "eslint-plugin-babel": "^5.3.0", "eslint-plugin-react": "^7.11.1", "ganache-cli": "^6.1.3", "lerna": "^2.2.0", @@ -58,12 +58,16 @@ "@material-ui/icons": "^3.0.1", "async": "^2.4.0", "chai": "^4.1.0", + "cytoscape": "^3.3.0", + "cytoscape-cose-bilkent": "^4.0.0", + "cytoscape-dagre": "^2.2.2", "eslint": "^5.9.0", "eth-contract-class": "^0.0.12", "formik": "^1.3.2", "material-table": "^1.3.0", "ramda": "^0.26.1", "react": "^16.6.3", + "react-cytoscapejs": "^1.1.0", "react-dom": "^16.6.3" } }