diff --git a/package.json b/package.json index cbbef31cd9..f65da037a6 100644 --- a/package.json +++ b/package.json @@ -157,4 +157,4 @@ "budgetPercentIncreaseRed": 20, "showDetails": true } -} \ No newline at end of file +} diff --git a/src/components/transactions/Switch/BaseSwitchModalContent.tsx b/src/components/transactions/Switch/BaseSwitchModalContent.tsx index 93ac3e475a..80b26d39a5 100644 --- a/src/components/transactions/Switch/BaseSwitchModalContent.tsx +++ b/src/components/transactions/Switch/BaseSwitchModalContent.tsx @@ -715,6 +715,17 @@ export const BaseSwitchModalContent = ({ .multipliedBy(1 - safeSlippage) .decimalPlaces(switchRates.destDecimals, BigNumber.ROUND_UP) .toString()} + amountUsd={Number(switchRates.srcUSD)} + outAmountUSD={Number( + switchRates.provider === 'cowprotocol' ? switchRates.destSpotInUsd : switchRates.destUSD + )} + addToken={{ + address: selectedOutputToken.aToken ?? selectedOutputToken.address, + symbol: selectedOutputToken.symbol, + decimals: selectedOutputToken.decimals, + aToken: selectedOutputToken.aToken ? true : false, + }} + modalType={modalType} /> ); } diff --git a/src/components/transactions/Switch/SwitchLimitOrdersModalContent.tsx b/src/components/transactions/Switch/SwitchLimitOrdersModalContent.tsx index 13a90a9e85..903d5c88aa 100644 --- a/src/components/transactions/Switch/SwitchLimitOrdersModalContent.tsx +++ b/src/components/transactions/Switch/SwitchLimitOrdersModalContent.tsx @@ -7,7 +7,7 @@ import { TokenInfoWithBalance, useTokensBalance } from 'src/hooks/generic/useTok import { useCowSwitchRates } from 'src/hooks/switch/useCowSwitchRates'; import { useGetConnectedWalletType } from 'src/hooks/useGetConnectedWalletType'; import { useIsWrongNetwork } from 'src/hooks/useIsWrongNetwork'; -import { useModalContext } from 'src/hooks/useModal'; +import { ModalType, useModalContext } from 'src/hooks/useModal'; import { StaticRate, useStaticRate } from 'src/hooks/useStaticRate'; import { useWeb3Context } from 'src/libs/hooks/useWeb3Context'; import { useRootStore } from 'src/store/root'; @@ -257,6 +257,15 @@ export const SwitchLimitOrdersInner = ({ destDecimals={outputToken.decimals} srcDecimals={inputToken.decimals} outAmount={outputAmount} + amountUsd={Number(staticRate?.inputUsdPrice) * Number(inputAmount) || 0} + outAmountUSD={Number(staticRate?.outputUsdPrice) * Number(outputAmount) || 0} + addToken={{ + address: outputToken.aToken ?? outputToken.address, + symbol: outputToken.symbol, + decimals: outputToken.decimals, + aToken: outputToken.aToken ? true : false, + }} + modalType={ModalType.SwitchLimitOrder} /> ); } diff --git a/src/components/transactions/Switch/SwitchTxSuccessView.tsx b/src/components/transactions/Switch/SwitchTxSuccessView.tsx index d83aa12d17..e32737f85c 100644 --- a/src/components/transactions/Switch/SwitchTxSuccessView.tsx +++ b/src/components/transactions/Switch/SwitchTxSuccessView.tsx @@ -1,13 +1,17 @@ import { normalize } from '@aave/math-utils'; import { Trans } from '@lingui/macro'; -import { Box, CircularProgress, Divider, Typography } from '@mui/material'; +import { Box, Button, CircularProgress, Divider, Typography } from '@mui/material'; import { BigNumber } from 'ethers'; import { useEffect, useMemo, useRef, useState } from 'react'; +import { WalletIcon } from 'src/components/icons/WalletIcon'; import { DarkTooltip } from 'src/components/infoTooltips/DarkTooltip'; import { FormattedNumber } from 'src/components/primitives/FormattedNumber'; -import { ExternalTokenIcon } from 'src/components/primitives/TokenIcon'; +import { Base64Token, ExternalTokenIcon, TokenIcon } from 'src/components/primitives/TokenIcon'; import { TextWithTooltip, TextWithTooltipProps } from 'src/components/TextWithTooltip'; import { useCowOrderToast } from 'src/hooks/useCowOrderToast'; +import { ModalType } from 'src/hooks/useModal'; +import { useWeb3Context } from 'src/libs/hooks/useWeb3Context'; +import { ERC20TokenType } from 'src/libs/web3-data-provider/Web3Provider'; import { networkConfigs } from 'src/ui-config/networksConfig'; import { parseUnits } from 'viem'; @@ -38,6 +42,10 @@ export type SwitchTxSuccessViewProps = { chainId: number; destDecimals: number; srcDecimals: number; + amountUsd: number; + outAmountUSD: number; + addToken?: ERC20TokenType; + modalType: ModalType; }; export const SwitchWithSurplusTooltip = ({ @@ -83,8 +91,14 @@ export const SwitchTxSuccessView = ({ chainId, destDecimals, srcDecimals, + amountUsd, + outAmountUSD, + addToken, + modalType, }: SwitchTxSuccessViewProps) => { const { trackOrder, setHasActiveOrders } = useCowOrderToast(); + const { addERC20Token } = useWeb3Context(); + const [base64, setBase64] = useState(''); // Do polling each 10 seconds until the order get's filled const [orderStatus, setOrderStatus] = useState<'succeed' | 'failed' | 'open'>('open'); @@ -196,6 +210,9 @@ export const SwitchTxSuccessView = ({ ) : undefined; }, [provider, txHashOrOrderId]); + const shouldShowATokenCta = modalType === ModalType.CollateralSwap && addToken?.aToken; + const watchedTokenSymbol = shouldShowATokenCta ? '' : addToken?.symbol ?? ''; + return ( @@ -257,22 +273,40 @@ export const SwitchTxSuccessView = ({ enterTouchDelay={100} leaveTouchDelay={500} > - - - {Number(inAmount).toLocaleString(undefined, { - minimumFractionDigits: 2, - maximumFractionDigits: Number(inAmount) < 0.01 ? 4 : 2, - })}{' '} - - + <> + + + + + + - - {symbol} - + + {symbol} + {amountUsd && amountUsd > 0 && ( + + + + + + )} - + {provider == 'cowprotocol' && (orderStatus == 'open' || orderStatus == 'failed') ? 'Receive' @@ -297,31 +331,100 @@ export const SwitchTxSuccessView = ({ enterTouchDelay={100} leaveTouchDelay={500} > - - - {Number(outFinalAmount).toLocaleString(undefined, { - minimumFractionDigits: 2, - maximumFractionDigits: Number(outFinalAmount) < 0.01 ? 4 : 2, - })} - - + <> + + + + + + - - {outSymbol} - + + {outSymbol} + {outAmountUSD && outAmountUSD > 0 && ( + + + + + + )} {surplusDisplay && ( {surplusDisplay} )} + {shouldShowATokenCta && ( + ({ + border: theme.palette.mode === 'dark' ? `1px solid ${theme.palette.divider}` : 'none', + background: theme.palette.mode === 'dark' ? 'none' : '#F7F7F9', + borderRadius: 2, + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + justifyContent: 'center', + mt: 4, + + width: '80%', + })} + > + + + + Add {addToken.aToken ? 'aToken ' : 'token '} to wallet to track your balance. + + + + + )} ); }; diff --git a/src/locales/en/messages.po b/src/locales/en/messages.po index 6637a87e14..f57f334d20 100644 --- a/src/locales/en/messages.po +++ b/src/locales/en/messages.po @@ -639,6 +639,7 @@ msgid "All proposals" msgstr "All proposals" #: src/components/transactions/FlowCommons/Success.tsx +#: src/components/transactions/Switch/SwitchTxSuccessView.tsx msgid "Add to wallet" msgstr "Add to wallet" @@ -2193,6 +2194,7 @@ msgid "Interest rate rebalance conditions were not met" msgstr "Interest rate rebalance conditions were not met" #: src/components/transactions/FlowCommons/Success.tsx +#: src/components/transactions/Switch/SwitchTxSuccessView.tsx msgid "Add {0} to wallet to track your balance." msgstr "Add {0} to wallet to track your balance." diff --git a/yarn.lock b/yarn.lock index a651c6cb83..99ce3d670a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1380,21 +1380,10 @@ dependencies: chalk "^4.1.0" -"@cowprotocol/app-data@^3.1.0": - version "3.1.0" - resolved "https://registry.yarnpkg.com/@cowprotocol/app-data/-/app-data-3.1.0.tgz#2ba5ec7d958b2510f17b08c7e18e05157032c4da" - integrity sha512-hdIWp6fGz/vx3gdoJgwd8Dx8rYAblpZEBiXss5mNzgF/LBb21VVhF075sDl9oxyesKuJayKjgiAgaFiZYVgblA== - dependencies: - ajv "^8.11.0" - cross-fetch "^3.1.5" - ipfs-only-hash "^4.0.0" - json-stringify-deterministic "^1.0.8" - multiformats "^9.6.4" - -"@cowprotocol/app-data@^3.3.0": - version "3.3.0" - resolved "https://registry.yarnpkg.com/@cowprotocol/app-data/-/app-data-3.3.0.tgz#644e7473a00eb5e6694a34d34b4359c6d7ef1060" - integrity sha512-3lfknouwg+j/xSyL5u5FI8rAlGPkzi+QsmXQvPS0O0ETaikx9v9pt5t3pZOv6jtsAmafFBFPtAUp/cdPrDSUaA== +"@cowprotocol/app-data@^3.1.0", "@cowprotocol/app-data@^3.3.0": + version "3.3.1" + resolved "https://registry.yarnpkg.com/@cowprotocol/app-data/-/app-data-3.3.1.tgz#e6ad00145ee964fcb3475103252c59926a5dbc54" + integrity sha512-1019+vlzSeKi1SMUo5isMy5Tb+mzoPPBjGHVpqgYYaLVBUhiapUFlmtleYswMkvAyMegvqaLG+ccF2emKEPPsw== dependencies: ajv "^8.11.0" cross-fetch "^3.1.5" @@ -3360,16 +3349,16 @@ resolved "https://registry.yarnpkg.com/@noble/ciphers/-/ciphers-1.2.1.tgz#3812b72c057a28b44ff0ad4aff5ca846e5b9cdc9" integrity sha512-rONPWMC7PeExE077uLE4oqWrZ1IvAfz3oH9LibVAcVCopJiA9R62uavnbEzdkVmJYI6M6Zgkbeb07+tWjlq2XA== +"@noble/ciphers@1.3.0", "@noble/ciphers@^1.3.0": + version "1.3.0" + resolved "https://registry.yarnpkg.com/@noble/ciphers/-/ciphers-1.3.0.tgz#f64b8ff886c240e644e5573c097f86e5b43676dc" + integrity sha512-2I0gnIVPtfnMw9ee9h1dJG7tp81+8Ob3OJb3Mv37rx5L40/b0i7djjCVvGOVqc9AEIQyvyu1i6ypKdFw8R8gQw== + "@noble/ciphers@^1.0.0": version "1.1.3" resolved "https://registry.yarnpkg.com/@noble/ciphers/-/ciphers-1.1.3.tgz#eb27085aa7ce94d8c6eaeb64299bab0589920ec1" integrity sha512-Ygv6WnWJHLLiW4fnNDC1z+i13bud+enXOFRBlpxI+NJliPWx5wdR+oWlTjLuBPTqjUjtHXtjkU6w3kuuH6upZA== -"@noble/ciphers@^1.3.0": - version "1.3.0" - resolved "https://registry.yarnpkg.com/@noble/ciphers/-/ciphers-1.3.0.tgz#f64b8ff886c240e644e5573c097f86e5b43676dc" - integrity sha512-2I0gnIVPtfnMw9ee9h1dJG7tp81+8Ob3OJb3Mv37rx5L40/b0i7djjCVvGOVqc9AEIQyvyu1i6ypKdFw8R8gQw== - "@noble/curves@1.4.2", "@noble/curves@~1.4.0": version "1.4.2" resolved "https://registry.yarnpkg.com/@noble/curves/-/curves-1.4.2.tgz#40309198c76ed71bc6dbf7ba24e81ceb4d0d1fe9" @@ -3405,6 +3394,13 @@ dependencies: "@noble/hashes" "1.7.2" +"@noble/curves@1.9.0": + version "1.9.0" + resolved "https://registry.yarnpkg.com/@noble/curves/-/curves-1.9.0.tgz#13e0ca8be4a0ce66c113693a94514e5599f40cfc" + integrity sha512-7YDlXiNMdO1YZeH6t/kvopHHbIZzlxrCV9WLqCY6QhcXOoXiNCMDqJIglZ9Yjx5+w7Dz30TITFrlTjnRg7sKEg== + dependencies: + "@noble/hashes" "1.8.0" + "@noble/curves@1.9.1": version "1.9.1" resolved "https://registry.yarnpkg.com/@noble/curves/-/curves-1.9.1.tgz#9654a0bc6c13420ae252ddcf975eaf0f58f0a35c" @@ -4369,11 +4365,11 @@ integrity sha512-4tT2UrL5LBqDwoed9wZ6N3umC4Yhz3W3FloMmiiG4JwmUJWpie0c7lcnUNd4gtMKuDEO4wRVS8B6Xa0uMRsMKg== "@types/node@>=13.7.0": - version "22.14.0" - resolved "https://registry.yarnpkg.com/@types/node/-/node-22.14.0.tgz#d3bfa3936fef0dbacd79ea3eb17d521c628bb47e" - integrity sha512-Kmpl+z84ILoG+3T/zQFyAJsU6EPTmOCj8/2+83fSN6djd6I4o7uOuGIH6vq3PrjY5BGitSbFuMN18j3iknubbA== + version "24.7.1" + resolved "https://registry.yarnpkg.com/@types/node/-/node-24.7.1.tgz#3f0b17eddcd965c9e337af22459b04bafbf96e5e" + integrity sha512-CmyhGZanP88uuC5GpWU9q+fI61j2SkhO3UGMUdfYRE6Bcy0ccyzn1Rqj9YAB/ZY4kOXmNf0ocah5GtphmLMP6Q== dependencies: - undici-types "~6.21.0" + undici-types "~7.14.0" "@types/node@^14.14.31": version "14.18.63" @@ -7591,15 +7587,15 @@ ethereum-cryptography@^2.0.0: "@scure/bip39" "1.3.0" ethereum-cryptography@^3.0.0: - version "3.1.0" - resolved "https://registry.yarnpkg.com/ethereum-cryptography/-/ethereum-cryptography-3.1.0.tgz#0fa6dbc3cdd2927c87b9c018ff42616c4eec3f64" - integrity sha512-ZqHd92eOIH9RExpBUOgzpAgflyFv9/+Ca39G8V+oCjJPGjJUihQcG/Gl67I/Xn2HGS87dgnrCG3kb1jNClLi6g== + version "3.2.0" + resolved "https://registry.yarnpkg.com/ethereum-cryptography/-/ethereum-cryptography-3.2.0.tgz#42a04b57834bf536e552b50a70b9ee5057c71dc6" + integrity sha512-Urr5YVsalH+Jo0sYkTkv1MyI9bLYZwW8BENZCeE1QYaTHETEYx0Nv/SVsWkSqpYrzweg6d8KMY1wTjH/1m/BIg== dependencies: - "@noble/ciphers" "1.2.1" - "@noble/curves" "1.8.1" - "@noble/hashes" "1.7.1" - "@scure/bip32" "1.6.2" - "@scure/bip39" "1.5.4" + "@noble/ciphers" "1.3.0" + "@noble/curves" "1.9.0" + "@noble/hashes" "1.8.0" + "@scure/bip32" "1.7.0" + "@scure/bip39" "1.6.0" ethereum-multicall@^2.21.0: version "2.26.0" @@ -13088,10 +13084,10 @@ undici-types@~6.20.0: resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-6.20.0.tgz#8171bf22c1f588d1554d55bf204bc624af388433" integrity sha512-Ny6QZ2Nju20vw1SRHe3d9jVu6gJ+4e3+MMpqu7pqE5HT6WsTSlce++GQmK5UXS8mzV8DSYHrQH+Xrf2jVcuKNg== -undici-types@~6.21.0: - version "6.21.0" - resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-6.21.0.tgz#691d00af3909be93a7faa13be61b3a5b50ef12cb" - integrity sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ== +undici-types@~7.14.0: + version "7.14.0" + resolved "https://registry.yarnpkg.com/undici-types/-/undici-types-7.14.0.tgz#4c037b32ca4d7d62fae042174604341588bc0840" + integrity sha512-QQiYxHuyZ9gQUIrmPo3IA+hUl4KYk8uSA7cHrcKd/l3p1OTpZcM0Tbp9x7FAtXdAYhlasd60ncPpgu6ihG6TOA== unenv@^1.10.0: version "1.10.0"