fix: put back external wallet balance context (#704)

* fix: put back external wallet balance context

* fix: include top up index page

* fix: include gift code index page

* fix: add BalanceProvider

src/pages/top-up/index.tsx

@@ -1,5 +1,5 @@
-import { Box, createStyles, Grid, makeStyles, Typography } from '@material-ui/core'
 import { BeeModes, BZZ, DAI } from '@ethersphere/bee-js'
+import { Box, createStyles, Grid, makeStyles, Typography } from '@material-ui/core'
 import { useSnackbar } from 'notistack'
 import { ReactElement, useContext, useState } from 'react'
 import { useNavigate } from 'react-router'
@@ -15,6 +15,7 @@ import { SwarmButton } from '../../components/SwarmButton'
 import TroubleshootConnectionCard from '../../components/TroubleshootConnectionCard'
 import { Context as BeeContext, CheckState } from '../../providers/Bee'
 import { Context as SettingsContext } from '../../providers/Settings'
+import { Context as BalanceProvider } from '../../providers/WalletBalance'
 import { ROUTES } from '../../routes'
 import { restartBeeNode, upgradeToLightNode } from '../../utils/desktop'
 
@@ -39,7 +40,8 @@ export default function TopUp(): ReactElement {
   const navigate = useNavigate()
   const styles = useStyles()
   const { isDesktop, desktopUrl } = useContext(SettingsContext)
-  const { nodeInfo, status, walletBalance } = useContext(BeeContext)
+  const { nodeInfo, status } = useContext(BeeContext)
+  const { balance } = useContext(BalanceProvider)
   const { rpcProviderUrl } = useContext(SettingsContext)
   const [loading, setLoading] = useState(false)
   const { enqueueSnackbar } = useSnackbar()
@@ -47,8 +49,8 @@ export default function TopUp(): ReactElement {
   const canUpgradeToLightNode =
     isDesktop &&
     nodeInfo?.beeMode === BeeModes.ULTRA_LIGHT &&
-    walletBalance?.nativeTokenBalance.gte(MINIMUM_XDAI) &&
-    walletBalance?.bzzBalance.gte(MINIMUM_XBZZ)
+    balance?.dai.gte(MINIMUM_XDAI) &&
+    balance?.bzz.gte(MINIMUM_XBZZ)
 
   async function restart() {
     setLoading(true)
@@ -65,7 +67,7 @@ export default function TopUp(): ReactElement {
 
   if (status.all === CheckState.ERROR) return <TroubleshootConnectionCard />
 
-  if (!walletBalance) {
+  if (!balance) {
     return <Loading />
   }