diff --git a/packages/core-mobile/app/screens/earn/ClaimRewards.tsx b/packages/core-mobile/app/screens/earn/ClaimRewards.tsx index f6c7751e8a..746fafccd5 100644 --- a/packages/core-mobile/app/screens/earn/ClaimRewards.tsx +++ b/packages/core-mobile/app/screens/earn/ClaimRewards.tsx @@ -40,7 +40,7 @@ import { ConfirmScreen } from './components/ConfirmScreen' type ScreenProps = EarnScreenProps const ClaimRewards = (): JSX.Element | null => { - const { theme } = useApplicationContext() + const { theme, appHook } = useApplicationContext() const { navigate, goBack } = useNavigation() const onBack = useRoute().params?.onBack const { data } = usePChainBalance() @@ -85,29 +85,42 @@ const ClaimRewards = (): JSX.Element | null => { } }, [navigate, showFeeError, insufficientBalanceForFee]) - const [claimableAmountInAvax, claimableAmountInCurrency] = useMemo(() => { - if (data?.balancePerType.unlockedUnstaked) { - const unlockedInUnit = new TokenUnit( - data.balancePerType.unlockedUnstaked, - pNetwork.networkToken.decimals, - pNetwork.networkToken.symbol - ) - return [ - unlockedInUnit.toDisplay(), - unlockedInUnit.mul(avaxPrice).toDisplay() - ] + const [claimableAmountInAvax, formattedClaimableAmountInCurrency] = + useMemo(() => { + if (data?.balancePerType.unlockedUnstaked) { + const unlockedInUnit = new TokenUnit( + data.balancePerType.unlockedUnstaked, + pNetwork.networkToken.decimals, + pNetwork.networkToken.symbol + ) + return [ + unlockedInUnit.toDisplay(), + appHook.tokenInCurrencyFormatter( + unlockedInUnit.mul(avaxPrice).toDisplay({ asNumber: true }) + ) + ] + } + return [UNKNOWN_AMOUNT, UNKNOWN_AMOUNT] + }, [ + avaxPrice, + data?.balancePerType.unlockedUnstaked, + pNetwork.networkToken.decimals, + pNetwork.networkToken.symbol, + appHook + ]) + + const [feesInAvax, formattedFeesInCurrency] = useMemo(() => { + if (totalFees === undefined) { + return [UNKNOWN_AMOUNT, UNKNOWN_AMOUNT] } - return [UNKNOWN_AMOUNT, UNKNOWN_AMOUNT] - }, [ - avaxPrice, - data?.balancePerType.unlockedUnstaked, - pNetwork.networkToken.decimals, - pNetwork.networkToken.symbol - ]) - const [feesInAvax, feesInCurrency] = useMemo(() => { - return [totalFees?.toDisplay(), totalFees?.mul(avaxPrice).toDisplay()] - }, [avaxPrice, totalFees]) + return [ + totalFees.toDisplay(), + appHook.tokenInCurrencyFormatter( + totalFees.mul(avaxPrice).toDisplay({ asNumber: true }) + ) + ] + }, [avaxPrice, totalFees, appHook]) const cancelClaim = (): void => { AnalyticsService.capture('StakeCancelClaim') @@ -134,7 +147,7 @@ const ClaimRewards = (): JSX.Element | null => { - {`${feesInCurrency} ${selectedCurrency}`} + {formattedFeesInCurrency} ) @@ -198,7 +211,7 @@ const ClaimRewards = (): JSX.Element | null => { - {`${claimableAmountInCurrency} ${selectedCurrency}`} + {formattedClaimableAmountInCurrency} diff --git a/packages/core-mobile/app/screens/earn/components/StakeCard.tsx b/packages/core-mobile/app/screens/earn/components/StakeCard.tsx index ef17bfbd0a..182511968f 100644 --- a/packages/core-mobile/app/screens/earn/components/StakeCard.tsx +++ b/packages/core-mobile/app/screens/earn/components/StakeCard.tsx @@ -22,7 +22,6 @@ import NetworkService from 'services/network/NetworkService' import { useSelector } from 'react-redux' import { xpChainToken } from 'utils/units/knownTokens' import { UTCDate } from '@date-fns/utc' -import { selectSelectedCurrency } from 'store/settings/currency/slice' import { UNKNOWN_AMOUNT } from 'consts/amount' import { selectActiveNetwork } from 'store/network' import { isDevnet } from 'utils/isDevnet' @@ -59,7 +58,6 @@ export const StakeCard = (props: Props): JSX.Element => { const navigation = useNavigation() const { txHash, status, title, stakeAmount } = props const avaxPrice = useAvaxTokenPriceInSelectedCurrency() - const selectedCurrency = useSelector(selectSelectedCurrency) const isDevMode = useSelector(selectIsDeveloperMode) const activeNetwork = useSelector(selectActiveNetwork) const { networkToken: pChainNetworkToken } = @@ -112,7 +110,7 @@ export const StakeCard = (props: Props): JSX.Element => { const stakeAmountInCurrency = stakeAmountInAvax?.mul(avaxPrice) const stakeAmountInCurrencyDisplay = stakeAmountInCurrency ? tokenInCurrencyFormatter( - stakeAmountInCurrency.toDisplay({ fixedDp: 2, asNumber: true }) + stakeAmountInCurrency.toDisplay({ asNumber: true }) ) : UNKNOWN_AMOUNT @@ -157,7 +155,7 @@ export const StakeCard = (props: Props): JSX.Element => { {stakeAmountInAvaxDisplay} AVAX - {`${stakeAmountInCurrencyDisplay} ${selectedCurrency}`} + {`${stakeAmountInCurrencyDisplay}`} @@ -176,7 +174,7 @@ export const StakeCard = (props: Props): JSX.Element => { {estimatedRewardInAvaxDisplay} AVAX - {`${estimatedRewardInCurrencyDisplay} ${selectedCurrency}`} + {`${estimatedRewardInCurrencyDisplay}`} @@ -202,7 +200,7 @@ export const StakeCard = (props: Props): JSX.Element => { const rewardAmountInCurrencyDisplay = rewardAmountInCurrency ? tokenInCurrencyFormatter( - rewardAmountInCurrency.toDisplay({ fixedDp: 2, asNumber: true }) + rewardAmountInCurrency.toDisplay({ asNumber: true }) ) : UNKNOWN_AMOUNT @@ -223,7 +221,7 @@ export const StakeCard = (props: Props): JSX.Element => { {stakeAmountInAvaxDisplay} AVAX - {`${stakeAmountInCurrencyDisplay} ${selectedCurrency}`} + {`${stakeAmountInCurrencyDisplay}`} @@ -244,7 +242,7 @@ export const StakeCard = (props: Props): JSX.Element => { {rewardAmountInAvaxDisplay} AVAX - {`${rewardAmountInCurrencyDisplay} ${selectedCurrency}`} + {`${rewardAmountInCurrencyDisplay}`}