Skip to content

Commit

Permalink
Merge remote-tracking branch 'origin/dev' into feat/array-of-endpoint…
Browse files Browse the repository at this point in the history
…s-960
  • Loading branch information
Torresmorah committed Nov 1, 2022
2 parents a4e3a1f + 3bd4593 commit 3f3eb79
Show file tree
Hide file tree
Showing 24 changed files with 299 additions and 269 deletions.
5 changes: 2 additions & 3 deletions webapp/src/components/GeoMap/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import PropTypes from 'prop-types'
import axios from 'axios'
import clsx from 'clsx'
import Button from '@mui/material/Button'
import Box from '@mui/material/Box'
import ArrowBackIcon from '@mui/icons-material/ArrowBack'

import { generalConfig } from '../../config'
Expand Down Expand Up @@ -92,7 +91,7 @@ const GeoMap = ({ data }) => {
}, [mapSelected, data])

return (
<Box className={clsx({ [classes.mapWrapper]: mapSelected && mapGeoData })}>
<div className={clsx({ [classes.mapWrapper]: mapSelected && mapGeoData })}>
<Button
startIcon={<ArrowBackIcon />}
onClick={handleGoBack}
Expand All @@ -115,7 +114,7 @@ const GeoMap = ({ data }) => {
setMap={setMapSelected}
/>
)}
</Box>
</div>
)
}

