feat: convert

packages/ethers/src/client.ts

@@ -12,7 +12,7 @@ import type {
   Token
 } from '@web3modal/scaffold'
 import { Web3ModalScaffold } from '@web3modal/scaffold'
-import { ConstantsUtil, PresetsUtil, HelpersUtil, RegexUtil } from '@web3modal/scaffold-utils'
+import { ConstantsUtil, PresetsUtil, HelpersUtil } from '@web3modal/scaffold-utils'
 import EthereumProvider from '@walletconnect/ethereum-provider'
 import type { Web3ModalSIWEClient } from '@web3modal/siwe'
 import type {
@@ -38,7 +38,12 @@ import {
 } from '@web3modal/scaffold-utils/ethers'
 import type { EthereumProviderOptions } from '@walletconnect/ethereum-provider'
 import type { Eip1193Provider } from 'ethers'
-import { W3mFrameProvider, W3mFrameHelpers, W3mFrameRpcConstants } from '@web3modal/wallet'
+import {
+  W3mFrameProvider,
+  W3mFrameHelpers,
+  W3mFrameRpcConstants,
+  W3mFrameConstants
+} from '@web3modal/wallet'
 import type { CombinedProvider } from '@web3modal/scaffold-utils/ethers'
 import { BrowserProvider } from 'ethers'
 import { JsonRpcSigner } from 'ethers'
@@ -842,32 +847,32 @@ export class Web3Modal extends Web3ModalScaffold {
           }, 300)
         }
       })
