oceanprotocol
/
status-frontend
mirror of https://github.com/oceanprotocol/status-frontend.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

show last updated on per-network basis

This commit is contained in:
Matthias Kretschmann 2022-10-19 18:17:15 +01:00
parent 2e49e35c55
commit 09d25d5c24
Signed by: m
GPG Key ID: 606EEEF3C479A91F
4 changed files with 33 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
package-lock.json generated
View File

@ -16,7 +16,8 @@
"dotenv": "^16.0.3", "dotenv": "^16.0.3",
"next": "12.3.1", "next": "12.3.1",
"react": "18.2.0", "react": "18.2.0",
"react-dom": "18.2.0" "react-dom": "18.2.0",
"tiny-relative-date": "^1.3.0"
}, },
"devDependencies": { "devDependencies": {
"@types/node": "18.7.23", "@types/node": "18.7.23",
@ -6450,6 +6451,11 @@
"dev": true, "dev": true,
"license": "MIT" "license": "MIT"
}, },
"node_modules/tiny-relative-date": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/tiny-relative-date/-/tiny-relative-date-1.3.0.tgz",
"integrity": "sha512-MOQHpzllWxDCHHaDno30hhLfbouoYlOI8YlMNtvKe1zXbjEVhbcEovQxvZrPvtiYW630GQDoMMarCnjfyfHA+A=="
},
"node_modules/to-fast-properties": { "node_modules/to-fast-properties": {
"version": "2.0.0", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz", "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
@ -10827,6 +10833,11 @@
"version": "0.2.0", "version": "0.2.0",
"dev": true "dev": true
}, },
"tiny-relative-date": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/tiny-relative-date/-/tiny-relative-date-1.3.0.tgz",
"integrity": "sha512-MOQHpzllWxDCHHaDno30hhLfbouoYlOI8YlMNtvKe1zXbjEVhbcEovQxvZrPvtiYW630GQDoMMarCnjfyfHA+A=="
},
"to-fast-properties": { "to-fast-properties": {
"version": "2.0.0", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz", "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",

3
package.json
View File

@ -19,7 +19,8 @@
"dotenv": "^16.0.3", "dotenv": "^16.0.3",
"next": "12.3.1", "next": "12.3.1",
"react": "18.2.0", "react": "18.2.0",
"react-dom": "18.2.0" "react-dom": "18.2.0",
"tiny-relative-date": "^1.3.0"
}, },
"devDependencies": { "devDependencies": {
"@types/node": "18.7.23", "@types/node": "18.7.23",

13
src/pages/index.tsx
View File

@ -7,6 +7,7 @@ import LogoAsset from '../images/logo.svg'
import CheckAsset from '../images/check.svg' import CheckAsset from '../images/check.svg'
import addresses from '@oceanprotocol/contracts/addresses/address.json' import addresses from '@oceanprotocol/contracts/addresses/address.json'
import { statusApiUri } from '../../app.config' import { statusApiUri } from '../../app.config'
import relativeDate from 'tiny-relative-date'
function statusIcon(state: State): ReactElement { function statusIcon(state: State): ReactElement {
if (state === State.Up) { if (state === State.Up) {
@ -77,7 +78,17 @@ export default function HomePage(): ReactElement {
Object.entries(data || {}).map(([networkName, value]) => ( Object.entries(data || {}).map(([networkName, value]) => (
<Fragment key={networkName}> <Fragment key={networkName}>
<h2 className={styles.networkName}> <h2 className={styles.networkName}>
{networkName == 'general' ? null : networkName} {networkName == 'general' ? null : (
<>
{networkName}
<span
className={styles.date}
title={`Last update: ${new Date(value.lastUpdatedOn)}`}
>
{relativeDate(new Date(value.lastUpdatedOn))}
</span>
</>
)}
</h2> </h2>
<div className={styles.grid}> <div className={styles.grid}>
{value.components.map((component) => ( {value.components.map((component) => (

7
src/styles/Home.module.css
View File

@ -136,3 +136,10 @@
margin-top: 30vh; margin-top: 30vh;
text-align: center; text-align: center;
} }
.date {
display: inline-block;
margin-left: calc(var(--spacer) / 6);
font-size: var(--font-size-small);
color: var(--color-secondary);
}