diff --git a/client/src/components/molecules/VersionNumbers/VersionTable.tsx b/client/src/components/molecules/VersionNumbers/VersionTable.tsx index 5dd9913..412a24d 100644 --- a/client/src/components/molecules/VersionNumbers/VersionTable.tsx +++ b/client/src/components/molecules/VersionNumbers/VersionTable.tsx @@ -16,28 +16,31 @@ const VersionTableContracts = ({ {contracts && - Object.keys(contracts).map(key => { - const submarineLink = `https://submarine${ - network === 'duero' - ? '.duero' - : network === 'pacific' - ? '.pacific' - : '' - }.dev-ocean.com/address/${contracts[key]}` + Object.keys(contracts) + // sort alphabetically + .sort((a, b) => a.localeCompare(b)) + .map(key => { + const submarineLink = `https://submarine${ + network === 'duero' + ? '.duero' + : network === 'pacific' + ? '.pacific' + : '' + }.dev-ocean.com/address/${contracts[key]}` - return ( - - - - - ) - })} + return ( + + + + + ) + })}
- {key} - - - {contracts[key]} - -
+ {key} + + + {contracts[key]} + +
) @@ -72,42 +75,44 @@ const VersionTable = ({ data }: { data: VersionNumbersState }) => (
- {Object.entries(data).map(([key, value]) => ( - - - - - - {/* {value.contracts && ( + {Object.entries(data) + .filter(([key, value]) => key !== 'status') + .map(([key, value]) => ( + - + - )} */} - - ))} + {value.contracts && ( + + + + )} + + ))}
- - {value.name} - - - -
- + + {value.name} + + +
+ +
diff --git a/client/src/components/molecules/VersionNumbers/index.tsx b/client/src/components/molecules/VersionNumbers/index.tsx index b1e27b2..8337fcb 100644 --- a/client/src/components/molecules/VersionNumbers/index.tsx +++ b/client/src/components/molecules/VersionNumbers/index.tsx @@ -8,7 +8,7 @@ import axios from 'axios' import { version } from '../../../../package.json' import styles from './index.module.scss' -import { faucetUri } from '../../../config' +// import { faucetUri } from '../../../config' import { User } from '../../../context' import VersionTable from './VersionTable' @@ -43,11 +43,6 @@ export default class VersionNumbers extends PureComponent< name: 'Commons', version: commonsVersion }, - faucet: { - name: 'Faucet', - version: '', - status: OceanPlatformTechStatus.Loading - }, squid: { name: 'Squid-js', status: OceanPlatformTechStatus.Loading @@ -58,7 +53,18 @@ export default class VersionNumbers extends PureComponent< }, brizo: { name: 'Brizo', + network: 'Nile', status: OceanPlatformTechStatus.Loading + }, + faucet: { + name: 'Faucet', + version: '', + status: OceanPlatformTechStatus.Loading + }, + status: { + ok: false, + contracts: false, + network: false } } @@ -75,10 +81,12 @@ export default class VersionNumbers extends PureComponent< private async getOceanVersions() { const { ocean } = this.context - const { versions } = ocean - const componentVersions = versions && (await versions.get()) - const { squid, brizo, aquarius } = componentVersions - console.log(componentVersions) + + // wait until ocean object is properly populated + if (ocean.versions === undefined) return + + const response = await ocean.versions.get() + const { squid, brizo, aquarius, status } = response // const faucet = await this.getData(faucetUri) @@ -86,10 +94,10 @@ export default class VersionNumbers extends PureComponent< commons: { ...this.state.commons }, squid, brizo, - aquarius + aquarius, + status // faucet }) - console.log(this.state) } private async getData(uri: string) {