clean up wallet-widget

Author: SamueleA

examples/react/src/components/Connected.tsx

@@ -1,4 +1,4 @@
-import { useCheckoutModal, useSelectPaymentModal, useSwapModal, useTransactionStatusModal } from '@0xsequence/checkout'
+import { useCheckoutModal, useTransactionStatusModal } from '@0xsequence/checkout'
 import {
   getModalPositionCss,
   signEthAuthProof,
@@ -25,7 +25,6 @@ import { abi } from '../constants/nft-abi'
 import { delay, getCheckoutSettings, getOrderbookCalldata } from '../utils'
 import { checkoutPresets } from '../utils/checkout'
 
-import { CustomCheckout } from './CustomCheckout'
 import { Select } from './Select'
 
 // append ?debug to url to enable debug mode
@@ -40,11 +39,8 @@ export const Connected = () => {
   const [isOpenCustomCheckout, setIsOpenCustomCheckout] = React.useState(false)
   const { setOpenConnectModal } = useOpenConnectModal()
   const { address } = useAccount()
-  const { openSwapModal } = useSwapModal()
   const { setOpenWalletModal } = useOpenWalletModal()
   const { triggerCheckout } = useCheckoutModal()
-  const { triggerAddFunds } = useAddFundsModal()
-  const { openSelectPaymentModal } = useSelectPaymentModal()
   const { setIsSocialLinkOpen } = useSocialLink()
   const { data: walletClient } = useWalletClient()
   const storage = useStorage()
@@ -74,17 +70,6 @@ export const Connected = () => {
     reset: resetSendUnsponsoredTransaction
   } = useSendTransaction()
 
-  const { openCheckoutModal, isLoading: erc1155CheckoutLoading } = useERC1155SaleContractCheckout({
-    chain: 137,
-    contractAddress: '0xf0056139095224f4eec53c578ab4de1e227b9597',
-    wallet: address || '',
-    collectionAddress: '0x92473261f2c26f2264429c451f70b0192f858795',
-    items: [{ tokenId: '1', quantity: '1' }],
-    onSuccess: txnHash => {
-      console.log('txnHash', txnHash)
-    }
-  })
-
   const [isSigningMessage, setIsSigningMessage] = React.useState(false)
   const [isMessageValid, setIsMessageValid] = React.useState<boolean | undefined>()
   const [messageSig, setMessageSig] = React.useState<string | undefined>()
@@ -375,55 +360,30 @@ export const Connected = () => {
     setIsCheckoutInfoModalOpen(true)
   }
 
-  const onClickSwap = () => {
-    const chainId = 137
-    const toTokenAddress = '0x3c499c542cEF5E3811e1192ce70d8cC03d5c3359'
-    const toTokenAmount = '200000'
-    const data = encodeFunctionData({ abi: parseAbi(['function demo()']), functionName: 'demo', args: [] })
-
-    const swapModalSettings: SwapModalSettings = {
-      onSuccess: () => {
-        console.log('swap successful!')
-      },
-      chainId,
-      toTokenAddress,
-      toTokenAmount,
-      postSwapTransactions: [
-        {
-          to: '0x37470dac8a0255141745906c972e414b1409b470',
-          data
-        }
-      ],
-      title: 'Swap and Pay',
-      description: 'Select a token in your wallet to swap to 0.2 USDC.'
-    }
-
-    openSwapModal(swapModalSettings)
-  }
-
-  const onClickSelectPayment = () => {
-    if (!address) {
-      return
-    }
-
-    const creditCardProvider = checkoutProvider || 'forte'
-
-    openSelectPaymentModal({
-      recipientAddress: address,
-      creditCardProviders: [creditCardProvider],
-      onRampProvider: onRampProvider ? (onRampProvider as TransactionOnRampProvider) : TransactionOnRampProvider.transak,
-      onSuccess: (txnHash?: string) => {
-        console.log('success!', txnHash)
-      },
-      onError: (error: Error) => {
-        console.error(error)
-      },
-      onClose: () => {
-        console.log('modal closed!')
-      },
-      ...checkoutPresets[checkoutPreset as keyof typeof checkoutPresets](address || '')
-    })
-  }
+  // Convert to credit card flow
+  // const onClickSelectPayment = () => {
+  //   if (!address) {
+  //     return
+  //   }
+
+  //   const creditCardProvider = checkoutProvider || 'forte'
+
+  //   openSelectPaymentModal({
+  //     recipientAddress: address,
+  //     creditCardProviders: [creditCardProvider],
+  //     onRampProvider: onRampProvider ? (onRampProvider as TransactionOnRampProvider) : TransactionOnRampProvider.transak,
+  //     onSuccess: (txnHash?: string) => {
+  //       console.log('success!', txnHash)
+  //     },
+  //     onError: (error: Error) => {
+  //       console.error(error)
+  //     },
+  //     onClose: () => {
+  //       console.log('modal closed!')
+  //     },
+  //     ...checkoutPresets[checkoutPreset as keyof typeof checkoutPresets](address || '')
+  //   })
+  // }
 
   const onCheckoutInfoConfirm = () => {
     setIsCheckoutInfoModalOpen(false)
@@ -455,14 +415,6 @@ export const Connected = () => {
     }
   }
 
-  const onClickAddFunds = () => {
-    triggerAddFunds({
-      walletAddress: address || '',
-      provider: onRampProvider ? (onRampProvider as TransactionOnRampProvider) : TransactionOnRampProvider.transak,
-      transakOnRampKind: 'default'
-    })
-  }
-
   const onClickConnect = () => {
     setOpenConnectModal(true)
   }
@@ -777,8 +729,6 @@ export const Connected = () => {
               Web SDK Checkout
             </Text>
 
-            <CardButton title="Add Funds" description="Buy Cryptocurrency with a Credit Card" onClick={() => onClickAddFunds()} />
-
             {isDebugMode && (
               <>
                 <CardButton title="Generate EthAuth proof" description="Generate EthAuth proof" onClick={generateEthAuthProof} />
@@ -794,13 +744,6 @@ export const Connected = () => {
                   onClick={() => setIsOpenCustomCheckout(true)}
                 />
 
-                <CardButton
-                  title="ERC1155 Checkout"
-                  description="Purchase with useERC1155SaleContractCheckout hook"
-                  onClick={openCheckoutModal}
-                  isPending={erc1155CheckoutLoading}
-                />
-
                 <CardButton
                   title="Transaction Status Modal"
                   description="Transaction status modal"
@@ -809,18 +752,6 @@ export const Connected = () => {
               </>
             )}
 
-            <CardButton
-              title="Swap"
-              description="Seamlessly swap eligible currencies in your wallet to a target currency"
-              onClick={onClickSwap}
-            />
-
-            <CardButton
-              title="Checkout"
-              description="Purchase an NFT through various purchase methods"
-              onClick={onClickSelectPayment}
-            />
-
             {(chainId === ChainId.ARBITRUM_NOVA || chainId === ChainId.ARBITRUM_SEPOLIA || isWaasConnectionActive) && (
               <Text className="mt-4" variant="small-bold" color="muted">
                 Misc
@@ -945,25 +876,6 @@ export const Connected = () => {
           </Modal>
         )}
       </AnimatePresence>
-      <AnimatePresence>
-        {isOpenCustomCheckout && (
-          <Modal
-            contentProps={{
-              style: {
-                maxWidth: '400px',
-                height: 'auto',
-                ...getModalPositionCss('center')
-              }
-            }}
-            scroll={false}
-            onClose={() => setIsOpenCustomCheckout(false)}
-          >
-            <Scroll style={{ height: '600px' }}>
-              <CustomCheckout />
-            </Scroll>
-          </Modal>
-        )}
-      </AnimatePresence>
     </>
   )
 }