diff --git a/src/components/transactions/Borrow/BorrowActions.tsx b/src/components/transactions/Borrow/BorrowActions.tsx index 55fe5bb91a..a9bd51a1ba 100644 --- a/src/components/transactions/Borrow/BorrowActions.tsx +++ b/src/components/transactions/Borrow/BorrowActions.tsx @@ -6,6 +6,7 @@ import { MAX_UINT_AMOUNT, ProtocolAction, } from '@aave/contract-helpers'; +import { valueToBigNumber } from '@aave/math-utils'; import { Trans } from '@lingui/macro'; import { BoxProps } from '@mui/material'; import { useQueryClient } from '@tanstack/react-query'; @@ -126,6 +127,9 @@ export const BorrowActions = React.memo( asset: poolAddress, amount: amountToBorrow, assetName: poolReserve.name, + amountUsd: valueToBigNumber(amountToBorrow) + .multipliedBy(poolReserve.priceInUSD) + .toString(), }); queryClient.invalidateQueries({ queryKey: queryKeysFactory.pool }); diff --git a/src/components/transactions/DebtSwitch/DebtSwitchActions.tsx b/src/components/transactions/DebtSwitch/DebtSwitchActions.tsx index b06e643040..d8a4cc8941 100644 --- a/src/components/transactions/DebtSwitch/DebtSwitchActions.tsx +++ b/src/components/transactions/DebtSwitch/DebtSwitchActions.tsx @@ -3,6 +3,7 @@ import { gasLimitRecommendations, ProtocolAction, } from '@aave/contract-helpers'; +import { valueToBigNumber } from '@aave/math-utils'; import { SignatureLike } from '@ethersproject/bytes'; import { Trans } from '@lingui/macro'; import { BoxProps } from '@mui/material'; @@ -194,6 +195,14 @@ export const DebtSwitchActions = ({ txState: 'success', previousState: `${route.outputAmount} variable ${poolReserve.symbol}`, newState: `${route.inputAmount} variable ${targetReserve.symbol}`, + amountUsd: valueToBigNumber(parseUnits(amountToSwap, poolReserve.decimals).toString()) + .multipliedBy(poolReserve.priceInUSD) + .toString(), + outAmountUsd: valueToBigNumber( + parseUnits(amountToReceive, targetReserve.decimals).toString() + ) + .multipliedBy(targetReserve.priceInUSD) + .toString(), }); queryClient.invalidateQueries({ queryKey: queryKeysFactory.pool }); diff --git a/src/components/transactions/Repay/RepayActions.tsx b/src/components/transactions/Repay/RepayActions.tsx index b16608b2e6..ac95eb3eaf 100644 --- a/src/components/transactions/Repay/RepayActions.tsx +++ b/src/components/transactions/Repay/RepayActions.tsx @@ -1,4 +1,5 @@ import { gasLimitRecommendations, InterestRate, ProtocolAction } from '@aave/contract-helpers'; +import { valueToBigNumber } from '@aave/math-utils'; import { TransactionResponse } from '@ethersproject/providers'; import { Trans } from '@lingui/macro'; import { BoxProps } from '@mui/material'; @@ -29,6 +30,7 @@ export interface RepayActionProps extends BoxProps { repayWithATokens: boolean; blocked?: boolean; maxApproveNeeded: string; + maxAmountToRepay: string; } export const RepayActions = ({ @@ -41,6 +43,7 @@ export const RepayActions = ({ repayWithATokens, blocked, maxApproveNeeded, + maxAmountToRepay, ...props }: RepayActionProps) => { const [ @@ -197,8 +200,11 @@ export const RepayActions = ({ action, txState: 'success', asset: poolAddress, - amount: amountToRepay, + amount: amountToRepay === '-1' ? maxAmountToRepay : amountToRepay, assetName: symbol, + amountUsd: valueToBigNumber(amountToRepay === '-1' ? maxAmountToRepay : amountToRepay) + .multipliedBy(poolReserve.priceInUSD) + .toString(), }); queryClient.invalidateQueries({ queryKey: queryKeysFactory.pool }); diff --git a/src/components/transactions/Repay/RepayModalContent.tsx b/src/components/transactions/Repay/RepayModalContent.tsx index 1526228a89..6d8af025a2 100644 --- a/src/components/transactions/Repay/RepayModalContent.tsx +++ b/src/components/transactions/Repay/RepayModalContent.tsx @@ -289,6 +289,7 @@ export const RepayModalContent = ({ isWrongNetwork={isWrongNetwork} symbol={modalSymbol} repayWithATokens={repayWithATokens} + maxAmountToRepay={maxAmountToRepay.toString(10)} /> ); diff --git a/src/components/transactions/Supply/SupplyActions.tsx b/src/components/transactions/Supply/SupplyActions.tsx index 51e5240da3..1cf63c72c3 100644 --- a/src/components/transactions/Supply/SupplyActions.tsx +++ b/src/components/transactions/Supply/SupplyActions.tsx @@ -1,10 +1,12 @@ import { gasLimitRecommendations, ProtocolAction } from '@aave/contract-helpers'; +import { valueToBigNumber } from '@aave/math-utils'; import { TransactionResponse } from '@ethersproject/providers'; import { Trans } from '@lingui/macro'; import { BoxProps } from '@mui/material'; import { useQueryClient } from '@tanstack/react-query'; import { parseUnits } from 'ethers/lib/utils'; import React, { useEffect, useState } from 'react'; +import { useAppDataContext } from 'src/hooks/app-data-provider/useAppDataProvider'; import { SignedParams, useApprovalTx } from 'src/hooks/useApprovalTx'; import { usePoolApprovedAmount } from 'src/hooks/useApprovedAmount'; import { useModalContext } from 'src/hooks/useModal'; @@ -60,6 +62,7 @@ export const SupplyActions = React.memo( state.currentMarketData, ]) ); + const { reserves } = useAppDataContext(); const { approvalTxState, mainTxState, @@ -181,6 +184,12 @@ export const SupplyActions = React.memo( asset: poolAddress, amount: amountToSupply, assetName: symbol, + amountUsd: (() => { + const reserve = reserves.find((r) => r.underlyingAsset === poolAddress); + return reserve + ? valueToBigNumber(amountToSupply).multipliedBy(reserve.priceInUSD).toString() + : undefined; + })(), }); queryClient.invalidateQueries({ queryKey: queryKeysFactory.pool }); diff --git a/src/components/transactions/Supply/SupplyModalContent.tsx b/src/components/transactions/Supply/SupplyModalContent.tsx index 54ac9552f9..7509b951a8 100644 --- a/src/components/transactions/Supply/SupplyModalContent.tsx +++ b/src/components/transactions/Supply/SupplyModalContent.tsx @@ -475,6 +475,7 @@ export const SupplyWrappedTokenModalContent = ({ decimals={18} symbol={wrappedTokenConfig.tokenIn.symbol} isWrongNetwork={isWrongNetwork} + reserve={poolReserve} /> ) : ( { const [user, estimateGasLimit, addTransaction, marketData] = useRootStore( useShallow((state) => [ @@ -174,6 +178,7 @@ export const SupplyWrappedTokenActions = ({ asset: tokenIn, amount: amountToSupply, assetName: symbol, + amountUsd: valueToBigNumber(amountToSupply).multipliedBy(reserve.priceInUSD).toString(), }); queryClient.invalidateQueries({ queryKey: queryKeysFactory.pool }); @@ -212,7 +217,7 @@ export const SupplyWrappedTokenActions = ({ requiresApproval={requiresApproval} tryPermit={usePermit} sx={sx} - {...props} + {...propsx} /> ); }; diff --git a/src/components/transactions/Withdraw/WithdrawActions.tsx b/src/components/transactions/Withdraw/WithdrawActions.tsx index a40d64b2a7..c765f21501 100644 --- a/src/components/transactions/Withdraw/WithdrawActions.tsx +++ b/src/components/transactions/Withdraw/WithdrawActions.tsx @@ -1,4 +1,5 @@ import { ProtocolAction } from '@aave/contract-helpers'; +import { valueToBigNumber } from '@aave/math-utils'; import { Trans } from '@lingui/macro'; import { BoxProps } from '@mui/material'; import { useTransactionHandler } from 'src/helpers/useTransactionHandler'; @@ -42,6 +43,9 @@ export const WithdrawActions = ({ amount: amountToWithdraw, assetName: poolReserve.name, asset: poolReserve.underlyingAsset, + amountUsd: valueToBigNumber(amountToWithdraw) + .multipliedBy(poolReserve.priceInUSD) + .toString(), }, protocolAction: ProtocolAction.withdraw, }); diff --git a/src/components/transactions/Withdraw/WithdrawAndSwitchActions.tsx b/src/components/transactions/Withdraw/WithdrawAndSwitchActions.tsx index 4d458ee0c7..1f842fe6f7 100644 --- a/src/components/transactions/Withdraw/WithdrawAndSwitchActions.tsx +++ b/src/components/transactions/Withdraw/WithdrawAndSwitchActions.tsx @@ -1,4 +1,5 @@ import { ERC20Service, gasLimitRecommendations, ProtocolAction } from '@aave/contract-helpers'; +import { valueToBigNumber } from '@aave/math-utils'; import { SignatureLike } from '@ethersproject/bytes'; import { Trans } from '@lingui/macro'; import { BoxProps } from '@mui/material'; @@ -148,6 +149,14 @@ export const WithdrawAndSwitchActions = ({ outAsset: targetReserve.underlyingAsset, outAssetName: targetReserve.name, outAmount: parseUnits(route.outputAmount, targetReserve.decimals).toString(), + amountUsd: valueToBigNumber(parseUnits(route.inputAmount, poolReserve.decimals).toString()) + .multipliedBy(poolReserve.priceInUSD) + .toString(), + outAmountUsd: valueToBigNumber( + parseUnits(route.outputAmount, targetReserve.decimals).toString() + ) + .multipliedBy(targetReserve.priceInUSD) + .toString(), }); } catch (error) { const parsedError = getErrorTextFromError(error, TxAction.GAS_ESTIMATION, false); diff --git a/src/modules/umbrella/UmbrellaActions.tsx b/src/modules/umbrella/UmbrellaActions.tsx index fcee39cba1..4ed1240b99 100644 --- a/src/modules/umbrella/UmbrellaActions.tsx +++ b/src/modules/umbrella/UmbrellaActions.tsx @@ -5,6 +5,7 @@ import { StakeTokenService, UmbrellaBatchHelperService, } from '@aave/contract-helpers'; +import { valueToBigNumber } from '@aave/math-utils'; import { Trans } from '@lingui/macro'; import { BoxProps } from '@mui/material'; import { useQueryClient } from '@tanstack/react-query'; @@ -13,6 +14,7 @@ import { parseUnits } from 'ethers/lib/utils'; import { useEffect, useState } from 'react'; import { TxActionsWrapper } from 'src/components/transactions/TxActionsWrapper'; import { APPROVAL_GAS_LIMIT, checkRequiresApproval } from 'src/components/transactions/utils'; +import { ComputedReserveData } from 'src/hooks/app-data-provider/useAppDataProvider'; import { MergedStakeData } from 'src/hooks/stake/useUmbrellaSummary'; import { SignedParams, useApprovalTx } from 'src/hooks/useApprovalTx'; import { useApprovedAmount } from 'src/hooks/useApprovedAmount'; @@ -37,6 +39,7 @@ export interface StakeActionProps extends BoxProps { selectedToken: StakeInputAsset; event: string; isMaxSelected: boolean; + reserve: ComputedReserveData; } export const UmbrellaActions = ({ @@ -49,6 +52,7 @@ export const UmbrellaActions = ({ event, stakeData, isMaxSelected, + reserve, ...props }: StakeActionProps) => { const queryClient = useQueryClient(); @@ -193,6 +197,7 @@ export const UmbrellaActions = ({ action: ProtocolAction.umbrellaStake, amount: amountToStake, assetName: selectedToken.symbol, + amountUsd: valueToBigNumber(amountToStake).multipliedBy(reserve.priceInUSD).toString(), }); queryClient.invalidateQueries({ queryKey: queryKeysFactory.umbrella }); diff --git a/src/modules/umbrella/UmbrellaModalContent.tsx b/src/modules/umbrella/UmbrellaModalContent.tsx index f634600433..1a1d04e610 100644 --- a/src/modules/umbrella/UmbrellaModalContent.tsx +++ b/src/modules/umbrella/UmbrellaModalContent.tsx @@ -276,6 +276,7 @@ export const UmbrellaModalContent = ({ stakeData, user, userReserve, poolReserve amountToStake={amount || '0'} isWrongNetwork={isWrongNetwork} symbol={''} + reserve={poolReserve} blocked={ displayBlockingStake !== undefined || (displayRiskCheckbox && !riskCheckboxAccepted) } diff --git a/src/modules/umbrella/UnstakeModalActions.tsx b/src/modules/umbrella/UnstakeModalActions.tsx index 3ab6bbae63..3e53fc1ae2 100644 --- a/src/modules/umbrella/UnstakeModalActions.tsx +++ b/src/modules/umbrella/UnstakeModalActions.tsx @@ -3,6 +3,7 @@ import { ProtocolAction, UmbrellaBatchHelperService, } from '@aave/contract-helpers'; +import { valueToBigNumber } from '@aave/math-utils'; import { Trans } from '@lingui/macro'; import { BoxProps } from '@mui/material'; import { useQueryClient } from '@tanstack/react-query'; @@ -11,6 +12,7 @@ import { parseUnits } from 'ethers/lib/utils'; import { useEffect } from 'react'; import { TxActionsWrapper } from 'src/components/transactions/TxActionsWrapper'; import { APPROVAL_GAS_LIMIT, checkRequiresApproval } from 'src/components/transactions/utils'; +import { ComputedReserveData } from 'src/hooks/app-data-provider/useAppDataProvider'; import { MergedStakeData } from 'src/hooks/stake/useUmbrellaSummary'; import { useApprovalTx } from 'src/hooks/useApprovalTx'; import { useApprovedAmount } from 'src/hooks/useApprovedAmount'; @@ -32,6 +34,7 @@ export interface UnStakeActionProps extends BoxProps { blocked: boolean; stakeData: MergedStakeData; redeemType: RedeemType; + reserve: ComputedReserveData; } export const UnStakeActions = ({ @@ -42,6 +45,7 @@ export const UnStakeActions = ({ blocked, stakeData, redeemType, + reserve, }: UnStakeActionProps) => { const queryClient = useQueryClient(); const [currentChainId, user, currentMarket, estimateGasLimit, addTransaction] = useRootStore( @@ -171,6 +175,7 @@ export const UnStakeActions = ({ : ProtocolAction.umbrellaStakeGatewayRedeem, amount: amountToUnStake, assetName: stakeData.symbol, + amountUsd: valueToBigNumber(amountToUnStake).multipliedBy(reserve.priceInUSD).toString(), }); queryClient.invalidateQueries({ queryKey: queryKeysFactory.umbrella }); diff --git a/src/modules/umbrella/UnstakeModalContent.tsx b/src/modules/umbrella/UnstakeModalContent.tsx index 09d2fa5aa4..24bcf85bac 100644 --- a/src/modules/umbrella/UnstakeModalContent.tsx +++ b/src/modules/umbrella/UnstakeModalContent.tsx @@ -239,6 +239,7 @@ export const UnStakeModalContent = ({ symbol={symbolFormatted} blocked={false} stakeData={stakeData} + reserve={poolReserve} redeemType={redeemType} />