Expand Down
2 changes: 1 addition & 1 deletion webapp/src/components/ProducersSummary/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ const ProducersSummary = ({ t, classes, data, loading, total }) => {

{nodes.map((node, index) => (
<div className={classes.cardGrow} key={index}>
<Card>
<Card className={classes.cardShadow}>
<CardContent className={classes.cards}>
<Typography>{`${t(node.type)} ${t('producers')}`}</Typography>
<BodyGraphValue
Expand Down
13 changes: 6 additions & 7 deletions webapp/src/components/SearchBar/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ import { makeStyles } from '@mui/styles'
import Card from '@mui/material/Card'
import CardContent from '@mui/material/CardContent'
import Chip from '@mui/material/Chip'
import Grid from '@mui/material/Grid'
import IconButton from '@mui/material/IconButton'
import InputAdornment from '@mui/material/InputAdornment'
import TextField from '@mui/material/TextField'
Expand Down Expand Up @@ -55,8 +54,8 @@ const SearchBar = ({
}, [rootFilters])

return (
<Grid container spacing={2}>
<Grid item xs={12}>
<div>
<div>
<Card>
<CardContent className={classes.cardContent}>
<Typography className={classes.title}>
Expand All @@ -83,7 +82,7 @@ const SearchBar = ({
onKeyDown={handleOnKeyDown}
onChange={handleOnChange('owner')}
/>
<Grid className={classes.chipWrapper}>
<div className={classes.chipWrapper}>
{chips.map((chip, index) => (
<Chip
key={`chip-${chip.name}-${index}`}
Expand All @@ -95,11 +94,11 @@ const SearchBar = ({
})}
/>
))}
</Grid>
</div>
</CardContent>
</Card>
</Grid>
</Grid>
</div>
</div>
)
}

Expand Down
10 changes: 3 additions & 7 deletions webapp/src/components/SnackbarMessage/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { makeStyles } from '@mui/styles'
import Snackbar from '@mui/material/Snackbar'
import Alert from '@mui/material/Alert'
import CloseIcon from '@mui/icons-material/Close'
import { Box, IconButton, Typography } from '@mui/material'
import { IconButton, Typography } from '@mui/material'

import { useSnackbarMessageState } from '../../context/snackbar-message.context'

Expand Down Expand Up @@ -68,11 +68,7 @@ const SnackbarMessage = () => {
onClose={handleClose}
className={classes.alert}
action={
<Box
display="flex"
justifyContent="space-between"
alignItems="end"
>
<div className={classes.errMsg}>
{message.content && countdown > 0 && (
<Typography>{countdown / 1000}s</Typography>
)}
Expand All @@ -84,7 +80,7 @@ const SnackbarMessage = () => {
>
<CloseIcon fontSize="inherit" />
</IconButton>
</Box>
</div>
}
>
{message.content}
Expand Down
8 changes: 7 additions & 1 deletion webapp/src/components/SnackbarMessage/styles.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,13 @@ export default (theme) => ({
alert: {
'& a': {
color: theme.palette.info.contrastText,
lineBreak: 'anywhere'
lineBreak: 'anywhere',
}
},
errMsg: {
width: '50%',
display: 'flex',
justifyContent: 'space-between',
alignItems: 'end'
}
})
4 changes: 2 additions & 2 deletions webapp/src/components/Topbar/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ const Topbar = ({ user, onLogout, onLogin }) => {
const { t } = useTranslation('topbarComponent')

return (
<Box className={classes.box}>
<div className={classes.box}>
<LanguageSelector />
{user && (
<>
Expand All @@ -42,7 +42,7 @@ const Topbar = ({ user, onLogout, onLogin }) => {
</Typography>
</IconButton>
)}
</Box>
</div>
)
}

Expand Down
47 changes: 21 additions & 26 deletions webapp/src/components/TransactionsHistory/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -31,20 +31,20 @@ BodyGraphValue.propTypes = {
loading: PropTypes.bool,
value: PropTypes.any,
classes: PropTypes.object,
href: PropTypes.string
href: PropTypes.string,
}

BodyGraphValue.defaultProps = {
value: 0,
loading: false,
classes: {}
classes: {},
}

const TransactionsHistory = ({ t, classes, nodesChildren }) => {
const { data, loading } = useSubscription(BLOCK_TRANSACTIONS_HISTORY)
const [
blockWithHighestTransactionsCount,
setBlockWithHighestTransactionsCount
setBlockWithHighestTransactionsCount,
] = useState({})

useEffect(() => {
Expand All @@ -54,7 +54,7 @@ const TransactionsHistory = ({ t, classes, nodesChildren }) => {

const blockWithHighestTransactionsCount =
data.stats[0].tps_all_time_high.blocks.sort((first, second) =>
first.transactions_count > second.transactions_count ? -1 : 1
first.transactions_count > second.transactions_count ? -1 : 1,
)[0]
setBlockWithHighestTransactionsCount(blockWithHighestTransactionsCount)
}, [data])
Expand All @@ -78,9 +78,9 @@ const TransactionsHistory = ({ t, classes, nodesChildren }) => {
)

return (
<div>
<div className={classes.wrapper}>
<div className={classes.cardGrow}>
<Card>
<Card className={classes.cardShadow}>
<CardContent className={classes.cards}>
<Typography>{t('tpsAllTimeHigh')}</Typography>
<BodyGraphValue
Expand All @@ -92,15 +92,14 @@ const TransactionsHistory = ({ t, classes, nodesChildren }) => {
</CardContent>
</Card>
</div>

<div className={classes.cardGrow}>
<Card>
<Card className={classes.cardShadow}>
<CardContent className={classes.cards}>
<Typography>{t('networkUtilizationAllTimeHigh')}</Typography>
<BodyGraphValue
value={`${formatWithThousandSeparator(
blockWithHighestTransactionsCount.cpu_usage_percent * 100 || 0,
2
2,
)}%`}
classes={classes}
href={getBlockNumUrl(blockWithHighestTransactionsCount.block_num)}
Expand All @@ -109,68 +108,64 @@ const TransactionsHistory = ({ t, classes, nodesChildren }) => {
</CardContent>
</Card>
</div>

<div className={classes.cardGrow}>
<Card>
<Card className={classes.cardShadow}>
<CardContent className={classes.cards}>
<Typography>{`${t('transactions')} ${t('lastHour')}`}</Typography>
<BodyGraphValue
value={formatWithThousandSeparator(
data?.stats?.[0]?.transactions_in_last_hour || 0
data?.stats?.[0]?.transactions_in_last_hour || 0,
)}
loading={loading}
/>
</CardContent>
</Card>
</div>

<div className={classes.cardGrow}>
<Card>
<Card className={classes.cardShadow}>
<CardContent className={classes.cards}>
<Typography>{`${t('transactions')} ${t('lastDay')}`}</Typography>
<BodyGraphValue
value={formatWithThousandSeparator(
data?.stats?.[0]?.transactions_in_last_day || 0
data?.stats?.[0]?.transactions_in_last_day || 0,
)}
loading={loading}
/>
</CardContent>
</Card>
</div>

<div className={classes.cardGrow}>
<Card>
<Card className={classes.cardShadow}>
<CardContent className={classes.cards}>
<Typography>{`${t('transactions')} ${t(
'dailyAverage'
'dailyAverage',
)}`}</Typography>
<BodyGraphValue
value={formatWithThousandSeparator(
data?.stats?.[0]?.average_daily_transactions_in_last_week || 0,
0
0,
)}
loading={loading}
/>
</CardContent>
</Card>
</div>

<div className={classes.cardGrow}>
<Card>
<Card className={classes.cardShadow}>
<CardContent className={classes.cards}>
<Typography>{`${t('transactions')} ${t('lastWeek')}`}</Typography>
<BodyGraphValue
value={formatWithThousandSeparator(
data?.stats?.[0]?.transactions_in_last_week || 0
data?.stats?.[0]?.transactions_in_last_week || 0,
)}
loading={loading}
/>
</CardContent>
</Card>
</div>
{nodesChildren && nodesChildren}
<div className={classes.cardow}>
<Card>
<div className={classes.cardGrow}>
<Card className={classes.cardShadow}>
<CardContent className={classes.cards}>
<Typography>{`${t('uniqueLocations')}`}</Typography>
<BodyGraphValue
Expand All @@ -187,12 +182,12 @@ const TransactionsHistory = ({ t, classes, nodesChildren }) => {
TransactionsHistory.propTypes = {
t: PropTypes.func,
classes: PropTypes.object,
nodesChildren: PropTypes.node
nodesChildren: PropTypes.node,
}

TransactionsHistory.defaultProps = {
t: (text) => text,
classes: {}
classes: {},
}

export default memo(TransactionsHistory)
5 changes: 2 additions & 3 deletions webapp/src/components/TransactionsLineChart/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import React from 'react'
import HighchartsReact from 'highcharts-react-official'
import PropTypes from 'prop-types'
import Highcharts from 'highcharts'
import Box from '@mui/material/Box'

const TransactionsLineChart = ({ data, xAxisProps, title, yAxisProps }) => {
const options = {
Expand All @@ -24,15 +23,15 @@ const TransactionsLineChart = ({ data, xAxisProps, title, yAxisProps }) => {
}

return (
<Box>
<div>
<HighchartsReact
highcharts={Highcharts}
options={{
...options,
series: data
}}
/>
</Box>
</div>
)
}

Expand Down
Loading

0 comments on commit 3f3eb79

Please sign in to comment.