feat: set default rpc endpoint (#485)

* feat: add default RPC endpoint

* feat: removed setting RPC endpoint altogherher and altered the routes accordingly
This commit is contained in:
Vojtech Simetka
2022-07-22 10:55:19 +02:00
committed by GitHub
parent 318592653c
commit cba21bb2e0
15 changed files with 179 additions and 259 deletions
+1 -3
View File
@@ -9,7 +9,6 @@ import HomeIcon from 'remixicon-react/Home3LineIcon'
import SettingsIcon from 'remixicon-react/Settings2LineIcon' import SettingsIcon from 'remixicon-react/Settings2LineIcon'
import AccountIcon from 'remixicon-react/Wallet3LineIcon' import AccountIcon from 'remixicon-react/Wallet3LineIcon'
import { Context as BeeContext } from '../providers/Bee' import { Context as BeeContext } from '../providers/Bee'
import { Context as TopUpContext } from '../providers/TopUp'
import DashboardLogo from '../assets/dashboard-logo.svg' import DashboardLogo from '../assets/dashboard-logo.svg'
import DesktopLogo from '../assets/desktop-logo.svg' import DesktopLogo from '../assets/desktop-logo.svg'
import { config } from '../config' import { config } from '../config'
@@ -69,7 +68,6 @@ const useStyles = makeStyles((theme: Theme) =>
export default function SideBar(): ReactElement { export default function SideBar(): ReactElement {
const classes = useStyles() const classes = useStyles()
const { isBeeDesktop } = useIsBeeDesktop() const { isBeeDesktop } = useIsBeeDesktop()
const { providerUrl } = useContext(TopUpContext)
const { nodeInfo } = useContext(BeeContext) const { nodeInfo } = useContext(BeeContext)
const navBarItems = [ const navBarItems = [
@@ -86,7 +84,7 @@ export default function SideBar(): ReactElement {
}, },
{ {
label: 'Account', label: 'Account',
path: providerUrl === null ? ROUTES.WALLET : ROUTES.ACCOUNT_WALLET, path: ROUTES.ACCOUNT_WALLET,
icon: AccountIcon, icon: AccountIcon,
pathMatcherSubstring: '/account/', pathMatcherSubstring: '/account/',
}, },
+2
View File
@@ -8,6 +8,7 @@ class Config {
public readonly BEE_DESKTOP_URL: string public readonly BEE_DESKTOP_URL: string
public readonly SENTRY_KEY: string | undefined public readonly SENTRY_KEY: string | undefined
public readonly SENTRY_ENVIRONMENT: string | undefined public readonly SENTRY_ENVIRONMENT: string | undefined
public readonly DEFAULT_RPC_URL: string
constructor() { constructor() {
this.BEE_API_HOST = sessionStorage.getItem('api_host') ?? process.env.REACT_APP_BEE_HOST ?? 'http://localhost:1633' this.BEE_API_HOST = sessionStorage.getItem('api_host') ?? process.env.REACT_APP_BEE_HOST ?? 'http://localhost:1633'
@@ -21,6 +22,7 @@ class Config {
this.BEE_DISCORD_HOST = process.env.REACT_APP_BEE_DISCORD_HOST ?? 'https://discord.gg/eKr9XPv7' this.BEE_DISCORD_HOST = process.env.REACT_APP_BEE_DISCORD_HOST ?? 'https://discord.gg/eKr9XPv7'
this.GITHUB_REPO_URL = process.env.REACT_APP_BEE_GITHUB_REPO_URL ?? 'https://api.github.com/repos/ethersphere/bee' this.GITHUB_REPO_URL = process.env.REACT_APP_BEE_GITHUB_REPO_URL ?? 'https://api.github.com/repos/ethersphere/bee'
this.BEE_DESKTOP_URL = process.env.REACT_APP_BEE_DESKTOP_URL ?? window.location.origin this.BEE_DESKTOP_URL = process.env.REACT_APP_BEE_DESKTOP_URL ?? window.location.origin
this.DEFAULT_RPC_URL = process.env.REACT_APP_DEFAULT_RPC_URL ?? 'https://xdai.fairdatasociety.org'
} }
} }
+1 -1
View File
@@ -29,7 +29,7 @@ export function AccountWallet(): ReactElement {
} }
function onDeposit() { function onDeposit() {
navigate(ROUTES.CONFIRMATION) navigate(ROUTES.TOP_UP)
} }
return ( return (
-1
View File
@@ -29,7 +29,6 @@ export default function Index(): ReactElement {
useEffect(() => { useEffect(() => {
async function mapGiftWallets() { async function mapGiftWallets() {
if (!provider) return
const results = [] const results = []
for (const giftWallet of giftWallets) { for (const giftWallet of giftWallets) {
results.push(await ResolvedWallet.make(giftWallet, provider)) results.push(await ResolvedWallet.make(giftWallet, provider))
+1 -1
View File
@@ -51,7 +51,7 @@ export default function Status(): ReactElement {
buttonProps={{ buttonProps={{
iconType: Wallet, iconType: Wallet,
children: 'Setup wallet', children: 'Setup wallet',
onClick: () => navigate(ROUTES.WALLET), onClick: () => navigate(ROUTES.TOP_UP),
}} }}
icon={<Upload />} icon={<Upload />}
title="Your wallet is not setup." title="Your wallet is not setup."
-120
View File
@@ -1,120 +0,0 @@
import { Box, createStyles, Grid, makeStyles, Typography } from '@material-ui/core'
import { ReactElement, useContext, useState } from 'react'
import Check from 'remixicon-react/CheckLineIcon'
import BankCard from 'remixicon-react/BankCard2LineIcon'
import MoneyDollarCircle from 'remixicon-react/MoneyDollarCircleLineIcon'
import Gift from 'remixicon-react/GiftLineIcon'
import { useNavigate } from 'react-router'
import ExpandableListItemActions from '../../components/ExpandableListItemActions'
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({
checkWrapper: {
background: 'rgba(0, 230, 118, 0.25)',
borderRadius: 99999,
width: '180px',
height: '180px',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
},
}),
)
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 <Loading />
}
return (
<>
<HistoryHeader>Connect to the blockchain</HistoryHeader>
<Grid container direction="column" alignItems="center">
<Box mb={6}>
<div className={styles.checkWrapper}>
<Check size={100} color="#ededed" />
</div>
</Box>
<Box mb={1}>
<Typography style={{ fontWeight: 'bold' }}>Your node&apos;s RPC endpoint is set up correctly!</Typography>
</Box>
<Box mb={4}>
<Typography align="center">Lastly, you will need to top-up your node wallet.</Typography>
<Typography align="center">
If you&apos;re not familiar with cryptocurrencies, you can start with a bank card.
</Typography>
</Box>
<ExpandableListItemActions>
<SwarmButton iconType={Gift} onClick={() => navigate(ROUTES.TOP_UP_GIFT_CODE)}>
Use a gift code
</SwarmButton>
<SwarmButton iconType={MoneyDollarCircle} onClick={() => navigate(ROUTES.TOP_UP_CRYPTO)}>
Use DAI
</SwarmButton>
<SwarmButton iconType={BankCard} onClick={() => navigate(ROUTES.TOP_UP_BANK_CARD)}>
Get started with bank card
</SwarmButton>
</ExpandableListItemActions>
{canUpgradeToLightNode && (
<>
<Box mt={8} mb={2}>
<Typography align="center">
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.
</Typography>
</Box>
<ExpandableListItemActions>
<SwarmButton iconType={Check} onClick={restart} disabled={loading} loading={loading}>
Upgrade now
</SwarmButton>
<div />
</ExpandableListItemActions>
</>
)}
</Grid>
</>
)
}
-67
View File
@@ -1,67 +0,0 @@
import { Box, Typography } from '@material-ui/core'
import { useSnackbar } from 'notistack'
import { ReactElement, useContext, useState } from 'react'
import Check from 'remixicon-react/CheckLineIcon'
import { useNavigate } from 'react-router'
import { providers } from 'ethers'
import { HistoryHeader } from '../../components/HistoryHeader'
import { SwarmButton } from '../../components/SwarmButton'
import { SwarmTextInput } from '../../components/SwarmTextInput'
import { Context } from '../../providers/TopUp'
import { ROUTES } from '../../routes'
import { Rpc } from '../../utils/rpc'
export default function Index(): ReactElement {
const { providerUrl, setProviderUrl } = useContext(Context)
const [localProviderUrl, setLocalProviderUrl] = useState(providerUrl)
const { enqueueSnackbar } = useSnackbar()
const navigate = useNavigate()
async function onSubmit() {
if (!localProviderUrl) return
try {
await Rpc.eth_getBlockByNumber(new providers.JsonRpcProvider(localProviderUrl))
enqueueSnackbar('Connected to RPC provider successfully.', { variant: 'success' })
setProviderUrl(localProviderUrl)
navigate(ROUTES.CONFIRMATION)
} catch (error) {
enqueueSnackbar('Could not connect to RPC provider.', { variant: 'error' })
}
}
return (
<>
<HistoryHeader>Connect to the blockchain</HistoryHeader>
<Box mb={1}>
<Typography style={{ fontWeight: 'bold' }}>Set up RPC endpoint</Typography>
</Box>
<Box mb={4}>
<Typography>
To connect to and retrieve data from the blockchain, you&apos;ll need to connect to a publicly-provided node
via the node&apos;s RPC endpoint. If you&apos;re not familiar with this, please read{' '}
<a
href="https://medium.com/ethereum-swarm/upgrading-swarm-deskotp-app-beta-from-an-ultra-light-to-a-light-node-65d52cab7f2c"
target="_blank"
rel="noreferrer"
>
this guide
</a>
.
</Typography>
</Box>
<Box mb={2}>
<SwarmTextInput
name="rpc-endpoint"
label="RPC Endpoint"
onChange={event => setLocalProviderUrl(event.target.value)}
defaultValue={providerUrl || ''}
/>
</Box>
<SwarmButton iconType={Check} onClick={onSubmit}>
Connect
</SwarmButton>
</>
)
}
+60
View File
@@ -0,0 +1,60 @@
import { Box, Grid, Typography } from '@material-ui/core'
import { ReactElement, useContext } from 'react'
import { useNavigate } from 'react-router'
import Check from 'remixicon-react/CheckLineIcon'
import ExpandableListItem from '../../components/ExpandableListItem'
import ExpandableListItemKey from '../../components/ExpandableListItemKey'
import { HistoryHeader } from '../../components/HistoryHeader'
import { Loading } from '../../components/Loading'
import { SwarmButton } from '../../components/SwarmButton'
import { SwarmDivider } from '../../components/SwarmDivider'
import { Context } from '../../providers/Bee'
import { TopUpProgressIndicator } from './TopUpProgressIndicator'
const MINIMUM_XDAI = '0.5'
interface Props {
header: string
title: string
p: ReactElement
next: string
}
export default function Index({ header, title, p, next }: Props): ReactElement {
const { nodeAddresses, balance } = useContext(Context)
const navigate = useNavigate()
if (!balance || !nodeAddresses) {
return <Loading />
}
const disabled = balance.dai.toDecimal.lt(MINIMUM_XDAI)
return (
<>
<HistoryHeader>{header}</HistoryHeader>
<Box mb={4}>
<TopUpProgressIndicator index={0} />
</Box>
<Box mb={2}>
<Typography style={{ fontWeight: 'bold' }}>{title}</Typography>
</Box>
<Box mb={4}>{p}</Box>
<SwarmDivider mb={4} />
<Box mb={0.25}>
<ExpandableListItemKey label="Funding wallet address" value={nodeAddresses.ethereum} expanded />
</Box>
<Box mb={4}>
<ExpandableListItem label="xDAI balance" value={balance.dai.toSignificantDigits(4)} />
</Box>
<Grid container direction="row" justifyContent="space-between">
<SwarmButton iconType={Check} onClick={() => navigate(next)} disabled={disabled}>
Proceed
</SwarmButton>
{disabled ? (
<Typography>Please deposit at least {MINIMUM_XDAI} xDAI to the address above in order to proceed.</Typography>
) : null}
</Grid>
</>
)
}
+2 -2
View File
@@ -1,11 +1,11 @@
import { Typography } from '@material-ui/core' import { Typography } from '@material-ui/core'
import { ReactElement } from 'react' import { ReactElement } from 'react'
import Index from '.' import Balance from './Balance'
import { ROUTES } from '../../routes' import { ROUTES } from '../../routes'
export function BankCardTopUpIndex(): ReactElement { export function BankCardTopUpIndex(): ReactElement {
return ( return (
<Index <Balance
header={'Top-up with bank card'} header={'Top-up with bank card'}
title={'Use a bank card to buy xDAI to the funding wallet address below'} title={'Use a bank card to buy xDAI to the funding wallet address below'}
p={ p={
+2 -2
View File
@@ -1,11 +1,11 @@
import { Typography } from '@material-ui/core' import { Typography } from '@material-ui/core'
import { ReactElement } from 'react' import { ReactElement } from 'react'
import Index from '.' import Balance from './Balance'
import { ROUTES } from '../../routes' import { ROUTES } from '../../routes'
export function CryptoTopUpIndex(): ReactElement { export function CryptoTopUpIndex(): ReactElement {
return ( return (
<Index <Balance
header={'Top-up with cryptocurrencies'} header={'Top-up with cryptocurrencies'}
title={'Send xDAI to the funding wallet below'} title={'Send xDAI to the funding wallet below'}
p={ p={
-4
View File
@@ -48,10 +48,6 @@ export function GiftCardFund(): ReactElement {
const canUpgradeToLightNode = isBeeDesktop && nodeInfo?.beeMode === BeeModes.ULTRA_LIGHT const canUpgradeToLightNode = isBeeDesktop && nodeInfo?.beeMode === BeeModes.ULTRA_LIGHT
async function restart() { async function restart() {
if (!providerUrl) {
return
}
try { try {
await sleepMs(5_000) await sleepMs(5_000)
await upgradeToLightNode(providerUrl) await upgradeToLightNode(providerUrl)
+1 -5
View File
@@ -78,10 +78,6 @@ export function Swap({ header }: Props): ReactElement {
const canUpgradeToLightNode = isBeeDesktop && nodeInfo?.beeMode === BeeModes.ULTRA_LIGHT const canUpgradeToLightNode = isBeeDesktop && nodeInfo?.beeMode === BeeModes.ULTRA_LIGHT
async function restart() { async function restart() {
if (!providerUrl) {
return
}
try { try {
await sleepMs(5_000) await sleepMs(5_000)
await upgradeToLightNode(providerUrl) await upgradeToLightNode(providerUrl)
@@ -94,7 +90,7 @@ export function Swap({ header }: Props): ReactElement {
} }
async function onSwap() { async function onSwap() {
if (hasSwapped || !providerUrl) { if (hasSwapped) {
return return
} }
setLoading(true) setLoading(true)
+101 -43
View File
@@ -1,59 +1,117 @@
import { Box, Grid, Typography } from '@material-ui/core' import { Box, createStyles, Grid, makeStyles, Typography } from '@material-ui/core'
import { ReactElement, useContext } from 'react' import { ReactElement, useContext, useState } from 'react'
import { useNavigate } from 'react-router'
import Check from 'remixicon-react/CheckLineIcon' import Check from 'remixicon-react/CheckLineIcon'
import ExpandableListItem from '../../components/ExpandableListItem' import Download from 'remixicon-react/DownloadLineIcon'
import ExpandableListItemKey from '../../components/ExpandableListItemKey' import BankCard from 'remixicon-react/BankCard2LineIcon'
import MoneyDollarCircle from 'remixicon-react/MoneyDollarCircleLineIcon'
import Gift from 'remixicon-react/GiftLineIcon'
import { useNavigate } from 'react-router'
import ExpandableListItemActions from '../../components/ExpandableListItemActions'
import { HistoryHeader } from '../../components/HistoryHeader' import { HistoryHeader } from '../../components/HistoryHeader'
import { Loading } from '../../components/Loading'
import { SwarmButton } from '../../components/SwarmButton' import { SwarmButton } from '../../components/SwarmButton'
import { SwarmDivider } from '../../components/SwarmDivider' import { ROUTES } from '../../routes'
import { Context } from '../../providers/Bee' import { Context as BeeContext } from '../../providers/Bee'
import { TopUpProgressIndicator } from './TopUpProgressIndicator' 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 MINIMUM_XDAI = '0.5' const useStyles = makeStyles(() =>
createStyles({
checkWrapper: {
background: 'rgba(0, 230, 118, 0.25)',
borderRadius: 99999,
width: '180px',
height: '180px',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
},
}),
)
interface Props { const MINIMUM_XDAI = '0.05'
header: string const MINIMUM_XBZZ = '0.1'
title: string
p: ReactElement
next: string
}
export default function Index({ header, title, p, next }: Props): ReactElement { export default function TopUp(): ReactElement {
const { nodeAddresses, balance } = useContext(Context)
const navigate = useNavigate() 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()
if (!balance || !nodeAddresses) { const canUpgradeToLightNode =
isBeeDesktop &&
nodeInfo?.beeMode === BeeModes.ULTRA_LIGHT &&
balance?.dai.toDecimal.gte(MINIMUM_XDAI) &&
balance?.bzz.toDecimal.gte(MINIMUM_XBZZ)
async function restart() {
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 <Loading /> return <Loading />
} }
const disabled = balance.dai.toDecimal.lt(MINIMUM_XDAI)
return ( return (
<> <>
<HistoryHeader>{header}</HistoryHeader> <HistoryHeader>Account</HistoryHeader>
<Box mb={4}> <Grid container direction="column" alignItems="center">
<TopUpProgressIndicator index={0} /> <Box mb={6}>
</Box> <div className={styles.checkWrapper}>
<Box mb={2}> <Download size={100} color="#ededed" />
<Typography style={{ fontWeight: 'bold' }}>{title}</Typography> </div>
</Box> </Box>
<Box mb={4}>{p}</Box> <Box mb={1}>
<SwarmDivider mb={4} /> <Typography style={{ fontWeight: 'bold' }}>Transfer funds to your Swarm account</Typography>
<Box mb={0.25}> </Box>
<ExpandableListItemKey label="Funding wallet address" value={nodeAddresses.ethereum} expanded /> <Box mb={4}>
</Box> <Typography align="center">Top up your account with xBZZ and xDAI.</Typography>
<Box mb={4}> <Typography align="center">
<ExpandableListItem label="xDAI balance" value={balance.dai.toSignificantDigits(4)} /> If you&apos;re not familiar with cryptocurrencies, you can start with a bank card.
</Box> </Typography>
<Grid container direction="row" justifyContent="space-between"> </Box>
<SwarmButton iconType={Check} onClick={() => navigate(next)} disabled={disabled}> <ExpandableListItemActions>
Proceed <SwarmButton iconType={Gift} onClick={() => navigate(ROUTES.TOP_UP_GIFT_CODE)}>
</SwarmButton> Use a gift code
{disabled ? ( </SwarmButton>
<Typography>Please deposit at least {MINIMUM_XDAI} xDAI to the address above in order to proceed.</Typography> <SwarmButton iconType={MoneyDollarCircle} onClick={() => navigate(ROUTES.TOP_UP_CRYPTO)}>
) : null} Use xDAI
</SwarmButton>
<SwarmButton iconType={BankCard} onClick={() => navigate(ROUTES.TOP_UP_BANK_CARD)}>
Get started with bank card
</SwarmButton>
</ExpandableListItemActions>
{canUpgradeToLightNode && (
<>
<Box mt={8} mb={2}>
<Typography align="center">
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.
</Typography>
</Box>
<ExpandableListItemActions>
<SwarmButton iconType={Check} onClick={restart} disabled={loading} loading={loading}>
Upgrade now
</SwarmButton>
<div />
</ExpandableListItemActions>
</>
)}
</Grid> </Grid>
</> </>
) )
+5 -4
View File
@@ -1,5 +1,6 @@
import { providers, Wallet } from 'ethers' import { providers, Wallet } from 'ethers'
import { createContext, ReactElement, useEffect, useState } from 'react' import { createContext, ReactElement, useEffect, useState } from 'react'
import config from '../config'
import { setJsonRpcInDesktop } from '../utils/desktop' import { setJsonRpcInDesktop } from '../utils/desktop'
const LocalStorageKeys = { const LocalStorageKeys = {
@@ -10,18 +11,18 @@ const LocalStorageKeys = {
} }
interface ContextInterface { interface ContextInterface {
providerUrl: string | null providerUrl: string
provider: providers.JsonRpcProvider | null provider: providers.JsonRpcProvider
giftWallets: Wallet[] giftWallets: Wallet[]
setProviderUrl: (providerUrl: string) => void setProviderUrl: (providerUrl: string) => void
addGiftWallet: (wallet: Wallet) => void addGiftWallet: (wallet: Wallet) => void
} }
const providerUrl = localStorage.getItem('json-rpc-provider') || null const providerUrl = localStorage.getItem('json-rpc-provider') || config.DEFAULT_RPC_URL
const initialValues: ContextInterface = { const initialValues: ContextInterface = {
providerUrl, providerUrl,
provider: providerUrl ? new providers.JsonRpcProvider(providerUrl) : null, provider: new providers.JsonRpcProvider(providerUrl),
giftWallets: [], giftWallets: [],
setProviderUrl: () => {}, // eslint-disable-line setProviderUrl: () => {}, // eslint-disable-line
addGiftWallet: () => {}, // eslint-disable-line addGiftWallet: () => {}, // eslint-disable-line
+3 -6
View File
@@ -14,8 +14,7 @@ import { UploadLander } from './pages/files/UploadLander'
import GiftCards from './pages/gift-code' import GiftCards from './pages/gift-code'
import Info from './pages/info' import Info from './pages/info'
import LightModeRestart from './pages/restart/LightModeRestart' import LightModeRestart from './pages/restart/LightModeRestart'
import Wallet from './pages/rpc' import TopUp from './pages/top-up'
import Confirmation from './pages/rpc/Confirmation'
import Settings from './pages/settings' import Settings from './pages/settings'
import { CreatePostageStampPage } from './pages/stamps/CreatePostageStampPage' import { CreatePostageStampPage } from './pages/stamps/CreatePostageStampPage'
import Status from './pages/status' import Status from './pages/status'
@@ -34,8 +33,7 @@ export enum ROUTES {
HASH = '/files/hash/:hash', HASH = '/files/hash/:hash',
SETTINGS = '/settings', SETTINGS = '/settings',
STATUS = '/status', STATUS = '/status',
WALLET = '/account/wallet/top-up', TOP_UP = '/account/wallet/top-up',
CONFIRMATION = '/account/wallet/top-up/confirmation',
TOP_UP_CRYPTO = '/account/wallet/top-up/crypto', TOP_UP_CRYPTO = '/account/wallet/top-up/crypto',
TOP_UP_CRYPTO_SWAP = '/account/wallet/top-up/crypto/swap', TOP_UP_CRYPTO_SWAP = '/account/wallet/top-up/crypto/swap',
TOP_UP_BANK_CARD = '/account/wallet/top-up/bank-card', TOP_UP_BANK_CARD = '/account/wallet/top-up/bank-card',
@@ -70,8 +68,7 @@ const BaseRouter = (): ReactElement => (
<Route path={ROUTES.SETTINGS} element={<Settings />} /> <Route path={ROUTES.SETTINGS} element={<Settings />} />
<Route path={ROUTES.STATUS} element={<Status />} /> <Route path={ROUTES.STATUS} element={<Status />} />
<Route path={ROUTES.INFO} element={<Info />} /> <Route path={ROUTES.INFO} element={<Info />} />
<Route path={ROUTES.WALLET} element={<Wallet />} /> <Route path={ROUTES.TOP_UP} element={<TopUp />} />
<Route path={ROUTES.CONFIRMATION} element={<Confirmation />} />
<Route path={ROUTES.TOP_UP_CRYPTO} element={<CryptoTopUpIndex />} /> <Route path={ROUTES.TOP_UP_CRYPTO} element={<CryptoTopUpIndex />} />
<Route path={ROUTES.TOP_UP_CRYPTO_SWAP} element={<Swap header="Top-up with cryptocurrencies" />} /> <Route path={ROUTES.TOP_UP_CRYPTO_SWAP} element={<Swap header="Top-up with cryptocurrencies" />} />
<Route path={ROUTES.TOP_UP_BANK_CARD} element={<BankCardTopUpIndex />} /> <Route path={ROUTES.TOP_UP_BANK_CARD} element={<BankCardTopUpIndex />} />