diff --git a/client/src/App.tsx b/client/src/App.tsx index a6c0be0..f567646 100644 --- a/client/src/App.tsx +++ b/client/src/App.tsx @@ -31,6 +31,7 @@ interface AppState { isLogged: boolean isLoading: boolean isWeb3: boolean + isNile: boolean account: string balance: { eth: number @@ -82,6 +83,7 @@ class App extends Component<{}, AppState> { isLogged: false, isLoading: true, isWeb3: false, + isNile: false, balance: { eth: 0, ocn: 0 @@ -167,7 +169,8 @@ class App extends Component<{}, AppState> { const accounts = await ocean.accounts.list() const balance = await accounts[0].getBalance() const network = await ocean.keeper.getNetworkName() - this.setState({ balance, network }) + const isNile = network === 'Nile' + this.setState({ balance, network, isNile }) } catch (e) { Logger.log('ocean/balance error', e) this.setState({ diff --git a/client/src/components/molecules/AccountStatus/Indicator.module.scss b/client/src/components/molecules/AccountStatus/Indicator.module.scss index 7d82117..09a2b63 100644 --- a/client/src/components/molecules/AccountStatus/Indicator.module.scss +++ b/client/src/components/molecules/AccountStatus/Indicator.module.scss @@ -4,6 +4,7 @@ display: inline-block; position: relative; cursor: help; + padding: .5rem; } // default: red square diff --git a/client/src/components/molecules/AccountStatus/Indicator.tsx b/client/src/components/molecules/AccountStatus/Indicator.tsx index 8deeacb..5bfa917 100644 --- a/client/src/components/molecules/AccountStatus/Indicator.tsx +++ b/client/src/components/molecules/AccountStatus/Indicator.tsx @@ -22,7 +22,7 @@ const Indicator = ({ {states => !states.isWeb3 ? ( - ) : !states.isLogged ? ( + ) : !states.isLogged || !states.isNile ? ( ) : states.isLogged ? ( diff --git a/client/src/components/molecules/AccountStatus/Popover.module.scss b/client/src/components/molecules/AccountStatus/Popover.module.scss index 0860ed9..80ca282 100644 --- a/client/src/components/molecules/AccountStatus/Popover.module.scss +++ b/client/src/components/molecules/AccountStatus/Popover.module.scss @@ -49,6 +49,7 @@ $popoverWidth: 18rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; + font-family: $font-family-monospace; } .balance { diff --git a/client/src/components/molecules/AccountStatus/Popover.tsx b/client/src/components/molecules/AccountStatus/Popover.tsx index e8c3541..435e073 100644 --- a/client/src/components/molecules/AccountStatus/Popover.tsx +++ b/client/src/components/molecules/AccountStatus/Popover.tsx @@ -1,59 +1,65 @@ -import React from 'react' +import React, { PureComponent } from 'react' import { User } from '../../../context/User' import styles from './Popover.module.scss' -const Popover = ({ - forwardedRef, - style -}: { +export default class Popover extends PureComponent<{ forwardedRef: (ref: HTMLElement | null) => void style: React.CSSProperties -}) => ( -
{`https://nile.dev-ocean.com`}
+