diff --git a/src/containers/Stake/components/ClaimsArea.jsx b/src/containers/Stake/components/ClaimsArea.jsx index b30fad6..310b907 100644 --- a/src/containers/Stake/components/ClaimsArea.jsx +++ b/src/containers/Stake/components/ClaimsArea.jsx @@ -28,7 +28,8 @@ import { formatNumber, formatCurrency } from "../../../helpers"; import { STAKING_ADDRESSES } from "../../../constants/addresses"; import { useCurrentIndex, useWarmupInfo } from "../../../hooks/staking"; import { useBalanceForShares, useTokenSymbol } from "../../../hooks/tokens"; -import { useGhstPrice } from "../../../hooks/prices"; +import { useGhstPrice, useStnkPrice } from "../../../hooks/prices"; +import { isNetworkLegacy } from "../../../constants"; import ClaimConfirmationModal from "./ClaimConfirmationModal"; @@ -55,6 +56,8 @@ export const ClaimsArea = ({ chainId, address, epoch }) => { const [isPayoutGhst, _] = useState(true); const ghstPrice = useGhstPrice(chainId); + const stnkPrice = useStnkPrice(chainId); + const { warmupInfo: claim, refetch: claimRefetch } = useWarmupInfo(chainId, address); const { currentIndex, refetch: currentIndexRefetch } = useCurrentIndex(chainId); const { balanceForShares } = useBalanceForShares(chainId, "STNK", claim.shares); @@ -63,6 +66,14 @@ export const ClaimsArea = ({ chainId, address, epoch }) => { const { symbol: stnkSymbol } = useTokenSymbol(chainId, "STNK"); const { symbol: ghstSymbol } = useTokenSymbol(chainId, "GHST"); + const claimableBalance = useMemo(() => { + if (isNetworkLegacy(chainId)) { + return isPayoutGhst ? balanceForShares.div(currentIndex) : balanceForShares; + } + const toClaim = new DecimalBigNumber(claim.shares, 18); + return isPayoutGhst ? toClaim : toClaim.mul(currentIndex); + }, [chainId, claim, currentIndex, balanceForShares]); + const closeConfirmationModal = () => { setConfirmationModalOpen(false); claimRefetch(); @@ -80,7 +91,7 @@ export const ClaimsArea = ({ chainId, address, epoch }) => { onClose={() => closeConfirmationModal()} chainid={chainId} receiver={address} - receiveAmount={claim.expiry > epoch.number ? claim.deposit : isPayoutGhst ? balanceForShares.div(currentIndex) : balanceForShares} + receiveAmount={claim.expiry > epoch.number ? claim.deposit : claimableBalance} outputToken={claim.expiry > epoch.number ? ftsoSymbol : isPayoutGhst ? ghstSymbol : stnkSymbol} stnkSymbol={stnkSymbol} ghstSymbol={ghstSymbol} @@ -107,34 +118,35 @@ export const ClaimsArea = ({ chainId, address, epoch }) => { {isSmallScreen ? ( epoch.number} stnkSymbol={stnkSymbol} ghstSymbol={ghstSymbol} + tokenPrice={isPayoutGhst ? ghstPrice : stnkPrice} /> ) : ( Asset - Amount + Staked Amount Claimable In epoch.number} stnkSymbol={stnkSymbol} ghstSymbol={ghstSymbol} - ghstPrice={ghstPrice} + tokenPrice={isPayoutGhst ? ghstPrice : stnkPrice} />
@@ -153,7 +165,7 @@ const ClaimInfo = ({ isPayoutGhst, stnkSymbol, ghstSymbol, - ghstPrice + tokenPrice }) => { return ( @@ -171,7 +183,7 @@ const ClaimInfo = ({ {formatCurrency(prepareBalance, 5, isPayoutGhst ? ghstSymbol : stnkSymbol)} - {formatCurrency(prepareBalance * ghstPrice, 2)} + {formatCurrency(prepareBalance * tokenPrice, 2)} @@ -188,7 +200,17 @@ const ClaimInfo = ({ ); }; -const MobileClaimInfo = ({ setConfirmationModalOpen, prepareBalance, epoch, claim, isPayoutGhst, isClaimable, ghstSymbol, stnkSymbol }) => { +const MobileClaimInfo = ({ + setConfirmationModalOpen, + prepareBalance, + epoch, + claim, + isPayoutGhst, + isClaimable, + ghstSymbol, + stnkSymbol, + tokenPrice, +}) => { return ( @@ -199,10 +221,15 @@ const MobileClaimInfo = ({ setConfirmationModalOpen, prepareBalance, epoch, clai + +