From 25e7e0035f16daec2b3b17527c10bfbd2b74e951 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rui=20Sim=C3=A3o?= Date: Mon, 2 Dec 2024 17:27:58 +0000 Subject: [PATCH] feat: poc v2 --- apps/bob-pay/package.json | 1 + apps/bob-pay/src/lib/form/yup.custom.ts | 4 +- apps/evm/package.json | 12 +- .../app/[lang]/(bridge)/hooks/useGateway.ts | 6 +- apps/evm/src/app/[lang]/sign-up/SignUp.tsx | 4 +- .../src/components/AuthButton/AuthButton.tsx | 8 +- .../src/components/Layout/ConnectButton.tsx | 50 + apps/evm/src/components/Layout/Header.tsx | 5 +- .../components/LoginButton/LoginButton.tsx | 2 +- .../components/SignUpButton/SignUpButton.tsx | 4 +- .../component/AuthButton/AuthButton.tsx | 114 --- .../component/ConnectModal/ConnectModal.tsx | 337 ------- .../component/ConnectModal/EvmWalletList.tsx | 108 --- .../component/ConnectWallet/ConnectWallet.tsx | 82 -- .../__tests__/ConnectWallet.test.tsx | 27 - apps/evm/src/constants/bitcoin.ts | 1 - apps/evm/src/lib/form/yup.custom.ts | 4 +- packages/sats-wagmi/package.json | 38 - packages/ui/package.json | 3 +- packages/utils/package.json | 3 - packages/utils/src/address.ts | 5 - packages/utils/src/index.ts | 1 - packages/wagmi/src/index.ts | 11 - pnpm-lock.yaml | 913 ++++++++---------- pnpm-workspace.yaml | 2 + 25 files changed, 455 insertions(+), 1290 deletions(-) create mode 100644 apps/evm/src/components/Layout/ConnectButton.tsx delete mode 100644 apps/evm/src/connect-ui/component/AuthButton/AuthButton.tsx delete mode 100644 apps/evm/src/connect-ui/component/ConnectModal/ConnectModal.tsx delete mode 100644 apps/evm/src/connect-ui/component/ConnectModal/EvmWalletList.tsx delete mode 100644 apps/evm/src/connect-ui/component/ConnectWallet/ConnectWallet.tsx delete mode 100644 apps/evm/src/connect-ui/component/ConnectWallet/__tests__/ConnectWallet.test.tsx delete mode 100644 packages/sats-wagmi/package.json delete mode 100644 packages/utils/src/address.ts delete mode 100644 packages/wagmi/src/index.ts diff --git a/apps/bob-pay/package.json b/apps/bob-pay/package.json index 995bf9995..5f352528f 100644 --- a/apps/bob-pay/package.json +++ b/apps/bob-pay/package.json @@ -39,6 +39,7 @@ "@yudiel/react-qr-scanner": "^2.0.4", "@zerodev/sdk": "^5.3.4", "big.js": "catalog:", + "bitcoin-address-validation": "^2.2.3", "date-fns": "catalog:", "graphql-request": "catalog:", "negotiator": "catalog:", diff --git a/apps/bob-pay/src/lib/form/yup.custom.ts b/apps/bob-pay/src/lib/form/yup.custom.ts index 48840f5ce..400f44129 100644 --- a/apps/bob-pay/src/lib/form/yup.custom.ts +++ b/apps/bob-pay/src/lib/form/yup.custom.ts @@ -2,7 +2,7 @@ import Big from 'big.js'; import * as yup from 'yup'; import { AnyObject, Maybe } from 'yup/lib/types'; -import { isValidBTCAddress, BitcoinNetwork } from '@gobob/utils'; +import { validate, Network as BitcoinNetwork } from 'bitcoin-address-validation'; import { isAddress } from 'viem'; yup.addMethod(yup.string, 'requiredAmount', function (action: string, customMessage?: string) { @@ -73,7 +73,7 @@ yup.addMethod( yup.addMethod(yup.string, 'btcAddress', function (network: BitcoinNetwork, customMessage?: string) { return this.test('btcAddress', (value, ctx) => { - if (!value || !isValidBTCAddress(value, network)) { + if (!value || !validate(value, network)) { const message = customMessage || 'Please enter a valid address'; return ctx.createError({ message }); diff --git a/apps/evm/package.json b/apps/evm/package.json index 40673e511..38dcddd70 100644 --- a/apps/evm/package.json +++ b/apps/evm/package.json @@ -17,19 +17,16 @@ }, "dependencies": { "@binance/w3w-wagmi-connector-v2": "1.2.4-alpha.0", - "@gobob/bob-sdk": "^3.1.0", "@dynamic-labs/bitcoin": "^3.6.2", "@dynamic-labs/ethereum": "^3.6.2", "@dynamic-labs/iconic": "^3.6.2", "@dynamic-labs/sdk-react-core": "^3.6.2", "@dynamic-labs/wagmi-connector": "^3.6.2", - "@eth-optimism/sdk": "^3.1.6", - "@ethersproject/providers": "^5.7.2", + "@gobob/bob-sdk": "^3.1.0", "@gobob/chains": "workspace:^", "@gobob/currency": "workspace:^", "@gobob/hooks": "workspace:^", "@gobob/icons": "workspace:^", - "@gobob/sats-wagmi": "workspace:^", "@gobob/tokens": "workspace:^", "@gobob/ui": "workspace:^", "@gobob/utils": "workspace:^", @@ -43,11 +40,12 @@ "@scure/base": "^1.1.9", "@scure/btc-signer": "^1.4.0", "@sentry/nextjs": "catalog:", - "@tanstack/react-store": "catalog:", "@tanstack/react-query": "catalog:", + "@tanstack/react-store": "catalog:", "@vercel/kv": "catalog:", "@wagmi/core": "catalog:", "big.js": "catalog:", + "bitcoin-address-validation": "catalog:", "date-fns": "catalog:", "graphql-request": "catalog:", "lottie-react": "^2.4.0", @@ -63,8 +61,8 @@ "use-count-up": "^3.0.1", "usehooks-ts": "catalog:", "viem": "catalog:", - "yup": "catalog:", - "wagmi": "catalog:" + "wagmi": "catalog:", + "yup": "catalog:" }, "devDependencies": { "@gobob/test-utils": "workspace:^", diff --git a/apps/evm/src/app/[lang]/(bridge)/hooks/useGateway.ts b/apps/evm/src/app/[lang]/(bridge)/hooks/useGateway.ts index b8e062477..31910efb6 100644 --- a/apps/evm/src/app/[lang]/(bridge)/hooks/useGateway.ts +++ b/apps/evm/src/app/[lang]/(bridge)/hooks/useGateway.ts @@ -2,7 +2,6 @@ import { GatewayQuoteParams } from '@gobob/bob-sdk'; import { Bitcoin, CurrencyAmount, ERC20Token } from '@gobob/currency'; - import { BITCOIN } from '@gobob/tokens'; import { toast } from '@gobob/ui'; import { t } from '@lingui/macro'; @@ -20,9 +19,9 @@ import { Dispatch, SetStateAction, useCallback, useEffect, useMemo, useState } f import { DebouncedState, useDebounceValue } from 'usehooks-ts'; import { Address, isAddress } from 'viem'; import { useAccount } from 'wagmi'; +import { AddressType } from 'bitcoin-address-validation'; import { INTERVAL } from '@/constants'; - import { BtcFeeRateReturnType, useBtcAccount, @@ -41,7 +40,6 @@ import { InitGatewayTransaction, TransactionType } from '@/types'; -import { BtcAddressType } from '@gobob/utils'; const DUST_THRESHOLD = 1000; @@ -176,7 +174,7 @@ const useGateway = ({ params, onError, onMutate, onSuccess }: UseGatewayLiquidit const minAmount = useMemo(() => getMinAmount(isTopUpEnabled), [isTopUpEnabled]); - const isTapRootAddress = btcAddressType === BtcAddressType.p2tr; + const isTapRootAddress = btcAddressType === AddressType.p2tr; const liquidityQueryEnabled = Boolean( params.toChain && params.toToken && params.type === GatewayTransactionType.STAKE ? params.strategyAddress : true diff --git a/apps/evm/src/app/[lang]/sign-up/SignUp.tsx b/apps/evm/src/app/[lang]/sign-up/SignUp.tsx index 29dca95f3..7e3874ddb 100644 --- a/apps/evm/src/app/[lang]/sign-up/SignUp.tsx +++ b/apps/evm/src/app/[lang]/sign-up/SignUp.tsx @@ -58,8 +58,8 @@ const SignUp = (): JSX.Element | null => { useAccountEffect({ onConnect: () => { - if (isConnecting) { - signUp({}); + if (isConnecting && address) { + signUp(address); setConnecting(false); } diff --git a/apps/evm/src/components/AuthButton/AuthButton.tsx b/apps/evm/src/components/AuthButton/AuthButton.tsx index f5e7d27c4..5788f2612 100644 --- a/apps/evm/src/components/AuthButton/AuthButton.tsx +++ b/apps/evm/src/components/AuthButton/AuthButton.tsx @@ -3,10 +3,9 @@ import { useDynamicContext, useDynamicModals } from '@dynamic-labs/sdk-react-core'; import { ChainId, getChainName } from '@gobob/chains'; import { Button, ButtonProps } from '@gobob/ui'; -import { useAccount, useSwitchChain } from '@gobob/wagmi'; import { Trans } from '@lingui/macro'; -import { PressEvent } from '@react-aria/interactions'; import { useIsClient } from 'usehooks-ts'; +import { useAccount, useSwitchChain } from 'wagmi'; import { useBtcAccount } from '@/hooks'; @@ -71,8 +70,9 @@ const AuthButton = ({ const name = getChainName(chainProp); const capitalizedName = name.charAt(0).toUpperCase() + name.slice(1); - const handlePress = async (e: PressEvent) => { - await switchChainAsync?.({ chainId: chainProp }); + // eslint-disable-next-line @typescript-eslint/no-explicit-any + const handlePress = async (e: any) => { + switchChainAsync?.({ chainId: chainProp }); if (shouldPressAfterSwitch) { onPress?.(e); diff --git a/apps/evm/src/components/Layout/ConnectButton.tsx b/apps/evm/src/components/Layout/ConnectButton.tsx new file mode 100644 index 000000000..361e55a6a --- /dev/null +++ b/apps/evm/src/components/Layout/ConnectButton.tsx @@ -0,0 +1,50 @@ +'use client'; + +import { Button, Drawer } from '@gobob/ui'; +import { truncateBtcAddress, truncateEthAddress } from '@gobob/utils'; +import { Trans } from '@lingui/macro'; +import { useAccount } from 'wagmi'; +import { useDynamicContext } from '@dynamic-labs/sdk-react-core'; +import { useState } from 'react'; + +import { useBtcAccount } from '@/hooks'; + +const ConnectButton = (): JSX.Element => { + const { setShowAuthFlow } = useDynamicContext(); + + const { address: evmAddress } = useAccount(); + const { address: btcAddress } = useBtcAccount(); + + const [isOpen, setOpen] = useState(false); + + const isAuthenticated = evmAddress || btcAddress; + + if (!isAuthenticated) { + const handleConnect = () => { + setShowAuthFlow(true); + }; + + return ( + + ); + } + + const handleOpen = () => setOpen(true); + + const handleClose = () => setOpen(false); + + return ( + <> + + + Here + + + ); +}; + +export { ConnectButton }; diff --git a/apps/evm/src/components/Layout/Header.tsx b/apps/evm/src/components/Layout/Header.tsx index bbd4ee21b..5c16bb577 100644 --- a/apps/evm/src/components/Layout/Header.tsx +++ b/apps/evm/src/components/Layout/Header.tsx @@ -1,6 +1,5 @@ 'use client'; -import { DynamicWidget } from '@dynamic-labs/sdk-react-core'; import { Bars3, Button, @@ -26,6 +25,7 @@ import { StyledHeader, StyledLogoWrapper } from './Layout.style'; import { useLayoutContext } from './LayoutContext'; import { Nav } from './Nav'; import { NavItem } from './NavItem'; +import { ConnectButton } from './ConnectButton'; import { DocsLinks, RoutesPath } from '@/constants'; import { useUserAgent } from '@/user-agent'; @@ -114,7 +114,8 @@ const Header = ({ isTestnet, isFusion, ...props }: HeaderProps): JSX.Element =>