diff --git a/packages/arb-token-bridge-ui/src/components/TransferPanel/MoveFundsButton.tsx b/packages/arb-token-bridge-ui/src/components/TransferPanel/MoveFundsButton.tsx new file mode 100644 index 0000000000..bf4c14aaec --- /dev/null +++ b/packages/arb-token-bridge-ui/src/components/TransferPanel/MoveFundsButton.tsx @@ -0,0 +1,49 @@ +import { twMerge } from 'tailwind-merge' + +import { useNetworks } from '../../hooks/useNetworks' +import { getBridgeUiConfigForChain } from '../../util/bridgeUiConfig' +import { useAppContextState } from '../App/AppContext' +import { Button } from '../common/Button' +import { useTransferReadiness } from './useTransferReadiness' +import { useAccountType } from '../../hooks/useAccountType' +import { useNetworksRelationship } from '../../hooks/useNetworksRelationship' +import { getNetworkName } from '../../util/networks' + +export function MoveFundsButton({ + onClick +}: Pick, 'onClick'>) { + const { layout } = useAppContextState() + const { isTransferring } = layout + + const [networks] = useNetworks() + const { isDepositMode } = useNetworksRelationship(networks) + const { color: destinationChainUIcolor } = getBridgeUiConfigForChain( + networks.destinationChain.id + ) + const { isSmartContractWallet } = useAccountType() + const { transferReady } = useTransferReadiness() + + return ( + + ) +} diff --git a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanel.tsx b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanel.tsx index 99806c9a7f..935c381795 100644 --- a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanel.tsx +++ b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanel.tsx @@ -9,7 +9,6 @@ import { twMerge } from 'tailwind-merge' import { useAppState } from '../../state' import { getNetworkName } from '../../util/networks' -import { Button } from '../common/Button' import { TokenDepositCheckDialog, TokenDepositCheckDialogType @@ -20,7 +19,7 @@ import { useDialog } from '../common/Dialog' import { TokenApprovalDialog } from './TokenApprovalDialog' import { WithdrawalConfirmationDialog } from './WithdrawalConfirmationDialog' import { TransferPanelSummary } from './TransferPanelSummary' -import { useAppContextActions, useAppContextState } from '../App/AppContext' +import { useAppContextActions } from '../App/AppContext' import { trackEvent } from '../../util/AnalyticsUtils' import { TransferPanelMain } from './TransferPanelMain' import { isGatewayRegistered } from '../../util/TokenUtils' @@ -49,9 +48,7 @@ import { useTokenFromSearchParams } from './TransferPanelUtils' import { useImportTokenModal } from '../../hooks/TransferPanel/useImportTokenModal' -import { useTransferReadiness } from './useTransferReadiness' import { useTransactionHistory } from '../../hooks/useTransactionHistory' -import { getBridgeUiConfigForChain } from '../../util/bridgeUiConfig' import { useNetworks } from '../../hooks/useNetworks' import { useNetworksRelationship } from '../../hooks/useNetworksRelationship' import { CctpTransferStarter } from '@/token-bridge-sdk/CctpTransferStarter' @@ -77,6 +74,7 @@ import { useIsCctpTransfer } from './hooks/useIsCctpTransfer' import { ExternalLink } from '../common/ExternalLink' import { isExperimentalFeatureEnabled } from '../../util' import { useIsTransferAllowed } from './hooks/useIsTransferAllowed' +import { MoveFundsButton } from './MoveFundsButton' const signerUndefinedError = 'Signer is undefined' const transferNotAllowedError = 'Transfer not allowed' @@ -112,8 +110,6 @@ export function TransferPanel() { warningTokens } } = useAppState() - const { layout } = useAppContextState() - const { isTransferring } = layout const { address: walletAddress } = useAccount() const { switchNetworkAsync } = useSwitchNetworkWithConfig({ isSwitchingNetworkBeforeTx: true @@ -182,13 +178,8 @@ export function TransferPanel() { const [isCctp, setIsCctp] = useState(false) - const { transferReady } = useTransferReadiness() - const { destinationAddressError } = useDestinationAddressError() - const { color: destinationChainUIcolor } = getBridgeUiConfigForChain( - networks.destinationChain.id - ) const isBatchTransfer = isBatchTransferSupported && Number(amount2) > 0 function closeWithResetTokenImportDialog() { @@ -1011,53 +1002,7 @@ export function TransferPanel() { amount={parseFloat(amount)} token={selectedToken} /> -
- {isDepositMode ? ( - - ) : ( - - )} -
+ {typeof tokenFromSearchParams !== 'undefined' && (