diff --git a/client/src/components/atoms/VersionNumbers/VersionTable.module.scss b/client/src/components/molecules/VersionNumbers/VersionTable.module.scss similarity index 93% rename from client/src/components/atoms/VersionNumbers/VersionTable.module.scss rename to client/src/components/molecules/VersionNumbers/VersionTable.module.scss index 06f9b2e..348288e 100644 --- a/client/src/components/atoms/VersionNumbers/VersionTable.module.scss +++ b/client/src/components/molecules/VersionNumbers/VersionTable.module.scss @@ -54,6 +54,6 @@ } .spinner { - composes: spinner, small from '../Spinner.module.scss'; + composes: spinner, small from '../../atoms/Spinner.module.scss'; margin-right: $spacer; } diff --git a/client/src/components/atoms/VersionNumbers/VersionTable.tsx b/client/src/components/molecules/VersionNumbers/VersionTable.tsx similarity index 51% rename from client/src/components/atoms/VersionNumbers/VersionTable.tsx rename to client/src/components/molecules/VersionNumbers/VersionTable.tsx index fcab197..b9c05be 100644 --- a/client/src/components/atoms/VersionNumbers/VersionTable.tsx +++ b/client/src/components/molecules/VersionNumbers/VersionTable.tsx @@ -2,7 +2,7 @@ import React, { Fragment } from 'react' import { VersionNumbersState as VersionTableProps } from '.' import styles from './VersionTable.module.scss' import slugify from '@sindresorhus/slugify' -import Spinner from '../Spinner' +import Spinner from '../../atoms/Spinner' const VersionTableContracts = ({ contracts, @@ -14,27 +14,60 @@ const VersionTableContracts = ({ {contracts && - Object.keys(contracts).map(key => ( - - - - - ))} + Object.keys(contracts).map(key => { + const submarineLink = `https://submarine${ + network === 'duero' + ? '.duero' + : network === 'pacific' + ? '.pacific' + : '' + }.dev-ocean.com/address/${contracts[key]}` + + return ( + + + + + ) + })}
- {key} - - - {contracts[key]} - -
+ {key} + + + {contracts[key]} + +
) +const VersionNumber = ({ + isLoading, + software, + version, + network +}: { + isLoading: boolean + software: string + version: string + network: string +}) => + isLoading ? ( + + ) : version ? ( + <> + + v{version} + + {network && `(${network})`} + + ) : ( + Could not get version + ) + const VersionTable = ({ data }: { data: VersionTableProps }) => (
@@ -55,16 +88,12 @@ const VersionTable = ({ data }: { data: VersionTableProps }) => ( {key === 'keeperContracts' && data.brizo.contracts && ( diff --git a/client/src/components/atoms/VersionNumbers/index.module.scss b/client/src/components/molecules/VersionNumbers/index.module.scss similarity index 100% rename from client/src/components/atoms/VersionNumbers/index.module.scss rename to client/src/components/molecules/VersionNumbers/index.module.scss diff --git a/client/src/components/atoms/VersionNumbers/index.test.tsx b/client/src/components/molecules/VersionNumbers/index.test.tsx similarity index 100% rename from client/src/components/atoms/VersionNumbers/index.test.tsx rename to client/src/components/molecules/VersionNumbers/index.test.tsx diff --git a/client/src/components/atoms/VersionNumbers/index.tsx b/client/src/components/molecules/VersionNumbers/index.tsx similarity index 100% rename from client/src/components/atoms/VersionNumbers/index.tsx rename to client/src/components/molecules/VersionNumbers/index.tsx diff --git a/client/src/components/atoms/VersionNumbers/utils.test.ts b/client/src/components/molecules/VersionNumbers/utils.test.ts similarity index 100% rename from client/src/components/atoms/VersionNumbers/utils.test.ts rename to client/src/components/molecules/VersionNumbers/utils.test.ts diff --git a/client/src/components/atoms/VersionNumbers/utils.ts b/client/src/components/molecules/VersionNumbers/utils.ts similarity index 100% rename from client/src/components/atoms/VersionNumbers/utils.ts rename to client/src/components/molecules/VersionNumbers/utils.ts diff --git a/client/src/components/organisms/Footer.tsx b/client/src/components/organisms/Footer.tsx index bbfcfd4..8e54a22 100644 --- a/client/src/components/organisms/Footer.tsx +++ b/client/src/components/organisms/Footer.tsx @@ -5,7 +5,7 @@ import { ReactComponent as AiCommons } from '../../img/aicommons.svg' import styles from './Footer.module.scss' import meta from '../../data/meta.json' -import VersionNumbers from '../atoms/VersionNumbers' +import VersionNumbers from '../molecules/VersionNumbers' const Footer = () => (
diff --git a/client/src/context/UserProvider.tsx b/client/src/context/UserProvider.tsx index 8f37933..60d5c03 100644 --- a/client/src/context/UserProvider.tsx +++ b/client/src/context/UserProvider.tsx @@ -153,13 +153,16 @@ export default class UserProvider extends PureComponent<{}, UserProviderState> { await window.web3.eth.net.getId((err, netId) => { if (err) return + const isPacific = netId === 0xcea11 const isNile = netId === 8995 const isDuero = netId === 2199 const isSpree = netId === 8996 - isOceanNetwork = isNile || isDuero || isSpree + isOceanNetwork = isPacific || isNile || isDuero || isSpree - const network = isNile + const network = isPacific + ? 'Pacific' + : isNile ? 'Nile' : isDuero ? 'Duero' @@ -255,10 +258,11 @@ export default class UserProvider extends PureComponent<{}, UserProviderState> { if (isWeb3) { const network = await ocean.keeper.getNetworkName() + const isPacific = network === 'Pacific' const isNile = network === 'Nile' const isDuero = network === 'Duero' const isSpree = network === 'Spree' - const isOceanNetwork = isNile || isDuero || isSpree + const isOceanNetwork = isPacific || isNile || isDuero || isSpree network !== this.state.network && this.setState({ isOceanNetwork, network }) diff --git a/client/src/routes/About.tsx b/client/src/routes/About.tsx index 512ef34..10403df 100644 --- a/client/src/routes/About.tsx +++ b/client/src/routes/About.tsx @@ -1,7 +1,7 @@ import React, { Component } from 'react' import Route from '../components/templates/Route' import Content from '../components/atoms/Content' -import VersionNumbers from '../components/atoms/VersionNumbers' +import VersionNumbers from '../components/molecules/VersionNumbers' class About extends Component { public render() { diff --git a/client/src/routes/Faucet.module.scss b/client/src/routes/Faucet.module.scss index d407fdb..c09811c 100644 --- a/client/src/routes/Faucet.module.scss +++ b/client/src/routes/Faucet.module.scss @@ -25,6 +25,13 @@ overflow-wrap: break-word; display: inline; } + + a:hover, + a:focus { + code { + color: inherit; + } + } } .error { diff --git a/client/src/routes/Faucet.tsx b/client/src/routes/Faucet.tsx index fd97dba..bed7633 100644 --- a/client/src/routes/Faucet.tsx +++ b/client/src/routes/Faucet.tsx @@ -16,6 +16,8 @@ interface FaucetState { } export default class Faucet extends PureComponent<{}, FaucetState> { + public static contextType = User + public state = { isLoading: false, success: undefined, @@ -59,15 +61,31 @@ export default class Faucet extends PureComponent<{}, FaucetState> { }) } - private Success = () => ( -
- {this.state.success} -

- Your Transaction Hash - {this.state.trxHash} -

-
- ) + private Success = () => { + const { network } = this.context + const { trxHash } = this.state + + const submarineLink = `https://submarine${ + network === 'Duero' + ? '.duero' + : network === 'Pacific' + ? '.pacific' + : '' + }.dev-ocean.com/tx/${trxHash}` + + return ( +
+ {this.state.success} +

+ Your Transaction Hash + + + {trxHash} + +

+
+ ) + } private Error = () => (
- {value.isLoading ? ( - - ) : value.version ? ( - <> - v{value.version} - {value.network && `(${value.network})`} - - ) : ( - 'Could not get version' - )} +