bridge_ui: Don't display amount on Redeem step (formatUnits throws on
fractional amounts)
This commit is contained in:
parent
a91fe7797d
commit
d6945bf6fa
|
@ -7,10 +7,8 @@ import {
|
||||||
CHAIN_ID_POLYGON,
|
CHAIN_ID_POLYGON,
|
||||||
CHAIN_ID_SOLANA,
|
CHAIN_ID_SOLANA,
|
||||||
isEVMChain,
|
isEVMChain,
|
||||||
MAX_VAA_DECIMALS,
|
|
||||||
WSOL_ADDRESS,
|
WSOL_ADDRESS,
|
||||||
} from "@certusone/wormhole-sdk";
|
} from "@certusone/wormhole-sdk";
|
||||||
import { formatUnits } from "@ethersproject/units";
|
|
||||||
import {
|
import {
|
||||||
Checkbox,
|
Checkbox,
|
||||||
FormControlLabel,
|
FormControlLabel,
|
||||||
|
@ -18,14 +16,12 @@ import {
|
||||||
makeStyles,
|
makeStyles,
|
||||||
} from "@material-ui/core";
|
} from "@material-ui/core";
|
||||||
import { Alert } from "@material-ui/lab";
|
import { Alert } from "@material-ui/lab";
|
||||||
import { useCallback, useMemo, useState } from "react";
|
import { useCallback, useState } from "react";
|
||||||
import { useDispatch, useSelector } from "react-redux";
|
import { useDispatch, useSelector } from "react-redux";
|
||||||
import useGetIsTransferCompleted from "../../hooks/useGetIsTransferCompleted";
|
import useGetIsTransferCompleted from "../../hooks/useGetIsTransferCompleted";
|
||||||
import { useHandleRedeem } from "../../hooks/useHandleRedeem";
|
import { useHandleRedeem } from "../../hooks/useHandleRedeem";
|
||||||
import useIsWalletReady from "../../hooks/useIsWalletReady";
|
import useIsWalletReady from "../../hooks/useIsWalletReady";
|
||||||
import useMetadata from "../../hooks/useMetadata";
|
|
||||||
import {
|
import {
|
||||||
selectTransferAmount,
|
|
||||||
selectTransferIsRecovery,
|
selectTransferIsRecovery,
|
||||||
selectTransferTargetAsset,
|
selectTransferTargetAsset,
|
||||||
selectTransferTargetChain,
|
selectTransferTargetChain,
|
||||||
|
@ -61,17 +57,11 @@ function Redeem() {
|
||||||
const targetChain = useSelector(selectTransferTargetChain);
|
const targetChain = useSelector(selectTransferTargetChain);
|
||||||
const targetAsset = useSelector(selectTransferTargetAsset);
|
const targetAsset = useSelector(selectTransferTargetAsset);
|
||||||
const isRecovery = useSelector(selectTransferIsRecovery);
|
const isRecovery = useSelector(selectTransferIsRecovery);
|
||||||
const transferAmount = useSelector(selectTransferAmount);
|
|
||||||
const { isTransferCompletedLoading, isTransferCompleted } =
|
const { isTransferCompletedLoading, isTransferCompleted } =
|
||||||
useGetIsTransferCompleted(true);
|
useGetIsTransferCompleted(true);
|
||||||
const classes = useStyles();
|
const classes = useStyles();
|
||||||
const dispatch = useDispatch();
|
const dispatch = useDispatch();
|
||||||
const { isReady, statusMessage } = useIsWalletReady(targetChain);
|
const { isReady, statusMessage } = useIsWalletReady(targetChain);
|
||||||
const targetAssetArrayed = useMemo(
|
|
||||||
() => (targetAsset ? [targetAsset] : []),
|
|
||||||
[targetAsset]
|
|
||||||
);
|
|
||||||
const metadata = useMetadata(targetChain, targetAssetArrayed);
|
|
||||||
//TODO better check, probably involving a hook & the VAA
|
//TODO better check, probably involving a hook & the VAA
|
||||||
const isEthNative =
|
const isEthNative =
|
||||||
targetChain === CHAIN_ID_ETH &&
|
targetChain === CHAIN_ID_ETH &&
|
||||||
|
@ -118,14 +108,6 @@ function Redeem() {
|
||||||
}, [dispatch]);
|
}, [dispatch]);
|
||||||
const howToAddTokensUrl = getHowToAddTokensToWalletUrl(targetChain);
|
const howToAddTokensUrl = getHowToAddTokensToWalletUrl(targetChain);
|
||||||
|
|
||||||
const formattedTransferAmount = useMemo(() => {
|
|
||||||
const decimals =
|
|
||||||
(targetAsset && metadata.data?.get(targetAsset)?.decimals) || undefined;
|
|
||||||
return decimals
|
|
||||||
? formatUnits(transferAmount, Math.min(decimals, MAX_VAA_DECIMALS))
|
|
||||||
: undefined;
|
|
||||||
}, [targetAsset, metadata, transferAmount]);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<StepDescription>Receive the tokens on the target chain</StepDescription>
|
<StepDescription>Receive the tokens on the target chain</StepDescription>
|
||||||
|
@ -184,7 +166,6 @@ function Redeem() {
|
||||||
chainId={targetChain}
|
chainId={targetChain}
|
||||||
address={targetAsset || undefined}
|
address={targetAsset || undefined}
|
||||||
/>
|
/>
|
||||||
{formattedTransferAmount ? <span>{`Amount: ${formattedTransferAmount}`}</span> : null}
|
|
||||||
</>
|
</>
|
||||||
) : null}
|
) : null}
|
||||||
{isEVMChain(targetChain) ? <AddToMetamask /> : null}
|
{isEVMChain(targetChain) ? <AddToMetamask /> : null}
|
||||||
|
|
Loading…
Reference in New Issue