@rango-dev/provider-walletconnect-2 0.0.0-experimental-936229e8-20251208

package/src/index.ts

@@ -0,0 +1,233 @@
+import type { Environments, WCInstance } from './types.js';
+import type {
+  CanSwitchNetwork,
+  Connect,
+  Disconnect,
+  GetInstance,
+  Subscribe,
+  SwitchNetwork,
+  WalletConfig,
+  WalletInfo,
+} from '@rango-dev/wallets-shared';
+import type { ISignClient } from '@walletconnect/types';
+import type { BlockchainMeta, SignerFactory } from 'rango-types';
+
+import { debug, error as logError } from '@rango-dev/logging-core';
+import { Networks, WalletTypes } from '@rango-dev/wallets-shared';
+import Client from '@walletconnect/sign-client';
+import { AccountId, ChainId } from 'caip';
+import { evmBlockchains } from 'rango-types';
+
+import {
+  DEFAULT_APP_METADATA,
+  DEFAULT_NETWORK,
+  EthereumEvents,
+  EthereumRPCMethods,
+  NAMESPACES,
+  RELAY_URL,
+} from './constants.js';
+import {
+  createModalInstance,
+  filterEvmAccounts,
+  simulateRequest,
+  switchOrAddEvmChain,
+} from './helpers.js';
+import {
+  cleanupSingleSession,
+  disconnectSessions,
+  getAccountsFromEvent,
+  getAccountsFromSession,
+  getPersistedChainId,
+  ignoreNamespaceMethods,
+  persistCurrentChainId,
+  tryConnect,
+  updateSessionAccounts,
+} from './session.js';
+import signer from './signer.js';
+
+const WALLET = WalletTypes.WALLET_CONNECT_2;
+
+let envs: Environments = {
+  WC_PROJECT_ID: '',
+  DISABLE_MODAL_AND_OPEN_LINK: undefined,
+};
+
+export type { Environments };
+
+export const init = (environments: Environments) => {
+  envs = environments;
+
+  createModalInstance(envs.WC_PROJECT_ID);
+};
+
+export const config: WalletConfig = {
+  type: WALLET,
+  checkInstallation: false,
+  isAsyncInstance: true,
+  defaultNetwork: DEFAULT_NETWORK,
+  isAsyncSwitchNetwork: true,
+};
+
+export const getInstance: GetInstance = async (options) => {
+  const { currentProvider, getState, meta } = options;
+
+  /*
+   * Create a new pair, if exists use the pair,
+   * Or use the already created one.
+   */
+  let provider: ISignClient;
+  if (!currentProvider) {
+    if (!envs.WC_PROJECT_ID) {
+      throw new Error(
+        'You need to set `WC_PROJECT_ID` in Wallet Connect provider.'
+      );
+    }
+    provider = await Client.init({
+      relayUrl: RELAY_URL,
+      projectId: envs.WC_PROJECT_ID,
+      metadata: DEFAULT_APP_METADATA,
+    });
+  } else {
+    provider = currentProvider;
+  }
+
+  return {
+    client: provider,
+    session: null,
+    request: async (params: any) =>
+      simulateRequest(params, provider, meta, getState),
+  };
+};
+
+export const connect: Connect = async ({ instance, meta }) => {
+  const { client } = instance as WCInstance;
+  // Try to restore the session first, if couldn't, create a new session by showing a modal.
+  const session = await tryConnect(client, { meta, envs });
+  // Override the value (session).
+  instance.session = session;
+  const currentChainId = await getPersistedChainId(client);
+  const accounts = getAccountsFromSession(session);
+  return filterEvmAccounts(accounts, currentChainId);
+};
+
+export const subscribe: Subscribe = ({
+  instance,
+  updateChainId,
+  updateAccounts,
+  disconnect,
+}) => {
+  const { client } = instance as WCInstance;
+
+  /**
+   * Session events refrence:
+   * https://docs.walletconnect.com/2.0/specs/clients/sign/session-events
+   */
+
+  // Listen to updating the session by adding a new chain, method, or event
+  client.on('session_update', (args) => {
+    const allAccounts = getAccountsFromEvent(args);
+    allAccounts.forEach((accountsWithChain) => {
+      updateAccounts(accountsWithChain.accounts, accountsWithChain.chainId);
+    });
+  });
+
+  // Listen to events triggred by wallet. (e.g. accountsChanged and chainChanged)
+  client.on('session_event', (args) => {
+    if (args.params.event.name === EthereumEvents.ACCOUNTS_CHANGED) {
+      const accounts = args.params.event.data.map((account: string) => {
+        return new AccountId(account).address;
+      });
+      const chainId = ChainId.parse(args.params.chainId).reference;
+      updateAccounts(accounts);
+      updateChainId(chainId);
+    } else if (args.params.event.name === EthereumEvents.CHAIN_CHANGED) {
+      const chainId = args.params.event.data;
+      updateChainId(chainId);
+      void persistCurrentChainId(instance.client, chainId);
+    } else {
+      console.log('[WC2] session_event not supported', args.params.event);
+    }
+  });
+
+  client.on('session_delete', async (event) => {
+    console.log('[WC2] your wallet has requested to delete session.', event);
+    void cleanupSingleSession(client, event.topic);
+    disconnect();
+  });
+};
+
+export const switchNetwork: SwitchNetwork = async ({
+  network,
+  instance,
+  meta,
+  getState,
+  updateChainId,
+}) => {
+  const evm = evmBlockchains(meta);
+  const chainId = evm.find((chain) => chain.name === network)?.chainId;
+  if (!chainId) {
+    const error = new Error(`There is no match for ${chainId}`);
+    logError(error);
+    throw error;
+  }
+  const chaindIdStr = new ChainId({
+    namespace: NAMESPACES.ETHEREUM,
+    reference: String(parseInt(chainId)),
+  }).toString();
+
+  const session = instance.session;
+  const evmNamespace = session.namespaces[NAMESPACES.ETHEREUM];
+  const authorizedChains = evmNamespace?.chains || [];
+  const authorizedMethods = evmNamespace?.methods || [];
+
+  if (
+    authorizedMethods.includes(EthereumRPCMethods.SWITCH_CHAIN) &&
+    !ignoreNamespaceMethods(instance)
+  ) {
+    const currentNetwork = getState?.().network || Networks.ETHEREUM;
+    await updateSessionAccounts(instance, network, currentNetwork, meta);
+    await switchOrAddEvmChain(meta, network, currentNetwork, instance);
+  } else if (authorizedChains.includes(chaindIdStr)) {
+    updateChainId(chainId);
+    return;
+  } else {
+    const error = new Error(`Chain ${chainId} is not configured.`);
+    logError(error);
+    throw error;
+  }
+};
+
+/**
+ *
+ * Note:
+ * There is no straight-forward way to detect the wallet supports which blockchain,
+ * So we send request to wallet and expect to be rejected on the wallet if it's not supported.
+ *
+ */
+export const canSwitchNetworkTo: CanSwitchNetwork = () => true;
+
+export const disconnect: Disconnect = async ({ instance }) => {
+  const { client } = instance as WCInstance;
+
+  if (client) {
+    void disconnectSessions(client).catch((error) => debug(error));
+  }
+};
+
+export const getSigners: (provider: WCInstance) => Promise<SignerFactory> =
+  signer;
+
+export const getWalletInfo: (allBlockChains: BlockchainMeta[]) => WalletInfo = (
+  allBlockChains
+) => {
+  const evms = evmBlockchains(allBlockChains);
+  return {
+    name: 'WalletConnect',
+    img: 'https://raw.githubusercontent.com/rango-exchange/assets/main/wallets/walletconnect/icon.svg',
+    installLink: '',
+    color: '#b2dbff',
+    supportedChains: evms,
+    showOnMobile: true,
+    mobileWallet: true,
+  };
+};

