diff --git a/nym-wallet/src/components/AppBar.tsx b/nym-wallet/src/components/AppBar.tsx index ce0d1f9729..7bafc1a6b4 100644 --- a/nym-wallet/src/components/AppBar.tsx +++ b/nym-wallet/src/components/AppBar.tsx @@ -5,6 +5,7 @@ import { Logout } from '@mui/icons-material' import { ClientContext } from '../context/main' import { CopyToClipboard, NetworkSelector } from '.' import { Node as NodeIcon } from '../svg-icons/node' +import { splice } from '../utils' export const AppBar = () => { const { userBalance, clientDetails, showSettings, logOut, handleShowSettings } = useContext(ClientContext) @@ -24,7 +25,7 @@ export const AppBar = () => { } /> diff --git a/nym-wallet/src/hooks/useGetBalance.tsx b/nym-wallet/src/hooks/useGetBalance.tsx index 0aae41a583..6750b9f22d 100644 --- a/nym-wallet/src/hooks/useGetBalance.tsx +++ b/nym-wallet/src/hooks/useGetBalance.tsx @@ -14,7 +14,7 @@ export type TUseuserBalance = { isLoading: boolean fetchBalance: () => void clearBalance: () => void - fetchTokenAllocation: (address: string) => Promise + handleRefresh: () => void } export const useGetBalance = (address?: string): TUseuserBalance => { @@ -69,6 +69,10 @@ export const useGetBalance = (address?: string): TUseuserBalance => { const clearTokenAllocation = () => setTokenAllocation(undefined) useEffect(() => { + handleRefresh(address) + }, [address]) + + const handleRefresh = (address?: string) => { if (address) { fetchBalance() fetchTokenAllocation(address) @@ -76,7 +80,7 @@ export const useGetBalance = (address?: string): TUseuserBalance => { clearBalance() clearTokenAllocation() } - }, [address]) + } return { error, @@ -84,7 +88,7 @@ export const useGetBalance = (address?: string): TUseuserBalance => { balance, tokenAllocation, fetchBalance, - fetchTokenAllocation, clearBalance, + handleRefresh, } } diff --git a/nym-wallet/src/pages/balance/vesting.tsx b/nym-wallet/src/pages/balance/vesting.tsx index 4f5979a031..d1e451adf8 100644 --- a/nym-wallet/src/pages/balance/vesting.tsx +++ b/nym-wallet/src/pages/balance/vesting.tsx @@ -46,6 +46,9 @@ export const VestingCard = () => { +
+        {JSON.stringify(userBalance.tokenAllocation)}
+      
) } diff --git a/nym-wallet/src/pages/receive/index.tsx b/nym-wallet/src/pages/receive/index.tsx index 97e5b74e20..135e91dcb3 100644 --- a/nym-wallet/src/pages/receive/index.tsx +++ b/nym-wallet/src/pages/receive/index.tsx @@ -5,6 +5,7 @@ import { CopyToClipboard, NymCard } from '../../components' import { Layout } from '../../layouts' import { ClientContext } from '../../context/main' import { ArrowBack } from '@mui/icons-material' +import { splice } from '../../utils' export const Receive = () => { const { clientDetails, currency } = useContext(ClientContext) @@ -26,7 +27,7 @@ export const Receive = () => { }} component="span" > - Your address: {clientDetails?.client_address} + Your address: {splice(4, 35, clientDetails?.client_address)} diff --git a/nym-wallet/src/pages/send/SendForm.tsx b/nym-wallet/src/pages/send/SendForm.tsx index a44001eddb..ef9677cc88 100644 --- a/nym-wallet/src/pages/send/SendForm.tsx +++ b/nym-wallet/src/pages/send/SendForm.tsx @@ -3,6 +3,7 @@ import { Grid, InputAdornment, TextField, Typography } from '@mui/material' import { useFormContext } from 'react-hook-form' import { ClientContext } from '../../context/main' import { Fee } from '../../components' +import { splice } from '../..//utils' export const SendForm = () => { const { @@ -14,7 +15,7 @@ export const SendForm = () => { return ( - Your address: {clientDetails?.client_address} + Your address: {splice(4, 35, clientDetails?.client_address)} diff --git a/nym-wallet/src/utils/index.ts b/nym-wallet/src/utils/index.ts index 10d5d0d2f4..6bc81a81a4 100644 --- a/nym-wallet/src/utils/index.ts +++ b/nym-wallet/src/utils/index.ts @@ -124,3 +124,11 @@ export const currencyMap = (network?: Network) => { return currency } + +export const splice = (start: number, deleteCount: number, address?: string) => { + if (address) { + const array = address.split('') + array.splice(start, deleteCount, '...') + return array.join('') + } +}