diff --git a/packages/arb-token-bridge-ui/src/components/TransferPanel/TokenSearch.tsx b/packages/arb-token-bridge-ui/src/components/TransferPanel/TokenSearch.tsx index 978b99a587..1497979dfc 100644 --- a/packages/arb-token-bridge-ui/src/components/TransferPanel/TokenSearch.tsx +++ b/packages/arb-token-bridge-ui/src/components/TransferPanel/TokenSearch.tsx @@ -18,7 +18,8 @@ import { isTokenArbitrumOneNativeUSDC, isTokenArbitrumSepoliaNativeUSDC, isTokenArbitrumOneUSDCe, - getL2ERC20Address + getL2ERC20Address, + isTokenNativeUSDC } from '../../util/TokenUtils' import { Button } from '../common/Button' import { useTokensFromLists, useTokensFromUser } from './TokenSearchUtils' @@ -43,6 +44,7 @@ import { useTokenFromSearchParams } from './TransferPanelUtils' import { Switch } from '../common/atoms/Switch' import { isTeleportEnabledToken } from '../../util/TokenTeleportEnabledUtils' import { useBalances } from '../../hooks/useBalances' +import { useSetInputAmount } from '../../hooks/TransferPanel/useSetInputAmount' export const ARB_ONE_NATIVE_USDC_TOKEN = { ...ArbOneNativeUSDC, @@ -518,6 +520,7 @@ export function TokenSearch({ close: () => void }) { const { address: walletAddress } = useAccount() + const { setAmount2 } = useSetInputAmount() const { app: { arbTokenBridge: { token, bridgeTokens } @@ -555,13 +558,18 @@ export function TokenSearch({ return } + if (isTokenNativeUSDC(_token.address)) { + // not supported + setAmount2('') + } + try { // Native USDC on L2 won't have a corresponding L1 address - const isNativeUSDC = + const isL2NativeUSDC = isTokenArbitrumOneNativeUSDC(_token.address) || isTokenArbitrumSepoliaNativeUSDC(_token.address) - if (isNativeUSDC) { + if (isL2NativeUSDC) { if (isLoadingAccountType) { return } diff --git a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/DestinationNetworkBox.tsx b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/DestinationNetworkBox.tsx index d860364eb7..e20a722a0c 100644 --- a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/DestinationNetworkBox.tsx +++ b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/DestinationNetworkBox.tsx @@ -26,6 +26,22 @@ import { NetworkSelectionContainer } from '../../common/NetworkSelectionContainer' import { useNativeCurrencyBalances } from './useNativeCurrencyBalances' +import { useIsBatchTransferSupported } from '../../../hooks/TransferPanel/useIsBatchTransferSupported' +import { useArbQueryParams } from '../../../hooks/useArbQueryParams' + +function NativeCurrencyDestinationBalance({ prefix }: { prefix?: string }) { + const nativeCurrencyBalances = useNativeCurrencyBalances() + const [networks] = useNetworks() + const { isDepositMode } = useNetworksRelationship(networks) + + return ( + + ) +} function DestinationNetworkBalance({ showUsdcSpecificInfo @@ -40,8 +56,7 @@ function DestinationNetworkBalance({ useNetworksRelationship(networks) const { isArbitrumOne } = isNetwork(childChain.id) - const { ethParentBalance, ethChildBalance, erc20ChildBalances } = - useBalances() + const { erc20ChildBalances } = useBalances() const nativeCurrencyBalances = useNativeCurrencyBalances() const selectedTokenBalances = useSelectedTokenBalances() @@ -101,13 +116,7 @@ function DestinationNetworkBalance({ ) } - return ( - - ) + return } export function DestinationNetworkBox({ @@ -118,6 +127,8 @@ export function DestinationNetworkBox({ const { address: walletAddress } = useAccount() const [networks] = useNetworks() const { destinationAddress } = useDestinationAddressStore() + const [{ amount2 }] = useArbQueryParams() + const isBatchTransferSupported = useIsBatchTransferSupported() const destinationAddressOrWalletAddress = destinationAddress || walletAddress const [ destinationNetworkSelectionDialogProps, @@ -138,9 +149,14 @@ export function DestinationNetworkBox({ {destinationAddressOrWalletAddress && utils.isAddress(destinationAddressOrWalletAddress) && ( - + <> + + {isBatchTransferSupported && Number(amount2) > 0 && ( + + )} + )} diff --git a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/SourceNetworkBox.tsx b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/SourceNetworkBox.tsx index 165b9b79c8..9da743ced0 100644 --- a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/SourceNetworkBox.tsx +++ b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/SourceNetworkBox.tsx @@ -97,6 +97,12 @@ export function SourceNetworkBox({ } }, [amount2, maxAmount2, isMaxAmount2, setAmount2]) + useEffect(() => { + if (isBatchTransferSupported && Number(amount2) > 0) { + setIsAmount2InputVisible(true) + } + }, [isBatchTransferSupported, amount2]) + const maxButtonOnClick = useCallback(() => { if (typeof maxAmount !== 'undefined') { setAmount(maxAmount) @@ -172,8 +178,6 @@ export function SourceNetworkBox({ />

You can transfer ETH in the same transaction if you wish to. - This is the approximate amount you will receive. The final - amount depends on actual gas usage.

)} diff --git a/packages/arb-token-bridge-ui/src/hooks/TransferPanel/useIsBatchTransferSupported.ts b/packages/arb-token-bridge-ui/src/hooks/TransferPanel/useIsBatchTransferSupported.ts index 13c592d0cb..f1e006a0cf 100644 --- a/packages/arb-token-bridge-ui/src/hooks/TransferPanel/useIsBatchTransferSupported.ts +++ b/packages/arb-token-bridge-ui/src/hooks/TransferPanel/useIsBatchTransferSupported.ts @@ -1,5 +1,6 @@ import { useAppState } from '../../state' import { isExperimentalFeatureEnabled } from '../../util' +import { isTokenNativeUSDC } from '../../util/TokenUtils' import { useNativeCurrency } from '../useNativeCurrency' import { useNetworks } from '../useNetworks' import { useNetworksRelationship } from '../useNetworksRelationship' @@ -22,6 +23,9 @@ export const useIsBatchTransferSupported = () => { if (!isDepositMode) { return false } + if (isTokenNativeUSDC(selectedToken.address)) { + return false + } // TODO: teleport is disabled for now but it needs to be looked into more to check whether it is or can be supported if (isTeleportMode) { return false