diff --git a/src/pages/info/index.tsx b/src/pages/info/index.tsx
index 21906f1..0a1ec61 100644
--- a/src/pages/info/index.tsx
+++ b/src/pages/info/index.tsx
@@ -14,6 +14,7 @@ import { useIsBeeDesktop, useNewBeeDesktopVersion } from '../../hooks/apiHooks'
import { BEE_DESKTOP_LATEST_RELEASE_PAGE } from '../../utils/desktop'
import config from '../../config'
import NodeInfoCard from './NodeInfoCard'
+import { chainIdToName } from '../../utils/chain'
export default function Status(): ReactElement {
const {
@@ -25,6 +26,7 @@ export default function Status(): ReactElement {
nodeInfo,
balance,
chequebookBalance,
+ wallet,
} = useContext(BeeContext)
const isBeeDesktop = config.BEE_DESKTOP_ENABLED
const { beeDesktopVersion } = useIsBeeDesktop()
@@ -147,6 +149,7 @@ export default function Status(): ReactElement {
}
/>
+ {wallet && }
)
}
diff --git a/src/providers/Bee.tsx b/src/providers/Bee.tsx
index b85a044..89fa77c 100644
--- a/src/providers/Bee.tsx
+++ b/src/providers/Bee.tsx
@@ -8,6 +8,7 @@ import {
NodeInfo,
Peer,
Topology,
+ WalletBalance,
} from '@ethersphere/bee-js'
import { createContext, ReactChild, ReactElement, useContext, useEffect, useState } from 'react'
import semver from 'semver'
@@ -65,6 +66,7 @@ interface ContextInterface {
peerCheques: LastChequesResponse | null
settlements: Settlements | null
chainState: ChainState | null
+ wallet: WalletBalance | null
latestBeeRelease: LatestBeeRelease | null
isLoading: boolean
lastUpdate: number | null
@@ -102,6 +104,7 @@ const initialValues: ContextInterface = {
peerCheques: null,
settlements: null,
chainState: null,
+ wallet: null,
latestBeeRelease: null,
isLoading: true,
lastUpdate: null,
@@ -204,6 +207,7 @@ export function Provider({ children }: Props): ReactElement {
const [settlements, setSettlements] = useState(null)
const [chainState, setChainState] = useState(null)
const [walletAddress, setWalletAddress] = useState(initialValues.balance)
+ const [wallet, setWallet] = useState(null)
const { latestBeeRelease } = useLatestBeeRelease()
@@ -356,6 +360,12 @@ export function Provider({ children }: Props): ReactElement {
.then(setChainState)
.catch(() => setChainState(null)),
+ // Wallet
+ beeDebugApi
+ .getWalletBalance({ timeout: TIMEOUT })
+ .then(setWallet)
+ .catch(() => setWallet(null)),
+
// Chequebook balance
chequeBalanceWrapper()
.then(setChequebookBalance)
@@ -446,6 +456,7 @@ export function Provider({ children }: Props): ReactElement {
peerCheques,
settlements,
chainState,
+ wallet,
latestBeeRelease,
isLoading,
lastUpdate,
diff --git a/src/utils/chain.ts b/src/utils/chain.ts
new file mode 100644
index 0000000..23fcf28
--- /dev/null
+++ b/src/utils/chain.ts
@@ -0,0 +1,30 @@
+const chains = [
+ {
+ name: 'Ethereum Mainnet',
+ chainId: 1,
+ },
+ {
+ name: 'Ropsten Testnet',
+ chainId: 3,
+ },
+ {
+ name: 'Rinkeby Testnet',
+ chainId: 4,
+ },
+ {
+ name: 'Görli Testnet',
+ chainId: 5,
+ },
+ {
+ name: 'Kovan Testnet',
+ chainId: 42,
+ },
+ {
+ name: 'Gnosis Chain',
+ chainId: 100,
+ },
+]
+
+export function chainIdToName(chainId: number): string {
+ return chains.find(record => record.chainId === chainId)?.name || 'Unknown'
+}