connect pledges models to dashboard

This commit is contained in:
Barry Gitarts 2019-01-24 08:32:11 -05:00
parent c9ec430449
commit 912b6f539e
2 changed files with 22 additions and 11 deletions

View File

@ -1,5 +1,8 @@
import React from 'react' import React from 'react'
import PropTypes from 'prop-types' import PropTypes from 'prop-types'
import withObservables from '@nozbe/with-observables'
import { Q } from '@nozbe/watermelondb'
import { withDatabase } from '@nozbe/watermelondb/DatabaseProvider'
import { withStyles } from '@material-ui/core/styles' import { withStyles } from '@material-ui/core/styles'
import Card from '@material-ui/core/Card' import Card from '@material-ui/core/Card'
import CardContent from '@material-ui/core/CardContent' import CardContent from '@material-ui/core/CardContent'
@ -47,23 +50,23 @@ const styles = {
const getNet = (deposits, withdraws) => Number(deposits) - Number(withdraws) const getNet = (deposits, withdraws) => Number(deposits) - Number(withdraws)
const getValue = (deposits, withdraws) => (getNet(deposits, withdraws) / Number(deposits)) * 100 const getValue = (deposits, withdraws) => (getNet(deposits, withdraws) / Number(deposits)) * 100
function SimpleCard(props) { function SimpleCard(props) {
const { classes, title } = props const { classes, title, transfers, pledges } = props
return ( return (
<FundingContext.Consumer> <FundingContext.Consumer>
{({ allPledges, allLpEvents, vaultEvents }) => {({ vaultEvents }) =>
<Card className={classes.card}> <Card className={classes.card}>
<CardContent> <CardContent>
<Typography variant="h5" className={classes.cardTitle}> <Typography variant="h5" className={classes.cardTitle}>
{title} {title}
</Typography> </Typography>
{!!allLpEvents && {!!transfers &&
Object.entries(getDepositWithdrawTotals({ allLpEvents, allPledges, vaultEvents })) Object.entries(getDepositWithdrawTotals({ transfers, pledges, vaultEvents }))
.map(token => { .map(token => {
const [name, amounts] = token const [name, amounts] = token
const { deposits, withdraws } = amounts const { deposits, withdraws } = amounts
const address = getTokenAddress(name) const address = getTokenAddress(name)
const pledgesForCommit = getPledgesWaitingCommit({ allPledges }).filter(p => p.token == address) const pledgesForCommit = getPledgesWaitingCommit({ pledges }).filter(p => p.token == address)
return ( return (
<Card key={name}> <Card key={name}>
<Typography variant="h5" className={classes.titleText}> <Typography variant="h5" className={classes.titleText}>
@ -91,7 +94,7 @@ function SimpleCard(props) {
<Typography variant="h3"> <Typography variant="h3">
{pledgesForCommit.length} {pledgesForCommit.length}
</Typography> </Typography>
<Typography variant="h6" key={name + 'deposit'} className={classes.pos} color="textSecondary"> <Typography variant="h6" key={name + 'veto/approve'} className={classes.pos} color="textSecondary">
Pledges that can be vetoed / approved Pledges that can be vetoed / approved
</Typography> </Typography>
</CardContent> </CardContent>
@ -120,4 +123,11 @@ SimpleCard.propTypes = {
title: PropTypes.string title: PropTypes.string
} }
export default withStyles(styles)(SimpleCard) const styledCard = withStyles(styles)(SimpleCard)
export default withDatabase(withObservables([], ({ database }) => ({
transfers: database.collections.get('lp_events').query(
Q.where('event', 'Transfer')
).observe(),
pledges: database.collections.get('pledges').query().observe()
}))(styledCard))

View File

@ -9,6 +9,7 @@ const getWithdraws = state => state.vaultEvents.filter(
event => event.event === 'AuthorizePayment' event => event.event === 'AuthorizePayment'
) )
export const getPledges = state => state.allPledges export const getPledges = state => state.allPledges
const pluckPledges = state => state.pledges
export const getTransfersMemo = createSelector( export const getTransfersMemo = createSelector(
getTransfers, getTransfers,
@ -20,7 +21,7 @@ export const getDeposits = transfers => transfers.filter(
) )
const getDepositsSelector = createSelector( const getDepositsSelector = createSelector(
getTransfersMemo, ({ transfers }) => transfers,
getDeposits getDeposits
) )
@ -35,7 +36,7 @@ const pledgesWaitingCommit = pledges => {
} }
export const getPledgesWaitingCommit = createSelector( export const getPledgesWaitingCommit = createSelector(
getPledges, pluckPledges,
pledgesWaitingCommit pledgesWaitingCommit
) )
@ -43,7 +44,7 @@ const formatAndSumDepositWithdraws = (deposits, pledges, withdraws) => {
const tokens = {} const tokens = {}
deposits.forEach(deposit => { deposits.forEach(deposit => {
const { amount, to } = deposit.returnValues const { amount, to } = deposit.returnValues
const { token } = pledges.find(p => Number(p.id) === Number(to)) const { token } = pledges.find(p => Number(p.pledgeId) === Number(to))
const tokenName = getTokenLabel(token) const tokenName = getTokenLabel(token)
if (tokens[tokenName]) tokens[tokenName]['deposits'] = BigInt(tokens[tokenName]['deposits']) + BigInt(amount) if (tokens[tokenName]) tokens[tokenName]['deposits'] = BigInt(tokens[tokenName]['deposits']) + BigInt(amount)
else tokens[tokenName] = { 'deposits': BigInt(amount) } else tokens[tokenName] = { 'deposits': BigInt(amount) }
@ -70,7 +71,7 @@ const formatAndSumDepositWithdraws = (deposits, pledges, withdraws) => {
} }
export const getDepositWithdrawTotals = createSelector( export const getDepositWithdrawTotals = createSelector(
getDepositsSelector, getDepositsSelector,
getPledges, pluckPledges,
getWithdraws, getWithdraws,
formatAndSumDepositWithdraws formatAndSumDepositWithdraws
) )