-      this.emailProvider.onRpcResponse(receive => {
-        // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error, @typescript-eslint/ban-ts-comment
-        // @ts-ignore
-        const payload = receive?.payload
-        // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error, @typescript-eslint/ban-ts-comment
-        // @ts-ignore
-        const isError = receive?.type === '@w3m-frame/RPC_REQUEST_ERROR'
-
-        if (isError && super.isOpen()) {
-          if (super.isTransactionStackEmpty()) {
-            super.close()
-          } else {
-            super.popTransactionStack(true)
+      this.emailProvider.onRpcResponse(response => {
+        const responseType = W3mFrameHelpers.getResponseType(response)
+
+        switch (responseType) {
+          case W3mFrameConstants.RPC_RESPONSE_TYPE_ERROR: {
+            const isModalOpen = super.isOpen()
+
+            if (isModalOpen) {
+              if (super.isTransactionStackEmpty()) {
+                super.close()
+              } else {
+                super.popTransactionStack(true)
+              }
+            }
+            break
           }
-        }
-
-        const isPayloadString = typeof payload === 'string'
-        const isAddress = isPayloadString ? payload?.startsWith('0x') : false
-        const isCompleted = isAddress && payload?.match(RegexUtil.transactionHashRegex)
-
-        if (isCompleted) {
-          if (super.isTransactionStackEmpty()) {
-            super.close()
-          } else {
-            super.popTransactionStack()
+          case W3mFrameConstants.RPC_RESPONSE_TYPE_TX: {
+            if (super.isTransactionStackEmpty()) {
+              super.close()
+            } else {
+              super.popTransactionStack()
+            }
+            break
           }
+          default:
+            break
         }
       })
       this.emailProvider.onNotConnected(() => {

packages/scaffold-utils/exports/index.ts

@@ -1,4 +1,3 @@
 export { ConstantsUtil } from '../src/ConstantsUtil.js'
 export { PresetsUtil } from '../src/PresetsUtil.js'
 export { HelpersUtil } from '../src/HelpersUtil.js'
-export { RegexUtil } from '../src/RegexUtil.js'

packages/wagmi/src/client.ts

@@ -33,13 +33,13 @@ import { formatUnits, parseUnits } from 'viem'
 import type { Hex } from 'viem'
 import { Web3ModalScaffold } from '@web3modal/scaffold'
 import type { Web3ModalSIWEClient } from '@web3modal/siwe'
-import { ConstantsUtil, PresetsUtil, HelpersUtil, RegexUtil } from '@web3modal/scaffold-utils'
+import { ConstantsUtil, PresetsUtil, HelpersUtil } from '@web3modal/scaffold-utils'
 import {
   getCaipDefaultChain,
   getEmailCaipNetworks,
   getWalletConnectCaipNetworks
 } from './utils/helpers.js'
-import { W3mFrameHelpers, W3mFrameRpcConstants } from '@web3modal/wallet'
+import { W3mFrameConstants, W3mFrameHelpers, W3mFrameRpcConstants } from '@web3modal/wallet'
 import type { W3mFrameProvider, W3mFrameTypes } from '@web3modal/wallet'
 import { NetworkUtil } from '@web3modal/common'
 import type { defaultWagmiConfig as coreConfig } from './utils/defaultWagmiCoreConfig.js'
@@ -493,32 +493,32 @@ export class Web3Modal extends Web3ModalScaffold {
         }
       })
 
-      provider.onRpcResponse(receive => {
-        // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error, @typescript-eslint/ban-ts-comment
-        // @ts-ignore
-        const payload = receive?.payload
-        // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error, @typescript-eslint/ban-ts-comment
-        // @ts-ignore
-        const isError = receive?.type === '@w3m-frame/RPC_REQUEST_ERROR'
-
-        if (isError && super.isOpen()) {
-          if (super.isTransactionStackEmpty()) {
-            super.close()
-          } else {
-            super.popTransactionStack(true)
-          }
-        }
+      provider.onRpcResponse(response => {
+        const responseType = W3mFrameHelpers.getResponseType(response)
 
-        const isPayloadString = typeof payload === 'string'
-        const isAddress = isPayloadString ? payload?.startsWith('0x') : false
-        const isCompleted = isAddress && payload?.match(RegexUtil.transactionHashRegex)
+        switch (responseType) {
+          case W3mFrameConstants.RPC_RESPONSE_TYPE_ERROR: {
+            const isModalOpen = super.isOpen()
 
-        if (isCompleted) {
-          if (super.isTransactionStackEmpty()) {
-            super.close()
-          } else {
-            super.popTransactionStack()
+            if (isModalOpen) {
+              if (super.isTransactionStackEmpty()) {
+                super.close()
+              } else {
+                super.popTransactionStack(true)
+              }
+            }
+            break
+          }
+          case W3mFrameConstants.RPC_RESPONSE_TYPE_TX: {
+            if (super.isTransactionStackEmpty()) {
+              super.close()
+            } else {
+              super.popTransactionStack()
+            }
+            break
           }
+          default:
+            break
         }
       })
 

packages/wallet/index.ts

@@ -3,6 +3,10 @@ export { W3mFrame } from './src/W3mFrame.js'
 export { W3mFrameHelpers } from './src/W3mFrameHelpers.js'
 export { W3mFrameProvider } from './src/W3mFrameProvider.js'
 export { W3mFrameSchema } from './src/W3mFrameSchema.js'
-export { W3mFrameConstants, W3mFrameRpcConstants } from './src/W3mFrameConstants.js'
+export {
+  W3mFrameConstants,
+  W3mFrameRpcConstants,
+  type W3mFrameConstantValue
+} from './src/W3mFrameConstants.js'
 export { W3mFrameStorage } from './src/W3mFrameStorage.js'
 export type { W3mFrameTypes } from './src/W3mFrameTypes.js'

packages/wallet/src/RegexUtil.ts

@@ -0,0 +1,4 @@
+export const RegexUtil = {
+  address: /^0x(?:[A-Fa-f0-9]{40})$/u,
+  transactionHash: /^0x(?:[A-Fa-f0-9]{64})$/u
+}

packages/wallet/src/W3mFrame.ts

@@ -1,4 +1,4 @@
-import { W3mFrameConstants } from './W3mFrameConstants.js'
+import { SECURE_SITE_SDK, W3mFrameConstants } from './W3mFrameConstants.js'
 import { W3mFrameSchema } from './W3mFrameSchema.js'
 import { W3mFrameHelpers } from './W3mFrameHelpers.js'
 import type { W3mFrameTypes } from './W3mFrameTypes.js'
@@ -34,7 +34,7 @@ export class W3mFrame {
       if (W3mFrameHelpers.isClient) {
         const iframe = document.createElement('iframe')
         iframe.id = 'w3m-iframe'
-        iframe.src = `${W3mFrameConstants.SECURE_SITE_SDK}?projectId=${projectId}`
+        iframe.src = `${SECURE_SITE_SDK}?projectId=${projectId}`
         iframe.style.position = 'fixed'
         iframe.style.zIndex = '999999'
         iframe.style.display = 'none'

packages/wallet/src/W3mFrameConstants.ts

@@ -1,6 +1,7 @@
+export const SECURE_SITE_SDK =
+  process.env['NEXT_PUBLIC_SECURE_SITE_SDK_URL'] || 'https://secure.walletconnect.com/sdk'
+
 export const W3mFrameConstants = {
-  SECURE_SITE_SDK:
-    process.env['NEXT_PUBLIC_SECURE_SITE_SDK_URL'] || 'https://secure.walletconnect.com/sdk',
   APP_EVENT_KEY: '@w3m-app/',
   FRAME_EVENT_KEY: '@w3m-frame/',
   RPC_METHOD_KEY: 'RPC_',
@@ -70,9 +71,15 @@ export const W3mFrameConstants = {
   FRAME_INIT_SMART_ACCOUNT_SUCCESS: '@w3m-frame/INIT_SMART_ACCOUNT_SUCCESS',
   FRAME_INIT_SMART_ACCOUNT_ERROR: '@w3m-frame/INIT_SMART_ACCOUNT_ERROR',
   FRAME_SET_PREFERRED_ACCOUNT_SUCCESS: '@w3m-frame/SET_PREFERRED_ACCOUNT_SUCCESS',
-  FRAME_SET_PREFERRED_ACCOUNT_ERROR: '@w3m-frame/SET_PREFERRED_ACCOUNT_ERROR'
+  FRAME_SET_PREFERRED_ACCOUNT_ERROR: '@w3m-frame/SET_PREFERRED_ACCOUNT_ERROR',
+
+  RPC_RESPONSE_TYPE_ERROR: 'RPC_RESPONSE_ERROR',
+  RPC_RESPONSE_TYPE_TX: 'RPC_RESPONSE_TRANSACTION_HASH',
+  RPC_RESPONSE_TYPE_OBJECT: 'RPC_RESPONSE_OBJECT'
 } as const
 
+export type W3mFrameConstantValue = (typeof W3mFrameConstants)[keyof typeof W3mFrameConstants]
+
 export const W3mFrameRpcConstants = {
   SAFE_RPC_METHODS: [
     'eth_accounts',

packages/wallet/src/W3mFrameHelpers.ts

@@ -1,6 +1,11 @@
 import { W3mFrameStorage } from './W3mFrameStorage.js'
-import { W3mFrameConstants, W3mFrameRpcConstants } from './W3mFrameConstants.js'
+import {
+  W3mFrameConstants,
+  W3mFrameRpcConstants,
+  type W3mFrameConstantValue
+} from './W3mFrameConstants.js'
 import type { W3mFrameTypes } from './W3mFrameTypes.js'
+import { RegexUtil } from './RegexUtil.js'
 
 const RESTRICTED_TIMEZONES = [
   'ASIA/SHANGHAI',
@@ -67,6 +72,28 @@ export const W3mFrameHelpers = {
     return (request as { payload: W3mFrameTypes.RPCRequest })?.payload?.method
   },
 
+  getResponseType(response: unknown) {
+    const { type, payload } = response as {
+      type: W3mFrameConstantValue
+      payload: W3mFrameTypes.RPCResponse
+    }
+
+    const isError = type === W3mFrameConstants.FRAME_RPC_REQUEST_ERROR
+
+    if (isError) {
+      return W3mFrameConstants.RPC_RESPONSE_TYPE_ERROR
+    }
+
+    const isPayloadString = typeof payload === 'string'
+    const isTransactionHash = isPayloadString && payload.match(RegexUtil.transactionHash)
+
+    if (isTransactionHash) {
+      return W3mFrameConstants.RPC_RESPONSE_TYPE_TX
+    }
+
+    return W3mFrameConstants.RPC_RESPONSE_TYPE_OBJECT
+  },
+
   checkIfRequestIsAllowed(request: unknown) {
     const method = this.getRequestMethod(request)