lamassu/lamassu-server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: machine dashboard screen more up to spec

Browse source
This commit is contained in:
Sérgio Salgado 2022-02-16 01:46:49 +00:00
parent d794bca673
commit cc4700a413
7 changed files with 45 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

40
new-lamassu-admin/src/pages/Machines/MachineComponents/Overview.js
View file

@ -5,7 +5,7 @@ import React from 'react'
import { Status } from 'src/components/Status'
import MachineActions from 'src/components/machineActions/MachineActions'
import { H3, Label3, P } from 'src/components/typography'
import { H3, Label1, P } from 'src/components/typography'
import CopyToClipboard from 'src/pages/Transactions/CopyToClipboard.js'
import styles from '../Machines.styles'
@ -15,7 +15,7 @@ const Overview = ({ data, onActionSuccess }) => {
const classes = useStyles()
return (
<>
<div className={classes.contentContainer}>
<div className={classes.row}>
<div className={classes.rowItem}>
<H3>{data.name}</H3>
@ -23,14 +23,22 @@ const Overview = ({ data, onActionSuccess }) => {
</div>
<div className={classes.row}>
<div className={classes.rowItem}>
<Label3 className={classes.label3}>Status</Label3>
<Label1 className={classes.label3}>Status</Label1>
{data && data.statuses ? <Status status={data.statuses[0]} /> : null}
</div>
</div>
<div className={classes.row}>
<div className={classes.rowItem}>
<Label3 className={classes.label3}>Last ping</Label3>
<P>
<Label1 className={classes.label3}>Ping</Label1>
<P noMargin>
{data.responseTime
? new BigNumber(data.responseTime).toFixed(3).toString() + ' ms'
: 'unavailable'}
</P>
</div>
<div className={classes.rowItem}>
<Label1 className={classes.label3}>Last ping</Label1>
<P noMargin>
{data.lastPing
? formatDistance(new Date(data.lastPing), new Date(), {
addSuffix: true
@ -38,11 +46,9 @@ const Overview = ({ data, onActionSuccess }) => {
: 'unknown'}
</P>
</div>
</div>
<div className={classes.row}>
<div className={classes.rowItem}>
<Label3 className={classes.label3}>Network speed</Label3>
<P>
<Label1 className={classes.label3}>Network speed</Label1>
<P noMargin>
{data.downloadSpeed
? new BigNumber(data.downloadSpeed).toFixed(4).toString() +
' MB/s'
@ -50,22 +56,22 @@ const Overview = ({ data, onActionSuccess }) => {
</P>
</div>
</div>
<div className={classes.row}>
<MachineActions
machine={data}
onActionSuccess={onActionSuccess}></MachineActions>
</div>
<div className={classes.row}>
<div className={classes.rowItem}>
<Label3 className={classes.label3}>Device ID</Label3>
<P>
<Label1 className={classes.label3}>Device ID</Label1>
<P noMargin>
<CopyToClipboard buttonClassname={classes.copyToClipboard}>
{data.deviceId}
</CopyToClipboard>
</P>
</div>
</div>
</>
<div className={classes.row}>
<MachineActions
machine={data}
onActionSuccess={onActionSuccess}></MachineActions>
</div>
</div>
)
}