package/src/session.ts

@@ -0,0 +1,374 @@
+import type {
+  ConnectParams,
+  CreateSessionParams,
+  Environments,
+} from './types.js';
+import type { SignClient } from '@walletconnect/sign-client/dist/types/client';
+import type {
+  PairingTypes,
+  SessionTypes,
+  SignClientTypes,
+} from '@walletconnect/types';
+import type { BlockchainMeta } from 'rango-types';
+
+import { Networks, timeout } from '@rango-dev/wallets-shared';
+import { getSdkError } from '@walletconnect/utils';
+import { AccountId } from 'caip';
+
+import { CHAIN_ID_STORAGE, PING_TIMEOUT } from './constants.js';
+import {
+  generateOptionalNamespace,
+  getCurrentEvmAccountAddress,
+  getEvmAccount,
+  getModal,
+  solanaChainIdToNetworkName,
+} from './helpers.js';
+
+export function getLastSession(client: SignClient) {
+  return client.session.values[client.session.values.length - 1];
+}
+
+/**
+ *
+ * Try to ping the wallet, if wallet responded with `pong`, session is a valid and we will use the session.
+ * If the wallet didn't respond during 10 seconds (PING_TIME), we assume the wallet isn't available and we need to create a new session.
+ *
+ */
+export async function restoreSession(
+  client: SignClient,
+  pairingTopic: PairingTypes.Struct['topic']
+): Promise<SessionTypes.Struct | undefined> {
+  await timeout(
+    client.ping({
+      topic: pairingTopic,
+    }),
+    PING_TIMEOUT
+  );
+
+  // We assume last session is the correct session, beacuse we are doing clean up and keeps only one pairing/session.
+  const session = getLastSession(client);
+  return session;
+}
+
+/**
+ *
+ * Getting a  pair of required and optional namespaces then tries to show a modal and connect (pair)
+ * To the wallet.
+ * @param client
+ * @param options
+ * @returns
+ */
+export async function createSession(
+  client: SignClient,
+  options: CreateSessionParams,
+  configs: {
+    envs: Environments;
+  }
+): Promise<SessionTypes.Struct> {
+  const { requiredNamespaces, optionalNamespaces, pairingTopic } = options;
+
+  try {
+    const { uri, approval } = await client.connect({
+      requiredNamespaces,
+      optionalNamespaces,
+      pairingTopic,
+    });
+
+    // Open QRCode modal if a URI was returned (i.e. we're not connecting an existing pairing).
+    let onCloseModal;
+    if (uri) {
+      /*
+       * There are some wallets have been listed in WC itself (https://docs.walletconnect.com/cloud/explorer-submission),
+       * Using `DISABLE_MODAL_AND_OPEN_LINK` option, we can directly open a specific desktop wallet.
+       */
+      const redirectLink = configs.envs.DISABLE_MODAL_AND_OPEN_LINK;
+      if (redirectLink) {
+        const url = `${redirectLink}/wc?uri=${encodeURIComponent(uri)}`;
+        window.open(url, '_blank', 'noreferrer noopener');
+      } else {
+        // Create a flat array of all requested chains across namespaces.
+        const allNamespaces = {
+          ...(requiredNamespaces || {}),
+          ...(optionalNamespaces || {}),
+        };
+
+        const standaloneChains = Object.values(allNamespaces)
+          .map((namespace) => namespace.chains)
+          .flat() as string[];
+
+        const modal = getModal();
+        void modal.openModal({ uri, chains: standaloneChains });
+
+        onCloseModal = new Promise((_, reject) => {
+          modal.subscribeModal((state) => {
+            // the modal was closed so reject the promise
+            if (!state.open) {
+              reject(new Error('Modal has been closed.'));
+            }
+          });
+        });
+      }
+    }
+
+    const session = approval();
+
+    if (onCloseModal) {
+      const result = await Promise.race([session, onCloseModal]);
+      // We know onClose only reject a modal and never returns a value.
+      return result as SessionTypes.Struct;
+    }
+    return await session;
+  } finally {
+    getModal().closeModal();
+  }
+}
+
+/**
+ *
+ * A user (client) can have multiple pairings (to different wallets), we are assuming
+ * the last pairing is the active pairing for now. A better UX can be showing a list of pairings
+ * and let the user to choose the right pairing manually. Because we don't have that yet, we will pick up the last one.
+ *
+ */
+export function tryGetPairing(
+  client: SignClient
+): PairingTypes.Struct | undefined {
+  const pairings = client.pairing.getAll({ active: true });
+  const lastPairing =
+    pairings.length > 0 ? pairings[pairings.length - 1] : undefined;
+
+  return lastPairing;
+}
+
+/**
+ *
+ * Try to restore the session first, if couldn't, create a new session by showing a modal.
+ *
+ */
+export async function tryConnect(
+  client: SignClient,
+  params: ConnectParams
+): Promise<SessionTypes.Struct> {
+  const { meta } = params;
+
+  // We try to get all of our supported chains as optional.
+  const optionalNamespaces = generateOptionalNamespace(meta);
+
+  // Check if the user has a session, if yes, restore the session and use it.
+  let session: SessionTypes.Struct | undefined;
+  const pairing = tryGetPairing(client);
+  if (pairing) {
+    try {
+      session = await restoreSession(client, pairing.topic);
+    } catch (e) {
+      await disconnectSessions(client);
+    }
+  }
+
+  // In case of connecting for the first time or session couldn't be restored, we will create a new session.
+  if (!session) {
+    session = await createSession(
+      client,
+      {
+        requiredNamespaces: {},
+        optionalNamespaces,
+      },
+      {
+        envs: params.envs,
+      }
+    );
+  }
+
+  return session;
+}
+
+/**
+ *
+ * Try to find sessions with a topic id and expire them.
+ *
+ */
+export async function cleanupSingleSession(client: SignClient, topic: string) {
+  const sessions = client.session.getAll();
+  const pairings = client.pairing.getAll();
+
+  sessions.forEach((session) => {
+    if (session.topic === topic || session.pairingTopic === topic) {
+      const requestForDeleteTopic =
+        session.pairingTopic === topic ? session.pairingTopic : session.topic;
+      client.core.expirer.set(requestForDeleteTopic, 0);
+    }
+  });
+
+  pairings.forEach((pairing) => {
+    if (pairing.topic === topic) {
+      client.core.expirer.set(topic, 0);
+    }
+  });
+}
+
+/**
+ *
+ * Disconnect means to delete the session on both parties (dApp & wallet) at the same time.
+ *
+ */
+export async function disconnectSessions(client: SignClient) {
+  const allPromises = [];
+
+  const sessions = client.session.getAll();
+  for (const session of sessions) {
+    allPromises.push(
+      client.disconnect({
+        topic: session.topic,
+        reason: getSdkError('USER_DISCONNECTED'),
+      })
+    );
+  }
+
+  const pairings = client.pairing.getAll();
+  for (const pairing of pairings) {
+    allPromises.push(
+      client.disconnect({
+        topic: pairing.topic,
+        reason: getSdkError('USER_DISCONNECTED'),
+      })
+    );
+  }
+
+  // reset the current chain id
+  void persistCurrentChainId(client, undefined);
+
+  return await Promise.all(allPromises);
+}
+
+export function getAccountsFromSession(session: SessionTypes.Struct) {
+  const accounts = Object.values(session.namespaces)
+    .map((namespace) => namespace.accounts)
+    .flat()
+    .map((account) => {
+      const { address, chainId } = new AccountId(account);
+      /*
+       * Note: Solana has a specific ID, we need to convert it back to network name.
+       * It will return the chain id itslef if it's not that specific ID.
+       */
+      const chain = solanaChainIdToNetworkName(chainId.reference);
+      return {
+        address,
+        chainId: chain,
+      };
+    });
+  return accounts;
+}
+
+export function getAccountsFromEvent(
+  event: SignClientTypes.BaseEventArgs<{
+    namespaces: SessionTypes.Namespaces;
+  }>
+) {
+  const accounts = Object.values(event.params.namespaces)
+    .map((namespace) => namespace.accounts)
+    .flat()
+    .map((account) => {
+      const { address, chainId } = new AccountId(account);
+      return {
+        accounts: [address],
+        chainId:
+          chainId.namespace === 'solana' ? Networks.SOLANA : chainId.reference,
+      };
+    });
+
+  return accounts;
+}
+
+/*
+ * Before switch network, we need to update session namespace accounts
+ * to contain both current chain and target chain accoutns.
+ */
+export async function updateSessionAccounts(
+  instance: any,
+  requestedNetwork: string,
+  currentNetwork: string,
+  meta: BlockchainMeta[]
+) {
+  const session = instance.session;
+
+  const namespaces = session.namespaces;
+  let needUpdateNamepspace = false;
+  const accounts = namespaces.eip155.accounts;
+
+  const currentAccountAddress = getCurrentEvmAccountAddress(instance);
+  const requestedAccount = getEvmAccount(
+    requestedNetwork,
+    currentAccountAddress,
+    meta
+  );
+  if (!accounts.includes(requestedAccount)) {
+    accounts.push(requestedAccount);
+    needUpdateNamepspace = true;
+  }
+
+  const currentAccount = getEvmAccount(
+    currentNetwork,
+    currentAccountAddress,
+    meta
+  );
+  if (!accounts.includes(currentAccount)) {
+    accounts.push(currentAccount);
+    needUpdateNamepspace = true;
+  }
+
+  if (needUpdateNamepspace) {
+    const updatedNamespaces = {
+      ...namespaces,
+      eip155: {
+        ...namespaces.eip155,
+        accounts,
+      },
+    };
+    await instance.client.session
+      .update({
+        topic: session.topic,
+        namespaces: updatedNamespaces,
+      })
+      .catch((err: unknown) => {
+        console.log(err);
+      });
+  }
+}
+
+/*
+ * Certain wallets, such as Trust Wallet and 1inch, are providing incorrect methods in
+ * response to session proposal requests. These wallets do not support certain optional
+ * RPC methods like "wallet_xyz," but they include them in the response under the session namespace.
+ * For the time being, we should avoid their session namespace response.
+ * see also: https://github.com/trustwallet/wallet-core/issues/3588
+ */
+export function ignoreNamespaceMethods(instance: any): boolean {
+  const WALLETS_WITH_WRONG_NAMESPACE_METHODS = ['trust', '1inch'];
+  const peerName = instance?.session?.peer?.metadata?.name;
+  return WALLETS_WITH_WRONG_NAMESPACE_METHODS.some((name) =>
+    peerName?.toLowerCase()?.includes(name)
+  );
+}
+
+export async function persistCurrentChainId(
+  client: SignClient,
+  chainId?: string
+) {
+  return client.core.storage.setItem(CHAIN_ID_STORAGE, {
+    defaultChainId: chainId ? parseInt(chainId) : '',
+  });
+}
+
+/*
+ * get the latest chain id from the storage,
+ * used for setting current chain id in session reconnect.
+ */
+export async function getPersistedChainId(client: SignClient) {
+  try {
+    const chainId = (await client.core.storage.getItem(CHAIN_ID_STORAGE))
+      ?.defaultChainId;
+    return !!chainId ? String(chainId) : undefined;
+  } catch {
+    return undefined;
+  }
+}

