diff --git a/lib/modules/swap/SwapForm.tsx b/lib/modules/swap/SwapForm.tsx index e2f0018ca..d69133ef2 100644 --- a/lib/modules/swap/SwapForm.tsx +++ b/lib/modules/swap/SwapForm.tsx @@ -1,73 +1,42 @@ 'use client' -import { TokenInput } from '@/lib/modules/tokens/TokenInput/TokenInput' -import { GqlChain, GqlToken } from '@/lib/shared/services/api/generated/graphql' -import { HumanAmount } from '@balancer/sdk' +import { SafeAppAlert } from '@/lib/shared/components/alerts/SafeAppAlert' +import FadeInOnView from '@/lib/shared/components/containers/FadeInOnView' +import { useIsMounted } from '@/lib/shared/hooks/useIsMounted' +import { GqlChain } from '@/lib/shared/services/api/generated/graphql' import { + Box, + Button, Card, + CardBody, + CardFooter, + CardHeader, Center, HStack, - VStack, Tooltip, - useDisclosure, - IconButton, - Button, - Box, - CardHeader, - CardFooter, - CardBody, + VStack, } from '@chakra-ui/react' -import { useRef, useState } from 'react' -import { useSwap } from './SwapProvider' -import { TokenSelectModal } from '../tokens/TokenSelectModal/TokenSelectModal' -import { Address } from 'viem' -import { SwapPreviewModal } from './modal/SwapModal' -import { TransactionSettings } from '../user/settings/TransactionSettings' -import { PriceImpactAccordion } from '../price-impact/PriceImpactAccordion' -import { ChainSelect } from '../chains/ChainSelect' -import { CheckCircle, Link, Repeat } from 'react-feather' -import { SwapRate } from './SwapRate' -import { SwapDetails } from './SwapDetails' import { capitalize } from 'lodash' -import { motion, easeOut } from 'framer-motion' -import FadeInOnView from '@/lib/shared/components/containers/FadeInOnView' -import { ErrorAlert } from '@/lib/shared/components/errors/ErrorAlert' -import { useIsMounted } from '@/lib/shared/hooks/useIsMounted' -import { parseSwapError } from './swap.helpers' -import { useUserAccount } from '../web3/UserAccountProvider' +import { useRef } from 'react' +import { ChainSelect } from '../chains/ChainSelect' import { ConnectWallet } from '../web3/ConnectWallet' -import { SafeAppAlert } from '@/lib/shared/components/alerts/SafeAppAlert' +import { useUserAccount } from '../web3/UserAccountProvider' +import { useSwap } from './SwapProvider' export function SwapForm() { const { tokenIn, tokenOut, selectedChain, - tokens, - tokenSelectKey, isDisabled, disabledReason, previewModalDisclosure, simulationQuery, swapAction, - swapTxHash, - transactionSteps, setSelectedChain, setTokenInAmount, - setTokenOutAmount, - setTokenSelectKey, - setTokenIn, - setTokenOut, - switchTokens, - setNeedsToAcceptHighPI, - resetSwapAmounts, - replaceUrlPath, } = useSwap() - const [copiedDeepLink, setCopiedDeepLink] = useState(false) - const tokenSelectDisclosure = useDisclosure() const nextBtn = useRef(null) - const finalRefTokenIn = useRef(null) - const finalRefTokenOut = useRef(null) const isMounted = useIsMounted() const { isConnected } = useUserAccount() @@ -75,37 +44,6 @@ export function SwapForm() { const isLoading = isLoadingSwaps || !isMounted const loadingText = isLoading ? 'Fetching swap...' : undefined - function copyDeepLink() { - navigator.clipboard.writeText(window.location.href) - setCopiedDeepLink(true) - setTimeout(() => setCopiedDeepLink(false), 2000) - } - - function handleTokenSelect(token: GqlToken) { - if (!token) return - if (tokenSelectKey === 'tokenIn') { - setTokenIn(token.address as Address) - } else if (tokenSelectKey === 'tokenOut') { - setTokenOut(token.address as Address) - } else { - console.error('Unhandled token select key', tokenSelectKey) - } - } - - function openTokenSelectModal(tokenSelectKey: 'tokenIn' | 'tokenOut') { - setTokenSelectKey(tokenSelectKey) - tokenSelectDisclosure.onOpen() - } - - function onModalClose() { - previewModalDisclosure.onClose() - if (swapTxHash) { - resetSwapAmounts() - replaceUrlPath() - transactionSteps.resetTransactionSteps() - } - } - return (
{capitalize(swapAction)} - - - - - - - @@ -140,65 +69,9 @@ export function SwapForm() { }} /> - setTokenInAmount(e.currentTarget.value as HumanAmount)} - toggleTokenSelect={() => openTokenSelectModal('tokenIn')} - /> - - } - onClick={switchTokens} - /> - - setTokenOutAmount(e.currentTarget.value as HumanAmount)} - toggleTokenSelect={() => openTokenSelectModal('tokenOut')} - hasPriceImpact - disableBalanceValidation - isLoadingPriceImpact={ - simulationQuery.isLoading || !simulationQuery.data || !tokenIn.amount - } - /> + {tokenIn && tokenIn.address: {tokenIn.address}} + {tokenOut && tokenOut.address: {tokenOut.address}} - {!!simulationQuery.data && ( - - } - accordionPanelComponent={} - isDisabled={!simulationQuery.data} - /> - - )} - - {simulationQuery.isError && ( - - {parseSwapError(simulationQuery.error?.message)} - - )} @@ -229,22 +102,6 @@ export function SwapForm() {
- -
) }