diff --git a/src/pages/rpc/Confirmation.tsx b/src/pages/rpc/Confirmation.tsx index f00433d..9cbacee 100644 --- a/src/pages/rpc/Confirmation.tsx +++ b/src/pages/rpc/Confirmation.tsx @@ -1,5 +1,5 @@ import { Box, createStyles, Grid, makeStyles, Typography } from '@material-ui/core' -import { ReactElement } from 'react' +import { ReactElement, useContext, useState } from 'react' import Check from 'remixicon-react/CheckLineIcon' import BankCard from 'remixicon-react/BankCard2LineIcon' import MoneyDollarCircle from 'remixicon-react/MoneyDollarCircleLineIcon' @@ -9,6 +9,13 @@ import ExpandableListItemActions from '../../components/ExpandableListItemAction import { HistoryHeader } from '../../components/HistoryHeader' import { SwarmButton } from '../../components/SwarmButton' import { ROUTES } from '../../routes' +import { Context as BeeContext } from '../../providers/Bee' +import { Context as TopUpContext } from '../../providers/TopUp' +import { useIsBeeDesktop } from '../../hooks/apiHooks' +import { BeeModes } from '@ethersphere/bee-js' +import { restartBeeNode, upgradeToLightNode } from '../../utils/desktop' +import { Loading } from '../../components/Loading' +import { useSnackbar } from 'notistack' const useStyles = makeStyles(() => createStyles({ @@ -24,10 +31,43 @@ const useStyles = makeStyles(() => }), ) +const MINIMUM_XDAI = '0.05' +const MINIMUM_XBZZ = '0.1' + export default function Confirmation(): ReactElement { const navigate = useNavigate() - const styles = useStyles() + const { isBeeDesktop } = useIsBeeDesktop() + const { balance, nodeInfo } = useContext(BeeContext) + const { providerUrl } = useContext(TopUpContext) + const [loading, setLoading] = useState(false) + const { enqueueSnackbar } = useSnackbar() + + const canUpgradeToLightNode = + isBeeDesktop && + nodeInfo?.beeMode === BeeModes.ULTRA_LIGHT && + balance?.dai.toDecimal.gte(MINIMUM_XDAI) && + balance?.bzz.toDecimal.gte(MINIMUM_XBZZ) + + async function restart() { + if (!providerUrl) { + return + } + setLoading(true) + try { + await upgradeToLightNode(providerUrl) + await restartBeeNode() + enqueueSnackbar('Upgraded to light node', { variant: 'success' }) + navigate(ROUTES.RESTART_LIGHT) + } catch (error) { + enqueueSnackbar(`Failed to upgrade: ${error}`, { variant: 'error' }) + } + setLoading(false) + } + + if (!balance) { + return + } return ( <> @@ -58,6 +98,22 @@ export default function Confirmation(): ReactElement { Get started with bank card + {canUpgradeToLightNode && ( + <> + + + It seems that you have enough balance to upgrade your bee node to light node. By upgrading you will gain + access to file upload and faster downloads. + + + + + Upgrade now + +
+ + + )} ) diff --git a/src/pages/top-up/GiftCardFund.tsx b/src/pages/top-up/GiftCardFund.tsx index d95bf49..51b2585 100644 --- a/src/pages/top-up/GiftCardFund.tsx +++ b/src/pages/top-up/GiftCardFund.tsx @@ -17,9 +17,12 @@ import { ROUTES } from '../../routes' import { sleepMs } from '../../utils' import { restartBeeNode, upgradeToLightNode } from '../../utils/desktop' import { ResolvedWallet } from '../../utils/wallet' +import { useIsBeeDesktop } from '../../hooks/apiHooks' +import { BeeModes } from '@ethersphere/bee-js' export function GiftCardFund(): ReactElement { - const { nodeAddresses, balance } = useContext(BeeContext) + const { isBeeDesktop } = useIsBeeDesktop() + const { nodeAddresses, balance, nodeInfo } = useContext(BeeContext) const { provider, providerUrl } = useContext(TopUpContext) const [loading, setLoading] = useState(false) @@ -42,6 +45,24 @@ export function GiftCardFund(): ReactElement { return } + const canUpgradeToLightNode = isBeeDesktop && nodeInfo?.beeMode === BeeModes.ULTRA_LIGHT + + async function restart() { + if (!providerUrl) { + return + } + + try { + await sleepMs(5_000) + await upgradeToLightNode(providerUrl) + await restartBeeNode() + enqueueSnackbar('Upgraded to light node', { variant: 'success' }) + navigate(ROUTES.RESTART_LIGHT) + } catch (error) { + enqueueSnackbar(`Failed to upgrade: ${error}`, { variant: 'error' }) + } + } + async function onFund() { if (!wallet || !nodeAddresses || !providerUrl) { return @@ -51,13 +72,11 @@ export function GiftCardFund(): ReactElement { try { await wallet.transfer(nodeAddresses.ethereum, providerUrl) - enqueueSnackbar('Successfully funded node, restarting...', { variant: 'success' }) - await sleepMs(5_000) - await upgradeToLightNode(providerUrl) - await restartBeeNode() - navigate(ROUTES.RESTART_LIGHT) + enqueueSnackbar('Successfully funded node', { variant: 'success' }) + + if (canUpgradeToLightNode) await restart() } catch (error) { - enqueueSnackbar(`Failed to fund/restart node: ${error}`, { variant: 'error' }) + enqueueSnackbar(`Failed to fund: ${error}`, { variant: 'error' }) } finally { setLoading(false) } @@ -101,7 +120,7 @@ export function GiftCardFund(): ReactElement { - Send all funds to your node + {canUpgradeToLightNode ? 'Send all funds to your node and Upgrade' : 'Send all funds to your node'} ) diff --git a/src/pages/top-up/Swap.tsx b/src/pages/top-up/Swap.tsx index b24ec7d..d774458 100644 --- a/src/pages/top-up/Swap.tsx +++ b/src/pages/top-up/Swap.tsx @@ -1,3 +1,4 @@ +import { BeeModes } from '@ethersphere/bee-js' import { Box, Typography } from '@material-ui/core' import BigNumber from 'bignumber.js' import { useSnackbar } from 'notistack' @@ -13,6 +14,7 @@ import { Loading } from '../../components/Loading' import { SwarmButton } from '../../components/SwarmButton' import { SwarmDivider } from '../../components/SwarmDivider' import { SwarmTextInput } from '../../components/SwarmTextInput' +import { useIsBeeDesktop } from '../../hooks/apiHooks' import { BzzToken } from '../../models/BzzToken' import { DaiToken } from '../../models/DaiToken' import { Context as BeeContext } from '../../providers/Bee' @@ -36,7 +38,8 @@ export function Swap({ header }: Props): ReactElement { const [price] = useState(DaiToken.fromDecimal('0.6', 18)) const { providerUrl } = useContext(TopUpContext) - const { balance, nodeAddresses } = useContext(BeeContext) + const { balance, nodeAddresses, nodeInfo } = useContext(BeeContext) + const { isBeeDesktop } = useIsBeeDesktop() const navigate = useNavigate() const { enqueueSnackbar } = useSnackbar() @@ -67,6 +70,24 @@ export function Swap({ header }: Props): ReactElement { const daiAfterSwap = new DaiToken(balance.dai.toBigNumber.minus(daiToSwap.toBigNumber)) const bzzAfterSwap = new BzzToken(daiToSwap.toBigNumber.dividedBy(100).dividedToIntegerBy(price.toDecimal)) + const canUpgradeToLightNode = isBeeDesktop && nodeInfo?.beeMode === BeeModes.ULTRA_LIGHT + + async function restart() { + if (!providerUrl) { + return + } + + try { + await sleepMs(5_000) + await upgradeToLightNode(providerUrl) + await restartBeeNode() + enqueueSnackbar('Upgraded to light node', { variant: 'success' }) + navigate(ROUTES.RESTART_LIGHT) + } catch (error) { + enqueueSnackbar(`Failed to upgrade: ${error}`, { variant: 'error' }) + } + } + async function onSwap() { if (hasSwapped || !providerUrl) { return @@ -75,12 +96,9 @@ export function Swap({ header }: Props): ReactElement { setSwapped(true) try { await performSwap(daiToSwap.toString) - enqueueSnackbar('Successfully swapped, restarting...', { variant: 'success' }) - await sleepMs(5_000) - await upgradeToLightNode(providerUrl) - await restartBeeNode() - navigate(ROUTES.RESTART_LIGHT) - enqueueSnackbar('Upgraded to light node', { variant: 'success' }) + enqueueSnackbar('Successfully swapped', { variant: 'success' }) + + if (canUpgradeToLightNode) await restart() } catch (error) { enqueueSnackbar(`Failed to swap: ${error}`, { variant: 'error' }) } finally { @@ -152,7 +170,7 @@ export function Swap({ header }: Props): ReactElement { } loading={loading} > - Swap Now + {canUpgradeToLightNode ? 'Swap Now and Upgrade' : 'Swap Now'} diff --git a/src/routes.tsx b/src/routes.tsx index 09b8e3a..cc2830b 100644 --- a/src/routes.tsx +++ b/src/routes.tsx @@ -42,7 +42,6 @@ export enum ROUTES { TOP_UP_BANK_CARD_SWAP = '/account/wallet/top-up/bank-card/swap', TOP_UP_GIFT_CODE = '/account/wallet/top-up/gift-code', TOP_UP_GIFT_CODE_FUND = '/account/wallet/top-up/gift-code/fund/:privateKeyString', - RESTART = '/restart', RESTART_LIGHT = '/light-mode-restart', ACCOUNT_WALLET = '/account/wallet', ACCOUNT_CHEQUEBOOK = '/account/chequebook',