correct current chain state for provider

Author: Nguyen Anh Tu

packages/modal/src/modalManager.ts

@@ -81,8 +81,8 @@ export class Web3Auth extends Web3AuthNoModal implements IWeb3AuthModal {
 
     // setup common JRPC provider
     this.commonJRPCProvider = await CommonJRPCProvider.getProviderInstance({
-      getCurrentChain: this.getCurrentChain.bind(this),
-      getChain: this.getChain.bind(this),
+      chain: this.currentChain,
+      chains: this.coreOptions.chains,
     });
     const { key_export_enabled: keyExportEnabled } = projectConfig;
     if (typeof keyExportEnabled === "boolean") {

packages/no-modal/src/base/connector/interfaces.ts

@@ -13,7 +13,7 @@ import {
 } from "@web3auth/auth";
 
 import { ConnectorNamespaceType, CustomChainConfig } from "../chain/IChainInterface";
-import { IWeb3Auth, IWeb3AuthCoreOptions } from "../core/IWeb3Auth";
+import { IWeb3AuthCoreOptions } from "../core/IWeb3Auth";
 import { Web3AuthError } from "../errors";
 import { PROJECT_CONFIG_RESPONSE } from "../interfaces";
 import { ProviderEvents, SafeEventEmitterProvider } from "../provider/IProvider";
@@ -42,8 +42,6 @@ export type UserAuthInfo = { idToken: string };
 
 export interface BaseConnectorSettings {
   coreOptions: IWeb3AuthCoreOptions;
-  getCurrentChain: IWeb3Auth["getCurrentChain"];
-  getChain: IWeb3Auth["getChain"];
 }
 
 export interface IProvider extends SafeEventEmitter<ProviderEvents> {
@@ -85,8 +83,6 @@ export interface IConnector<T> extends SafeEventEmitter {
 export type ConnectorParams = {
   projectConfig?: PROJECT_CONFIG_RESPONSE;
   coreOptions: IWeb3AuthCoreOptions;
-  getCurrentChain: IWeb3Auth["getCurrentChain"];
-  getChain: IWeb3Auth["getChain"];
 };
 
 export type ConnectorFn = (params: ConnectorParams) => IConnector<unknown>;

packages/no-modal/src/base/core/IWeb3Auth.ts

@@ -134,6 +134,7 @@ export interface IWeb3Auth extends IWeb3AuthCore {
   cachedConnector: string | null;
   getCurrentChain(): CustomChainConfig;
   getChain(chainId: string): CustomChainConfig | undefined;
+  getChains(): CustomChainConfig[];
   getConnector(connectorName: WALLET_CONNECTOR_TYPE): IConnector<unknown> | null;
   /**
    * Connect to a specific wallet connector

packages/no-modal/src/connectors/auth-connector/authConnector.ts

@@ -56,18 +56,11 @@ class AuthConnector extends BaseConnector<AuthLoginParams> {
 
   private wsEmbedInstance: WsEmbed | null = null;
 
-  private getCurrentChain: AuthConnectorOptions["getCurrentChain"];
-
-  private getChain: AuthConnectorOptions["getChain"];
-
   constructor(params: AuthConnectorOptions) {
     super(params);
 
     // set auth options
-    const defaultOptions = getAuthDefaultOptions({
-      getCurrentChain: params.getCurrentChain,
-      getChain: params.getChain,
-    });
+    const defaultOptions = getAuthDefaultOptions();
     log.info("setting connector settings", params.connectorSettings);
     this.authOptions = deepmerge.all([
       defaultOptions.connectorSettings,
@@ -77,8 +70,6 @@ class AuthConnector extends BaseConnector<AuthLoginParams> {
 
     this.loginSettings = params.loginSettings || { loginProvider: "" };
     this.wsSettings = params.walletServicesSettings || {};
-    this.getCurrentChain = params.getCurrentChain;
-    this.getChain = params.getChain;
   }
 
   get provider(): IProvider | null {
@@ -140,14 +131,17 @@ class AuthConnector extends BaseConnector<AuthLoginParams> {
       case CHAIN_NAMESPACES.XRPL: {
         const { XrplPrivateKeyProvider } = await import("@/core/xrpl-provider");
         this.privateKeyProvider = new XrplPrivateKeyProvider({
-          config: { getCurrentChain: this.getCurrentChain, getChain: this.getChain },
+          config: { chain: chainConfig, chains: this.coreOptions.chains },
         });
         break;
       }
       default: {
         const { CommonPrivateKeyProvider } = await import("@/core/base-provider");
         this.privateKeyProvider = new CommonPrivateKeyProvider({
-          config: {},
+          config: {
+            chain: chainConfig,
+            chains: this.coreOptions.chains,
+          },
         });
       }
     }
@@ -273,6 +267,10 @@ class AuthConnector extends BaseConnector<AuthLoginParams> {
     }
   }
 
+  private getChain(chainId: string) {
+    return this.coreOptions.chains.find((x) => x.chainId === chainId);
+  }
+
   private _getFinalPrivKey() {
     if (!this.authInstance) return "";
     let finalPrivKey = this.authInstance.privKey;
@@ -353,7 +351,7 @@ class AuthConnector extends BaseConnector<AuthLoginParams> {
 }
 
 export const authConnector = (params?: { uxMode?: UX_MODE_TYPE }): ConnectorFn => {
-  return ({ projectConfig, coreOptions, getCurrentChain, getChain }: ConnectorParams) => {
+  return ({ projectConfig, coreOptions }: ConnectorParams) => {
     const connectorSettings: AuthConnectorOptions["connectorSettings"] = {
       network: coreOptions.web3AuthNetwork || WEB3AUTH_NETWORK.SAPPHIRE_MAINNET,
       clientId: coreOptions.clientId,
@@ -395,8 +393,6 @@ export const authConnector = (params?: { uxMode?: UX_MODE_TYPE }): ConnectorFn =
       connectorSettings,
       walletServicesSettings: finalWsSettings,
       coreOptions,
-      getCurrentChain,
-      getChain,
     };
     return new AuthConnector(connectorOptions);
   };

packages/no-modal/src/connectors/auth-connector/config.ts

@@ -1,16 +1,8 @@
 import { UX_MODE, WEB3AUTH_NETWORK } from "@web3auth/auth";
 
-import { IWeb3Auth } from "@/core/base";
-
 import { AuthConnectorOptions } from "./interface";
 
-export const getAuthDefaultOptions = ({
-  getCurrentChain,
-  getChain,
-}: {
-  getCurrentChain: IWeb3Auth["getCurrentChain"];
-  getChain: IWeb3Auth["getChain"];
-}): AuthConnectorOptions => {
+export const getAuthDefaultOptions = (): AuthConnectorOptions => {
   return {
     connectorSettings: {
       network: WEB3AUTH_NETWORK.SAPPHIRE_MAINNET,
@@ -22,7 +14,5 @@ export const getAuthDefaultOptions = ({
       chains: [],
       clientId: "",
     },
-    getCurrentChain,
-    getChain,
   };
 };

packages/no-modal/src/connectors/coinbase-connector/coinbaseConnector.ts

@@ -167,12 +167,10 @@ class CoinbaseConnector extends BaseEvmConnector<void> {
 }
 
 export const coinbaseConnector = (params?: CoinbaseWalletSDKOptions): ConnectorFn => {
-  return ({ coreOptions, getCurrentChain, getChain }: ConnectorParams) => {
+  return ({ coreOptions }: ConnectorParams) => {
     return new CoinbaseConnector({
       connectorSettings: params,
       coreOptions,
-      getCurrentChain,
-      getChain,
     });
   };
 };

packages/no-modal/src/connectors/default-evm-connector/injectedEvmConnector.ts

@@ -173,13 +173,11 @@ class InjectedEvmConnector extends BaseEvmConnector<void> {
 }
 
 export const injectedEvmConnector = (providerDetail: EIP6963ProviderDetail): ConnectorFn => {
-  return ({ coreOptions, getCurrentChain, getChain }: ConnectorParams) => {
+  return ({ coreOptions }: ConnectorParams) => {
     return new InjectedEvmConnector({
       name: normalizeWalletName(providerDetail.info.name),
       provider: providerDetail.provider as IProvider,
       coreOptions,
-      getCurrentChain,
-      getChain,
     });
   };
 };

packages/no-modal/src/connectors/default-solana-connector/walletStandardConnector.ts

@@ -46,15 +46,9 @@ export class WalletStandardConnector extends BaseSolanaConnector<void> {
 
   private injectedProvider: WalletStandardProvider | null = null;
 
-  private getCurrentChain: BaseConnectorSettings["getCurrentChain"];
-
-  private getChain: BaseConnectorSettings["getChain"];
-
   constructor(options: BaseConnectorSettings & { name: string; wallet: Wallet }) {
     super(options);
     this.name = options.name;
-    this.getCurrentChain = options.getCurrentChain;
-    this.getChain = options.getChain;
     // in VueJS, for some wallets e.g. Gate, Solflare, when connecting it throws error "attempted to get private field on non-instance"
     // it seems that Vue create a Proxy object for the wallet object which causes the issue
     // ref: https://stackoverflow.com/questions/64917686/vue-array-converted-to-proxy-object
@@ -77,7 +71,7 @@ export class WalletStandardConnector extends BaseSolanaConnector<void> {
     const chainConfig = this.coreOptions.chains.find((x) => x.chainId === options.chainId);
     super.checkInitializationRequirements({ chainConfig });
 
-    this.injectedProvider = new WalletStandardProvider({ config: { getCurrentChain: this.getCurrentChain, getChain: this.getChain } });
+    this.injectedProvider = new WalletStandardProvider({ config: { chain: chainConfig, chains: this.coreOptions.chains } });
     const providerHandler = new WalletStandardProviderHandler({
       wallet: this.wallet,
       getCurrentChain: () => getSolanaChainByChainConfig(chainConfig),
@@ -165,13 +159,11 @@ export class WalletStandardConnector extends BaseSolanaConnector<void> {
 }
 
 export const walletStandardConnector = (wallet: Wallet): ConnectorFn => {
-  return ({ coreOptions, getCurrentChain, getChain }: ConnectorParams) => {
+  return ({ coreOptions }: ConnectorParams) => {
     return new WalletStandardConnector({
       name: normalizeWalletName(wallet.name),
       wallet,
       coreOptions,
-      getCurrentChain,
-      getChain,
     });
   };
 };

packages/no-modal/src/connectors/wallet-connect-v2-connector/WalletConnectV2Provider.ts

@@ -2,7 +2,7 @@ import type { ISignClient, SignClientTypes } from "@walletconnect/types";
 import { getAccountsFromNamespaces, parseAccountId } from "@walletconnect/utils";
 import { JRPCEngine, JRPCMiddleware, providerErrors, providerFromEngine } from "@web3auth/auth";
 
-import { CHAIN_NAMESPACES, log, WalletLoginError } from "@/core/base";
+import { CHAIN_NAMESPACES, CustomChainConfig, log, WalletLoginError } from "@/core/base";
 import { BaseProvider, BaseProviderConfig, BaseProviderState } from "@/core/base-provider";
 import { createEthChainSwitchMiddleware, createEthJsonRpcClient, createEthMiddleware, IEthChainSwitchHandlers } from "@/core/ethereum-provider";
 import { createSolanaJsonRpcClient as createSolJsonRpcClient, createSolanaMiddleware } from "@/core/solana-provider";
@@ -20,20 +20,20 @@ export class WalletConnectV2Provider extends BaseProvider<BaseProviderConfig, Wa
 
   constructor({ config, state, connector }: { config: WalletConnectV2ProviderConfig; state?: BaseProviderState; connector?: ISignClient }) {
     super({
-      config: { getCurrentChain: config.getCurrentChain, getChain: config.getChain, skipLookupNetwork: !!config.skipLookupNetwork },
-      state: { ...(state || {}), accounts: [] },
+      config: { chain: config.chain, chains: config.chains, skipLookupNetwork: !!config.skipLookupNetwork },
+      state: { ...(state || {}), chainId: "loading", accounts: [] },
     });
     this.connector = connector || null;
   }
 
   public static getProviderInstance = async (params: {
     connector: ISignClient;
     skipLookupNetwork: boolean;
-    getCurrentChain: BaseProviderConfig["getCurrentChain"];
-    getChain: BaseProviderConfig["getChain"];
+    chain: CustomChainConfig;
+    chains: CustomChainConfig[];
   }): Promise<WalletConnectV2Provider> => {
     const providerFactory = new WalletConnectV2Provider({
-      config: { getCurrentChain: params.getCurrentChain, getChain: params.getChain, skipLookupNetwork: params.skipLookupNetwork },
+      config: { chain: params.chain, chains: params.chains, skipLookupNetwork: params.skipLookupNetwork },
     });
     await providerFactory.setupProvider(params.connector);
     return providerFactory;
@@ -48,13 +48,13 @@ export class WalletConnectV2Provider extends BaseProvider<BaseProviderConfig, Wa
 
   public async setupProvider(connector: ISignClient): Promise<void> {
     this.onConnectorStateUpdate(connector);
-    await this.setupEngine(connector, this.config.getCurrentChain().chainId);
+    await this.setupEngine(connector, this.config.chain.chainId);
   }
 
   public async switchChain({ chainId }: { chainId: string }): Promise<void> {
     if (!this.connector)
       throw providerErrors.custom({ message: "Connector is not initialized, pass wallet connect connector in constructor", code: 4902 });
-    const currentChainConfig = this.config.getChain(chainId);
+    const currentChainConfig = this.getChain(chainId);
 
     const { chainId: currentChainId } = currentChainConfig;
     const currentNumChainId = parseInt(currentChainId, 16);
@@ -63,6 +63,8 @@ export class WalletConnectV2Provider extends BaseProvider<BaseProviderConfig, Wa
 
     await this.setupEngine(this.connector, chainId);
     this.lookupNetwork(this.connector, chainId);
+
+    this.update({ chainId });
   }
 
   // no need to implement this method in wallet connect v2.
@@ -71,7 +73,7 @@ export class WalletConnectV2Provider extends BaseProvider<BaseProviderConfig, Wa
   }
 
   private async setupEngine(connector: ISignClient, chainId: string): Promise<void> {
-    const chain = this.config.getChain(chainId);
+    const chain = this.getChain(chainId);
     if (chain.chainNamespace === CHAIN_NAMESPACES.EIP155) {
       await this.setupEthEngine(connector, chainId);
     } else if (chain.chainNamespace === CHAIN_NAMESPACES.SOLANA) {
@@ -85,7 +87,7 @@ export class WalletConnectV2Provider extends BaseProvider<BaseProviderConfig, Wa
   }
 
   private async setupEthEngine(connector: ISignClient, chainId: string): Promise<void> {
-    const chain = this.config.getChain(chainId);
+    const chain = this.getChain(chainId);
     const numChainId = parseInt(chainId, 16);
     const providerHandlers = getEthProviderHandlers({ connector, chainId: numChainId });
     const jrpcRes = await getAccounts(connector);
@@ -105,7 +107,7 @@ export class WalletConnectV2Provider extends BaseProvider<BaseProviderConfig, Wa
   }
 
   private async setupSolEngine(connector: ISignClient, chainId: string): Promise<void> {
-    const chain = this.config.getChain(chainId);
+    const chain = this.getChain(chainId);
     const providerHandlers = getSolProviderHandlers({ connector, chainId });
     const jrpcRes = await getAccounts(connector);
 
@@ -177,7 +179,7 @@ export class WalletConnectV2Provider extends BaseProvider<BaseProviderConfig, Wa
         const connectedHexChainId = `0x${connectedChainId.toString(16)}`;
 
         // Check if chainId changed and trigger event
-        const currentChain = this.config.getCurrentChain();
+        const { currentChain } = this;
         if (connectedHexChainId && currentChain.chainId !== connectedHexChainId) {
           // Handle rpcUrl update
           await this.setupEngine(connector, connectedHexChainId);