Display latest operations in UI status page for mediators (#332)

This commit is contained in:
Gerardo Nardelli 2020-05-19 02:53:36 -03:00 committed by GitHub
parent d3576f5a79
commit 4bd3576691
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 84 additions and 22 deletions

@ -7,6 +7,7 @@
"bignumber.js": "^6.0.0",
"coveralls": "^3.0.0",
"customize-cra": "^0.2.12",
"date-fns": "^2.13.0",
"dotenv": "^7.0.0",
"fs-extra": "^5.0.0",
"mobx": "^4.0.2",

@ -32,7 +32,7 @@
.status-configuration-data {
display: flex;
justify-content: space-evenly;
justify-content: space-around;
@media screen and (max-width: $tablet-width) {
column-gap: 30px;

@ -4,19 +4,25 @@ import { DataBlock } from './DataBlock'
export const Configuration = ({ requiredSignatures, authorities, symbol, maxSingleDeposit, maxTotalBalance }) => (
<div className="status-configuration-data">
<DataBlock description="Required Signatures" value={numeral(requiredSignatures).format('0')} type="" />
<div className="separator" />
<DataBlock description="Authorities" value={numeral(authorities).format('0')} type="" />
{requiredSignatures.toString() !== '0' && (
<DataBlock description="Required Signatures" value={numeral(requiredSignatures).format('0')} type="" />
)}
{authorities.toString() !== '0' && <div className="separator" />}
{authorities.toString() !== '0' && (
<DataBlock description="Authorities" value={numeral(authorities).format('0')} type="" />
)}
{maxSingleDeposit && maxSingleDeposit !== '0' && authorities.toString() !== '0' && <div className="separator" />}
{maxSingleDeposit &&
maxSingleDeposit !== '0' && <div className="separator" /> && (
maxSingleDeposit !== '0' && (
<DataBlock
description="Max Single Deposit"
value={numeral(maxSingleDeposit).format('0.00 a', Math.floor)}
type={symbol}
/>
)}
{maxSingleDeposit && maxSingleDeposit !== '0' && authorities.toString() !== '0' && <div className="separator" />}
{maxSingleDeposit &&
maxSingleDeposit !== '0' && <div className="separator" /> && (
maxSingleDeposit !== '0' && (
<DataBlock
description={`Remaining Daily ${symbol} Quota`}
value={numeral(maxTotalBalance).format('0.00 a', Math.floor)}

@ -3,12 +3,15 @@ import yn from './utils/yn'
import { Authority } from './Authority'
import { Configuration } from './Configuration'
import { inject, observer } from 'mobx-react'
import { isMediatorMode } from 'commons'
import { formatDistanceStrict } from 'date-fns'
import { DataBlock } from './DataBlock'
@inject('RootStore')
@observer
export class StatusPage extends React.Component {
render() {
const { homeStore, foreignStore, web3Store } = this.props.RootStore
const { homeStore, foreignStore, web3Store, bridgeMode } = this.props.RootStore
const isHome = web3Store.isSelectedNetwork(web3Store.homeNet.id)
const requiredSignatures = isHome ? homeStore.requiredSignatures : foreignStore.requiredSignatures
const authorities = isHome ? homeStore.validatorsCount : foreignStore.validatorsCount
@ -18,7 +21,27 @@ export class StatusPage extends React.Component {
const validatorsList = isHome ? homeStore.validators : foreignStore.validators
const { REACT_APP_UI_HOME_WITHOUT_EVENTS: HOME, REACT_APP_UI_FOREIGN_WITHOUT_EVENTS: FOREIGN } = process.env
const withoutEvents = web3Store.isSelectedNetwork(web3Store.homeNet.id) ? yn(HOME) : yn(FOREIGN)
const displayLatestOperations =
isMediatorMode(bridgeMode) && homeStore.lastEventRelayedOnHome > 0 && foreignStore.lastEventRelayedOnForeign > 0
let fromHomeToForeignText
let fromForeignToHomeText
let lastEventOnHome
let lastEventOnForeign
if (displayLatestOperations) {
fromHomeToForeignText = `From ${homeStore.networkName} To ${foreignStore.networkName}`
fromForeignToHomeText = `From ${foreignStore.networkName} To ${homeStore.networkName}`
const lastDateOnHome = new Date(0).setUTCSeconds(homeStore.lastEventRelayedOnHome)
lastEventOnHome = formatDistanceStrict(lastDateOnHome, new Date(), {
addSuffix: true
})
const lastDateOnForeign = new Date(0).setUTCSeconds(foreignStore.lastEventRelayedOnForeign)
lastEventOnForeign = formatDistanceStrict(lastDateOnForeign, new Date(), {
addSuffix: true
})
}
return (
<div className="status-page">
<div className="status-left-container" />
@ -33,7 +56,7 @@ export class StatusPage extends React.Component {
maxTotalBalance={maxTotalBalance}
/>
</div>
{withoutEvents ? null : (
{withoutEvents || authorities.toString() === '0' ? null : (
<div className="status-authorities-container">
<span className="status-authorities-title status-title">Authorities</span>
<div className="status-authorities-data">
@ -43,6 +66,15 @@ export class StatusPage extends React.Component {
</div>
</div>
)}
{displayLatestOperations && (
<div className="status-configuration-container">
<span className="status-configuration-title status-title">Latest Operations</span>
<div className="status-configuration-data">
<DataBlock description={fromHomeToForeignText} value={lastEventOnForeign} type="" />
<DataBlock description={fromForeignToHomeText} value={lastEventOnHome} type="" />
</div>
</div>
)}
</div>
<div className="pattern-background">
<div className="pattern-background-image" />

@ -110,6 +110,9 @@ class ForeignStore {
finished: false
}
@observable
lastEventRelayedOnForeign = 0
feeManager = {
totalFeeDistributedFromSignatures: BN(0),
totalFeeDistributedFromAffirmation: BN(0)
@ -419,6 +422,12 @@ class ForeignStore {
this.rootStore.homeStore.statistics.withdrawalsValue
)
})
const lastEventRelayedOnForeign = events.length ? events[events.length - 1] : null
if (lastEventRelayedOnForeign) {
const blockNumber = lastEventRelayedOnForeign.blockNumber
const block = await this.foreignWeb3.eth.getBlock(blockNumber)
this.lastEventRelayedOnForeign = block.timestamp
}
} else {
this.statistics.finished = true
}

@ -126,6 +126,9 @@ class HomeStore {
@observable
feeEventsFinished = false
@observable
lastEventRelayedOnHome = 0
@observable
depositFeeCollected = {
value: BN(0),
@ -462,6 +465,12 @@ class HomeStore {
this.statistics.finished = true
this.statistics.totalBridged = this.statistics.depositsValue.plus(this.statistics.withdrawalsValue)
})
const lastEventRelayedOnHome = events.length ? events[events.length - 1] : null
if (lastEventRelayedOnHome) {
const blockNumber = lastEventRelayedOnHome.blockNumber
const block = await this.homeWeb3.eth.getBlock(blockNumber)
this.lastEventRelayedOnHome = block.timestamp
}
}
} catch (e) {
console.error(e)

@ -6617,6 +6617,11 @@ date-fns@^1.23.0:
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-1.30.1.tgz#2e71bf0b119153dbb4cc4e88d9ea5acfb50dc05c"
integrity sha512-hBSVCvSmWC+QypYObzwGOd9wqdDpOt+0wl0KbU+R+uuZBS1jN8VsD1ss3irQDknRj5NvxiTF6oj/nDRnN/UQNw==
date-fns@^2.13.0:
version "2.13.0"
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.13.0.tgz#d7b8a0a2d392e8d88a8024d0a46b980bbfdbd708"
integrity sha512-xm0c61mevGF7f0XpCGtDTGpzEFC/1fpLXHbmFpxZZQJuvByIK2ozm6cSYuU+nxFYOPh2EuCfzUwlTEFwKG+h5w==
date-now@^0.1.4:
version "0.1.4"
resolved "https://registry.yarnpkg.com/date-now/-/date-now-0.1.4.tgz#eaf439fd4d4848ad74e5cc7dbef200672b9e345b"
@ -8183,7 +8188,7 @@ ethereumjs-abi@0.6.7:
bn.js "^4.11.8"
ethereumjs-util "^6.0.0"
"ethereumjs-abi@git+https://github.com/ethereumjs/ethereumjs-abi.git":
ethereumjs-abi@0.6.8, "ethereumjs-abi@git+https://github.com/ethereumjs/ethereumjs-abi.git":
version "0.6.8"
resolved "git+https://github.com/ethereumjs/ethereumjs-abi.git#1cfbb13862f90f0b391d8a699544d5fe4dfb8c7b"
dependencies:
@ -8267,6 +8272,19 @@ ethereumjs-tx@^1.1.1, ethereumjs-tx@^1.2.0, ethereumjs-tx@^1.2.2, ethereumjs-tx@
ethereum-common "^0.0.18"
ethereumjs-util "^5.0.0"
ethereumjs-util@5.2.0, ethereumjs-util@^5.0.0, ethereumjs-util@^5.0.1, ethereumjs-util@^5.1.1, ethereumjs-util@^5.1.2, ethereumjs-util@^5.1.3, ethereumjs-util@^5.1.5:
version "5.2.0"
resolved "https://registry.yarnpkg.com/ethereumjs-util/-/ethereumjs-util-5.2.0.tgz#3e0c0d1741471acf1036052d048623dee54ad642"
integrity sha512-CJAKdI0wgMbQFLlLRtZKGcy/L6pzVRgelIZqRqNbuVFM3K9VEnyfbcvz0ncWMRNCe4kaHWjwRYQcYMucmwsnWA==
dependencies:
bn.js "^4.11.0"
create-hash "^1.1.2"
ethjs-util "^0.1.3"
keccak "^1.0.2"
rlp "^2.0.0"
safe-buffer "^5.1.1"
secp256k1 "^3.0.1"
ethereumjs-util@6.1.0, ethereumjs-util@~6.1.0:
version "6.1.0"
resolved "https://registry.yarnpkg.com/ethereumjs-util/-/ethereumjs-util-6.1.0.tgz#e9c51e5549e8ebd757a339cc00f5380507e799c8"
@ -8304,19 +8322,6 @@ ethereumjs-util@^4.0.1, ethereumjs-util@^4.3.0:
rlp "^2.0.0"
secp256k1 "^3.0.1"
ethereumjs-util@^5.0.0, ethereumjs-util@^5.0.1, ethereumjs-util@^5.1.1, ethereumjs-util@^5.1.2, ethereumjs-util@^5.1.3, ethereumjs-util@^5.1.5:
version "5.2.0"
resolved "https://registry.yarnpkg.com/ethereumjs-util/-/ethereumjs-util-5.2.0.tgz#3e0c0d1741471acf1036052d048623dee54ad642"
integrity sha512-CJAKdI0wgMbQFLlLRtZKGcy/L6pzVRgelIZqRqNbuVFM3K9VEnyfbcvz0ncWMRNCe4kaHWjwRYQcYMucmwsnWA==
dependencies:
bn.js "^4.11.0"
create-hash "^1.1.2"
ethjs-util "^0.1.3"
keccak "^1.0.2"
rlp "^2.0.0"
safe-buffer "^5.1.1"
secp256k1 "^3.0.1"
ethereumjs-vm@4.1.3:
version "4.1.3"
resolved "https://registry.yarnpkg.com/ethereumjs-vm/-/ethereumjs-vm-4.1.3.tgz#dc8eb45f47d775da9f0b2437d5e20896fdf66f37"