Wallet Connect signing and confirming (but failing) txs on mobile wallet

apps/web/src/composables/contracts.ts

@@ -50,7 +50,7 @@ export default function useContracts() {
     const { getCurrentPrice } = usePrice()
     const { getEthersTrezorSigner } = useTrezor()
     const { user } = useUsers()
-    const { walletConnectSigner } = useWalletConnectV2()
+    const { getWalletConnectSignerV2, walletConnectSigner } = useWalletConnectV2()
 
     const stakeDepositedListener = async () => await refreshBreakdown()
     const stakeRebalancedListener = async () => await refreshBreakdown()
@@ -62,21 +62,17 @@ export default function useContracts() {
                 'Browser': getEthersBrowserSigner,
                 'Ledger': getEthersLedgerSigner,
                 'Trezor': getEthersTrezorSigner,
+                'WalletConnect': getWalletConnectSignerV2
             }
             const signerType = ethersProviderList.includes(walletProvider) ? 'Browser' : walletProvider
             const signerCreator = signerCreators[signerType as keyof typeof signerCreators]
-            let signer
-            if (walletProvider === 'WalletConnect') {
-                signer = walletConnectSigner.value
-            } else {
-                signer = signerCreator(walletProvider)
-            }
+            const signer = await signerCreator(walletProvider)
             const managerSigner = manager.connect(signer as ethers.Signer)
             const fees = await getDepositFees()
             const depositAmount = parseFloat(amount) * ((100 + fees) / 100)
             const value = ethers.utils.parseEther(depositAmount.toString())
             const result = await managerSigner.depositStake({ value, type: 0 })
-            await result.wait()
+            await result.wait(3)
             return true
         } catch (err) {
             console.error(`There was an error in deposit function: ${JSON.stringify(err)}`)
@@ -168,7 +164,6 @@ export default function useContracts() {
     }
 
     async function getCurrentStaked(): Promise<BreakdownAmount> {
-        const provider = new ethers.providers.JsonRpcProvider(ethereumUrl)
         const addresses = (user.value as UserWithAccountsAndOperators).accounts.map((account: Account) => account.address) as string[]
         try {
             const promises = addresses.map((address) => manager.getUserStake(address))
@@ -196,7 +191,6 @@ export default function useContracts() {
     }
 
     async function getDepositFees() {
-        const provider = new ethers.providers.JsonRpcProvider(ethereumUrl)
         const fees = await manager.feePercent()
         const feesRounded = Math.round(fees * 100) / 100
         return feesRounded

apps/web/src/composables/walletConnectV2.ts

@@ -27,6 +27,8 @@ const walletConnectWeb3Provider = ref<Web3Provider | null>(null)
 const walletConnectSigner = ref<ethers.Signer | null>(null)
 const web3Modal = ref<Web3Modal | null>(null)
 
+let nonReactiveEthereumProvider: UniversalProvider | null = null
+let nonReactiveWalletConnectWeb3Provider: Web3Provider | null = null
 
 interface AccountBalances {
   [account: string]: AssetData;
@@ -94,10 +96,36 @@ export default function useWalletConnectV2() {
     }
   }
 
-  // function getEthersWalletConnectSignerV2(): ethers.Signer | null {
-  //   walletConnectSigner.value = walletConnectWeb3Provider.value?.getSigner()
-  //   return walletConnectWeb3Provider.value?.getSigner() || null
-  // }
+  async function getWalletConnectSignerV2(): Promise<ethers.Signer | null> {
+    await reinitializeWalletConnect()
+    // Create a new instance of the Web3Provider based on the current provider's connection
+    const newWeb3Provider = new providers.Web3Provider(nonReactiveWalletConnectWeb3Provider?.provider as providers.ExternalProvider)
+    return newWeb3Provider.getSigner() || null
+  }
+
+  async function reinitializeWalletConnect() {
+    // Check if WalletConnect client is already initialized
+    if (!client.value) {
+        // Initialize the WalletConnect client
+        await createClient()
+    }
+
+    // Check if the Web3Provider is already initialized
+    if (!walletConnectWeb3Provider.value && ethereumProvider.value) {
+        walletConnectWeb3Provider.value = new providers.Web3Provider(ethereumProvider.value)
+        nonReactiveWalletConnectWeb3Provider = walletConnectWeb3Provider.value
+    }
+
+    // Check if the signer is already initialized
+    if (!walletConnectSigner.value && walletConnectWeb3Provider.value) {
+        walletConnectSigner.value = walletConnectWeb3Provider.value.getSigner()
+    }
+
+    // Optionally, you can check for an existing session and restore it
+    if (!session.value && ethereumProvider.value) {
+        await _checkForPersistedSession()
+    }
+  }
 
   async function loginWithWalletConnectV2(loginCredentials: LoginCredentials) {
     const { provider, address, currency } = loginCredentials
@@ -163,7 +191,10 @@ export default function useWalletConnectV2() {
     walletConnectSigner,
     walletConnectWeb3Provider,
     connectWalletConnectV2,
-    loginWithWalletConnectV2
+    getWalletConnectSignerV2,
+    loginWithWalletConnectV2,
+    nonReactiveEthereumProvider,
+    nonReactiveWalletConnectWeb3Provider,
   }
 }
 
@@ -198,6 +229,8 @@ async function createClient() {
       relayUrl: DEFAULT_RELAY_URL,
   })
 
+  nonReactiveEthereumProvider = ethereumProvider.value as UniversalProvider
+
   const localWeb3Modal = new Web3Modal({
       projectId: WALLET_CONNECT_PROJECT_ID,
       walletConnectVersion: 2,
@@ -209,6 +242,7 @@ async function createClient() {
 
 function createWeb3Provider(provider: UniversalProvider) {
   walletConnectWeb3Provider.value = new providers.Web3Provider(provider)
+  nonReactiveWalletConnectWeb3Provider = walletConnectWeb3Provider.value as Web3Provider
   walletConnectSigner.value = walletConnectWeb3Provider.value?.getSigner()
 }