diff --git a/.changeset/popular-forks-warn.md b/.changeset/popular-forks-warn.md new file mode 100644 index 0000000..49ed46c --- /dev/null +++ b/.changeset/popular-forks-warn.md @@ -0,0 +1,5 @@ +--- +'@node-real/walletkit': patch +--- + +Support tronLink on mobile diff --git a/packages/walletkit/package.json b/packages/walletkit/package.json index de9b192..a24b66d 100644 --- a/packages/walletkit/package.json +++ b/packages/walletkit/package.json @@ -57,11 +57,11 @@ "@solana/wallet-adapter-react": "^0", "@solana/wallet-adapter-wallets": "^0", "@solana/web3.js": "^1", - "@tronweb3/tronwallet-abstract-adapter": "^1.1.7", - "@tronweb3/tronwallet-adapter-react-hooks": "^1.1.8", - "@tronweb3/tronwallet-adapters": "^1.2.4", + "@tronweb3/tronwallet-abstract-adapter": "^1", + "@tronweb3/tronwallet-adapter-react-hooks": "^1", + "@tronweb3/tronwallet-adapters": "^1", "@walletconnect/solana-adapter": "^0.0.5", - "qrcode": "^1.5.3" + "qrcode": "^1" }, "devDependencies": { "@tanstack/react-query": "^5.51.1", diff --git a/packages/walletkit/src/core/configs/tronLink/icon.tsx b/packages/walletkit/src/core/configs/tronLink/icon.tsx index eb919e0..62e079e 100644 --- a/packages/walletkit/src/core/configs/tronLink/icon.tsx +++ b/packages/walletkit/src/core/configs/tronLink/icon.tsx @@ -1,113 +1,46 @@ export const TronLinkTransparentIcon = (props: SVGIconProps) => { return ( - - - - - + + - - - - - + + + + + + - - - + + + + + ); }; export const TronLinkIcon = (props: SVGIconProps) => { - return ( - - - - - - - - - - - - - - - - - - - - - - - ); + return ; }; diff --git a/packages/walletkit/src/tron/components/SetTronWalletClickRef/index.tsx b/packages/walletkit/src/tron/components/SetTronWalletClickRef/index.tsx index c481db4..a2249d5 100644 --- a/packages/walletkit/src/tron/components/SetTronWalletClickRef/index.tsx +++ b/packages/walletkit/src/tron/components/SetTronWalletClickRef/index.tsx @@ -1,7 +1,9 @@ +import { isMobile } from '@/core/index'; import { useConnectModal } from '@/core/modals/ConnectModal/context'; import { ViewRoutes } from '@/core/modals/ConnectModal/RouteProvider'; import { useRouter } from '@/core/modals/ConnectModal/RouteProvider/context'; import { useWalletKit } from '@/core/providers/WalletKitProvider/context'; +import { useTronConnect } from '@/tron/hooks/useTronConnect'; import { TronWallet } from '@/tron/wallets'; import { useWallet } from '@tronweb3/tronwallet-adapter-react-hooks'; import { useRef } from 'react'; @@ -15,6 +17,7 @@ export function SetTronWalletClickRef(props: SetTronWalletClickRefProps) { const { log, options, setSelectedWallet, tronConfig } = useWalletKit(); const { disconnect } = useWallet(); + const { connect } = useTronConnect(); const connectModal = useConnectModal(); const router = useRouter(); @@ -50,7 +53,17 @@ export function SetTronWalletClickRef(props: SetTronWalletClickRefProps) { clearTimeout(timerRef.current); timerRef.current = setTimeout(() => { - jumpToConnectingView(); + if (isMobile()) { + if (wallet.isInstalled()) { + jumpToConnectingView(); + } else { + connect({ + adapterName: wallet.adapterName, + }); + } + } else { + jumpToConnectingView(); + } }, 300); }; diff --git a/packages/walletkit/src/tron/components/TronConnectingView/index.tsx b/packages/walletkit/src/tron/components/TronConnectingView/index.tsx index aaad951..5040b9e 100644 --- a/packages/walletkit/src/tron/components/TronConnectingView/index.tsx +++ b/packages/walletkit/src/tron/components/TronConnectingView/index.tsx @@ -2,22 +2,23 @@ import { CONNECT_STATUS } from '@/core/constants'; import { TemplateConnectingView } from '@/core/modals/ConnectModal/TemplateConnectingView'; import { useWalletKit } from '@/core/providers/WalletKitProvider/context'; import { EventEmitter } from '@/core/utils/eventEmitter'; +import { useTronConnect } from '@/tron/hooks/useTronConnect'; import { tronCommonErrorHandler } from '@/tron/utils/tronCommonErrorHandler'; import { TronWallet } from '@/tron/wallets'; -import { AdapterName } from '@tronweb3/tronwallet-abstract-adapter'; import { useWallet, WalletProviderProps } from '@tronweb3/tronwallet-adapter-react-hooks'; import { useCallback, useEffect, useState } from 'react'; type WalletError = Parameters['onError']>[0]; export function TronConnectingView() { - const { log, selectedWallet, options, tronConfig } = useWalletKit(); + const { log, selectedWallet, options } = useWalletKit(); const [status, setStatus] = useState( selectedWallet.isInstalled() ? CONNECT_STATUS.CONNECTING : CONNECT_STATUS.UNAVAILABLE, ); - const { select, wallets: adapters, connected } = useWallet(); + const { connected } = useWallet(); + const { connect } = useTronConnect(); useEffect(() => { const onError = (error: WalletError) => { @@ -49,18 +50,10 @@ export function TronConnectingView() { if (!selectedWallet.isInstalled()) return; setStatus(CONNECT_STATUS.CONNECTING); - select((selectedWallet as TronWallet).adapterName as AdapterName); - - if (!tronConfig?.autoConnect) { - const adapter = adapters.find( - (item) => item.adapter.name === (selectedWallet as TronWallet).adapterName, - )?.adapter; - - if (adapter) { - await adapter.connect(); - } - } - }, [adapters, select, selectedWallet, tronConfig]); + connect({ + adapterName: (selectedWallet as TronWallet).adapterName, + }); + }, [connect, selectedWallet]); return ( { + select(adapterName as any); + if (!tronConfig?.autoConnect) { + const adapter = adapters.find((item) => item.adapter.name === adapterName)?.adapter; + if (adapter) { + await adapter.connect(); + } + } + }, + [adapters, select, tronConfig?.autoConnect], + ); + + return { + connect, + }; +}