diff --git a/src/web3/adapters/EthereumAdapter.ts b/src/web3/adapters/EthereumAdapter.ts index 72373a0..abd961c 100644 --- a/src/web3/adapters/EthereumAdapter.ts +++ b/src/web3/adapters/EthereumAdapter.ts @@ -1,3 +1,5 @@ +// TODO: need fix execute tx + import { produce } from 'immer'; import { GetTransactionReturnType, Hex, PublicClient } from 'viem'; @@ -29,7 +31,6 @@ export class EthereumAdapter implements AdapterInterface { }): Promise => { const { activeWallet, chainId, type } = params; const tx = params.tx as GetTransactionReturnType; - console.log('tx execute', params.tx); // ethereum tx const transaction = { diff --git a/src/web3/adapters/GelatoAdapter.ts b/src/web3/adapters/GelatoAdapter.ts index a68bca3..57a3007 100644 --- a/src/web3/adapters/GelatoAdapter.ts +++ b/src/web3/adapters/GelatoAdapter.ts @@ -1,3 +1,5 @@ +// TODO: need fix execute tx + import { produce } from 'immer'; import { GetTransactionReturnType, Hex } from 'viem'; diff --git a/src/web3/adapters/GnosisAdapter.ts b/src/web3/adapters/GnosisAdapter.ts index 9939992..11c3e66 100644 --- a/src/web3/adapters/GnosisAdapter.ts +++ b/src/web3/adapters/GnosisAdapter.ts @@ -1,3 +1,5 @@ +// TODO: need fix execute tx + import dayjs from 'dayjs'; import { produce } from 'immer'; import { GetTransactionReturnType, Hex } from 'viem'; diff --git a/src/web3/connectors/index.ts b/src/web3/connectors/index.ts index 8938706..aeb0a6a 100644 --- a/src/web3/connectors/index.ts +++ b/src/web3/connectors/index.ts @@ -1,3 +1,5 @@ +// TODO: need add mock connector + import { Chain } from 'viem'; import { CoinbaseWalletConnector } from 'wagmi/connectors/coinbaseWallet'; import { InjectedConnector } from 'wagmi/connectors/injected'; diff --git a/src/web3/providers/WagmiProvider.tsx b/src/web3/providers/WagmiProvider.tsx index 3b7c4b6..1356781 100644 --- a/src/web3/providers/WagmiProvider.tsx +++ b/src/web3/providers/WagmiProvider.tsx @@ -1,13 +1,10 @@ -import React, { ReactNode, useEffect, useState } from 'react'; import { configureChains, createConfig, - useAccount, - useChainId, - usePublicClient, - useWalletClient, - WagmiConfig, -} from 'wagmi'; + GetAccountResult, + watchAccount, +} from '@wagmi/core'; +import React, { useEffect, useState } from 'react'; import { publicProvider } from 'wagmi/providers/public'; import { StoreApi, UseBoundStore } from 'zustand'; @@ -29,22 +26,21 @@ interface WagmiProviderProps { }> >; connectorsInitProps: AllConnectorsInitProps; - children: ReactNode; } function Child({ useStore, connectors, - children, }: Omit & { connectors: ConnectorType[]; }) { - const { connector, isConnected, address: account } = useAccount(); - const chainId = useChainId(); - const publicClient = usePublicClient(); - const walletClient = useWalletClient(); + const [account, setAccount] = useState( + undefined, + ); + watchAccount((data) => { + setAccount(data); + }); - const setActiveWallet = useStore((state) => state.setActiveWallet); const setConnectors = useStore((state) => state.setConnectors); const disconnectActiveWallet = useStore( (state) => state.disconnectActiveWallet, @@ -59,44 +55,25 @@ function Child({ }, [connectors]); useEffect(() => { - const walletType = - connector && getConnectorName(connector as ConnectorType); + if (account && account.address && account.isConnected) { + const walletType = + account.connector && + getConnectorName(account.connector as ConnectorType); - console.log('wallet client', walletClient); - - if ( - walletType && - account && - isConnected && - publicClient && - walletClient && - walletClient.data - ) { - console.log('here'); - setCurrentWalletType(walletType); - // TODO: don't forget to change to different - setActiveWallet({ - walletType, - account, - chainId, - client: publicClient, - walletClient: walletClient.data, - isActive: isConnected, - isContractAddress: false, - }); - } else if (currentWalletType !== walletType) { - disconnectActiveWallet(); + if (walletType) { + setCurrentWalletType(walletType); + } else if (currentWalletType !== walletType) { + disconnectActiveWallet(); + } } - }, [isConnected, chainId, publicClient, account, walletClient]); + }, [account]); - return children; + return null; } -// TODO: maybe need fix export function WagmiProvider({ useStore, connectorsInitProps, - children, }: WagmiProviderProps) { const [connectors] = useState(initAllConnectors(connectorsInitProps)); const [mappedConnectors] = useState( @@ -108,17 +85,11 @@ export function WagmiProvider({ [publicProvider()], ); - const client = createConfig({ + createConfig({ autoConnect: false, publicClient, connectors, }); - return ( - - - {children} - - - ); + return ; } diff --git a/src/web3/store/transactionsSlice.ts b/src/web3/store/transactionsSlice.ts index 3a8ef22..fe202ec 100644 --- a/src/web3/store/transactionsSlice.ts +++ b/src/web3/store/transactionsSlice.ts @@ -1,3 +1,5 @@ +// TODO: need fix execute tx + import { Draft, produce } from 'immer'; import { GetTransactionReturnType, Hex, PublicClient } from 'viem'; diff --git a/src/web3/store/walletSlice.ts b/src/web3/store/walletSlice.ts index 6655103..4e116d3 100644 --- a/src/web3/store/walletSlice.ts +++ b/src/web3/store/walletSlice.ts @@ -1,6 +1,13 @@ -import { ConnectArgs } from '@wagmi/core'; +import { + connect, + disconnect, + getAccount, + getNetwork, + getPublicClient, + getWalletClient, +} from '@wagmi/core'; import { produce } from 'immer'; -import { Chain, PublicClient, WalletClient } from 'viem'; +import { Hex, PublicClient, WalletClient } from 'viem'; import { mainnet } from 'viem/chains'; import { StoreSlice } from '../../types/store'; @@ -15,7 +22,7 @@ import { TransactionsSliceBaseType } from './transactionsSlice'; export interface Wallet { walletType: WalletType; - account: string; + account: Hex; chainId?: number; client: PublicClient; walletClient: WalletClient; @@ -29,17 +36,12 @@ export type IWalletSlice = { isContractWalletRecord: Record; activeWallet?: Wallet; getActiveAddress: () => string | undefined; - connectWallet: ( - connect: (args?: Partial | undefined) => void, - walletType: WalletType, - chainID?: number, - ) => Promise; + connectWallet: (walletType: WalletType, chainID?: number) => Promise; disconnectActiveWallet: () => Promise; walletActivating: boolean; walletConnectionError: string; resetWalletConnectionError: () => void; initDefaultWallet: () => Promise; - setActiveWallet: (wallet: Wallet) => Promise; changeActiveWalletChainId: (chainId?: number) => void; checkAndSwitchNetwork: (chainId?: number) => Promise; connectors: ConnectorType[]; @@ -53,10 +55,8 @@ export type IWalletSlice = { export function createWalletSlice({ walletConnected, - getChainParameters, }: { walletConnected: (wallet: Wallet) => void; // TODO: why all of them here hardcoded - getChainParameters: (chainId: number) => Chain; }): StoreSlice { return (set, get) => ({ isContractWalletRecord: {}, @@ -76,11 +76,11 @@ export function createWalletSlice({ ) as WalletType | undefined; if (lastConnectedWallet) { - // TODO: need fix - // await get().connectWallet(lastConnectedWallet); + await get().connectWallet(lastConnectedWallet); } }, - connectWallet: async (connect, walletType, txChainID) => { + + connectWallet: async (walletType, txChainID) => { let chainID = txChainID; const activeWallet = get().activeWallet; @@ -106,30 +106,47 @@ export function createWalletSlice({ ); try { if (connector) { - console.log('connector in store', connector); - connect({ connector, chainId: chainID }); - - // switch (walletType) { - // case 'Coinbase': - // await connector.connect({ chainId: chainID }); - // break; - // case 'Metamask': - // await connector.connect({ - // chainId: - // typeof chainID !== 'undefined' - // ? getChainParameters(chainID).id - // : undefined, - // }); - // break; - // case 'WalletConnect': - // await connector.connect({ chainId: chainID }); - // break; - // case 'GnosisSafe': - // await connector.connect({ chainId: chainID }); - // break; - // } + await connect({ connector, chainId: chainID }); setLocalStorageWallet(walletType); get().updateEthAdapter(walletType === 'GnosisSafe'); + + const account = getAccount(); + const network = getNetwork(); + if ( + account && + account.isConnected && + account.address && + network.chain + ) { + const client = getPublicClient({ chainId: network.chain.id }); + const walletClient = await getWalletClient({ + chainId: network.chain.id, + }); + + if (client && walletClient) { + const wallet = { + walletType, + account: account.address, + chainId: network.chain.id, + client, + walletClient, + isActive: account.isConnected, + isContractAddress: false, + }; + + const isContractAddress = + await get().checkIsContractWallet(wallet); + + set({ + activeWallet: { + ...wallet, + isContractAddress: isContractAddress, + }, + }); + + walletConnected(wallet); + } + } } } catch (e) { if (e instanceof Error) { @@ -166,13 +183,12 @@ export function createWalletSlice({ (connector) => getConnectorName(connector) === activeWallet.walletType, ); - if (activeConnector?.disconnect) { - await activeConnector.disconnect(); + await disconnect(); } - // await activeConnector?.resetState(); TODO: need check set({ activeWallet: undefined }); } + // TODO: need fix deleteLocalStorageWallet(); clearWalletConnectLocalStorage(); }, @@ -182,11 +198,9 @@ export function createWalletSlice({ if (walletRecord !== undefined) { return walletRecord; } - // TODO: need fix - // const codeOfWalletAddress = await wallet.walletClient.getCode( - // wallet.accounts[0], - // ); - const codeOfWalletAddress: string = ''; + const codeOfWalletAddress = await wallet.client.getBytecode({ + address: wallet.account, + }); const isContractWallet = codeOfWalletAddress !== '0x'; set((state) => produce(state, (draft) => { @@ -195,30 +209,7 @@ export function createWalletSlice({ ); return isContractWallet; }, - /** - * setActiveWallet is separate from connectWallet for a reason, after metaMask.activate() - * only provider is available in the returned type, but we also need accounts and chainID which for some reason - * is impossible to pull from .provider() still not the best approach, and I'm looking to find proper way to handle it - */ - setActiveWallet: async (wallet) => { - if (wallet.chainId !== undefined) { - get().setClient(wallet.chainId, wallet.client); - } - console.log('activeWallet when set', wallet); - // TODO: need fix - // const isContractAddress = await get().checkIsContractWallet(wallet); - set({ - activeWallet: { - ...wallet, - // isContractAddress: isContractAddress, - isContractAddress: false, - }, - }); - const activeWallet = get().activeWallet; - if (activeWallet) { - walletConnected(activeWallet); - } - }, + changeActiveWalletChainId: (chainId) => { if (chainId !== undefined) { set((state) => @@ -230,7 +221,6 @@ export function createWalletSlice({ ); } }, - getActiveAddress: () => { const activeWallet = get().activeWallet; if (activeWallet && activeWallet.account) { @@ -238,11 +228,9 @@ export function createWalletSlice({ } return undefined; }, - setImpersonatedAddress: (address) => { set({ _impersonatedAddress: address }); }, - resetWalletConnectionError: () => { set({ walletConnectionError: '' }); },