package/src/signer.ts

@@ -0,0 +1,45 @@
+import type { WCInstance } from './types.js';
+import type { SignerFactory } from 'rango-types';
+
+import { dynamicImportWithRefinedError } from '@rango-dev/wallets-shared';
+import { DefaultSignerFactory, TransactionType as TxType } from 'rango-types';
+
+export default async function getSigners(
+  instance: WCInstance
+): Promise<SignerFactory> {
+  if (!instance.session) {
+    throw new Error('Session is required for wallet connect signers.');
+  }
+
+  const signers = new DefaultSignerFactory();
+  const EVMSigner = (
+    await dynamicImportWithRefinedError(
+      async () => await import('./signers/evm.js')
+    )
+  ).default;
+  const COSMOSSigner = (
+    await dynamicImportWithRefinedError(
+      async () => await import('./signers/cosmos.js')
+    )
+  ).default;
+  const SOLANASigner = (
+    await dynamicImportWithRefinedError(
+      async () => await import('./signers/solana.js')
+    )
+  ).default;
+
+  signers.registerSigner(
+    TxType.EVM,
+    new EVMSigner(instance.client, instance.session)
+  );
+  signers.registerSigner(
+    TxType.COSMOS,
+    new COSMOSSigner(instance.client, instance.session)
+  );
+  signers.registerSigner(
+    TxType.SOLANA,
+    new SOLANASigner(instance.client, instance.session)
+  );
+
+  return signers;
+}