@sodax/wallet-sdk-react 1.5.6-beta → 2.0.0-rc.1

package/src/core/XService.ts

@@ -1,85 +0,0 @@
-import type { ChainType, XToken } from '@sodax/types';
-import type { XConnector } from './XConnector';
-
-/**
- * Abstract base class for blockchain service implementations.
- *
- * The XService class serves as a foundation for implementing blockchain-specific services
- * in a multi-chain environment. It provides a standardized interface for:
- * 1. Managing wallet connectors for different blockchain types
- * 2. Querying token balances across different chains
- *
- * Each blockchain implementation (e.g., Solana, EVM chains) extends this class
- * to provide chain-specific functionality while maintaining a consistent interface.
- *
- * @abstract
- * @class XService
- * @property {ChainType} xChainType - The blockchain type this service handles (e.g., 'SOLANA', 'EVM')
- * @property {XConnector[]} xConnectors - Available wallet connectors for this chain
- *
- */
-export abstract class XService {
-  /** The blockchain type this service handles */
-  public readonly xChainType: ChainType;
-
-  /** Available wallet connectors for this chain */
-  private xConnectors: XConnector[] = [];
-
-  constructor(xChainType: ChainType) {
-    this.xChainType = xChainType;
-  }
-
-  /**
-   * Gets the balance of a specific token for an address
-   * @param address The wallet address to check
-   * @param xToken The token to get the balance for
-   * @returns Promise resolving to the token balance as a bigint
-   */
-  public async getBalance(address: string | undefined, xToken: XToken): Promise<bigint> {
-    return 0n;
-  }
-
-  /**
-   * Gets balances for multiple tokens for an address
-   * @param address The wallet address to check
-   * @param xTokens Array of tokens to get balances for
-   * @returns Promise resolving to object mapping token addresses to balances
-   */
-  public async getBalances(address: string | undefined, xTokens: readonly XToken[]): Promise<Record<string, bigint>> {
-    if (!address) return {};
-
-    const balancePromises = xTokens.map(async xToken => {
-      const balance = await this.getBalance(address, xToken);
-      return { address: xToken.address, balance };
-    });
-
-    const balances = await Promise.all(balancePromises);
-    return balances.reduce<Record<string, bigint>>((acc, { address, balance }) => {
-      acc[address] = balance;
-      return acc;
-    }, {});
-  }
-
-  /**
-   * Gets all available connectors for this chain
-   */
-  public getXConnectors(): XConnector[] {
-    return this.xConnectors;
-  }
-
-  /**
-   * Sets the available connectors for this chain
-   */
-  public setXConnectors(xConnectors: XConnector[]): void {
-    this.xConnectors = xConnectors;
-  }
-
-  /**
-   * Gets a specific connector by its ID
-   * @param xConnectorId The connector ID to look up
-   * @returns The matching connector or undefined if not found
-   */
-  public getXConnectorById(xConnectorId: string): XConnector | undefined {
-    return this.getXConnectors().find(xConnector => xConnector.id === xConnectorId);
-  }
-}

package/src/core/index.ts

@@ -1,2 +0,0 @@
-export { XService } from './XService';
-export { XConnector } from './XConnector';

package/src/hooks/index.ts

@@ -1,11 +0,0 @@
-export { useXAccount } from './useXAccount';
-export { useXAccounts } from './useXAccounts';
-export { useXConnect } from './useXConnect';
-export { useXConnection } from './useXConnection';
-export { useXConnectors } from './useXConnectors';
-export { useXDisconnect } from './useXDisconnect';
-export { useXService } from './useXService';
-export { useXBalances } from './useXBalances';
-export { useEvmSwitchChain } from './useEvmSwitchChain';
-export { useWalletProvider } from './useWalletProvider';
-export { useXSignMessage } from './useXSignMessage';

package/src/hooks/useEthereumChainId.ts

@@ -1,44 +0,0 @@
-import type { InjectiveXService } from '@/xchains/injective';
-import { Wallet } from '@injectivelabs/wallet-base';
-import React from 'react';
-import { useEffect } from 'react';
-import { useXService } from './useXService';
-import type { EvmWalletStrategy } from '@injectivelabs/wallet-evm';
-
-/**
- * React hook that returns the current Ethereum chain ID when using MetaMask wallet for Injective.
- * Listens for chain changes and updates the state accordingly.
- *
- * @remarks
- * This hook only works with MetaMask wallet and requires the window.ethereum provider to be available.
- * For other wallets or when MetaMask is not available, it returns null.
- *
- * @returns The current Ethereum chain ID as a number, or null if not available/connected
- */
-export default function useEthereumChainId(): number | null {
-  const injectiveXService = useXService('INJECTIVE') as unknown as InjectiveXService;
-  const [ethereumChainId, setEthereumChainId] = React.useState<number | null>(null);
-  useEffect(() => {
-    if (!injectiveXService?.walletStrategy?.getWallet()) return;
-    const walletStrategy = injectiveXService.walletStrategy;
-    if (walletStrategy.getWallet() !== Wallet.Metamask) return;
-
-    const getEthereumChainId = async () => {
-      try {
-        const chainId = await walletStrategy.getEthereumChainId();
-        setEthereumChainId(Number.parseInt(chainId));
-      } catch (e) {
-        console.warn('Failed to get Ethereum chain ID:', e);
-      }
-    };
-    getEthereumChainId();
-
-    try {
-      (walletStrategy.getStrategy() as EvmWalletStrategy).onChainIdChanged(getEthereumChainId);
-    } catch (e) {
-      console.warn('Failed to subscribe to chain ID changes:', e);
-    }
-  }, [injectiveXService?.walletStrategy]);
-
-  return ethereumChainId;
-}

package/src/hooks/useEvmSwitchChain.ts

@@ -1,91 +0,0 @@
-import { useCallback, useMemo } from 'react';
-import { useAccount, useSwitchChain } from 'wagmi';
-import { baseChainInfo, type ChainId } from '@sodax/types';
-import { getXChainType } from '@/actions';
-import type { InjectiveXService } from '@/xchains/injective';
-import { useXService } from '@/hooks/useXService';
-import useEthereumChainId from './useEthereumChainId';
-import { mainnet } from 'viem/chains';
-import { Wallet } from '@injectivelabs/wallet-base';
-
-interface UseEvmSwitchChainReturn {
-  isWrongChain: boolean;
-  handleSwitchChain: () => void;
-}
-
-/**
- * Hook to handle EVM chain switching functionality
- *
- * @param expectedXChainId - The target chain ID to switch to (e.g. '0xa.optimism', '0x89.polygon')
- * @returns {Object} Object containing:
- *   - isWrongChain: boolean indicating if current chain differs from expected chain
- *   - handleSwitchChain: function to trigger chain switch to expected chain
- *
- * @example
- * ```tsx
- * function ChainSwitchButton({ targetChain }: { targetChain: ChainId }) {
- *   const { isWrongChain, handleSwitchChain } = useEvmSwitchChain(targetChain);
- *
- *   return (
- *     <Button onClick={handleSwitchChain} disabled={!isWrongChain}>
- *       Switch Network
- *     </Button>
- *   );
- * }
- * ```
- */
-
-export const switchEthereumChain = async () => {
-  const metamaskProvider = (window as any).ethereum as any;
-
-  return await Promise.race([
-    metamaskProvider.request({
-      method: 'wallet_switchEthereumChain',
-      params: [{ chainId: '0x1' }],
-    }),
-    new Promise<void>(resolve =>
-      metamaskProvider.on('change', ({ chain }: { chain: { id: number } }) => {
-        if (chain?.id === 1) {
-          resolve();
-        }
-      }),
-    ),
-  ]);
-};
-
-export const useEvmSwitchChain = (expectedXChainId: ChainId): UseEvmSwitchChainReturn => {
-  const xChainType = getXChainType(expectedXChainId);
-  const expectedChainId = baseChainInfo[expectedXChainId].chainId as number;
-
-  const injectiveXService = useXService('INJECTIVE') as unknown as InjectiveXService;
-  const ethereumChainId = useEthereumChainId();
-
-  const { chainId } = useAccount();
-  const isWrongChain = useMemo(() => {
-    return (
-      (xChainType === 'EVM' && chainId !== expectedChainId) ||
-      (xChainType === 'INJECTIVE' &&
-        injectiveXService &&
-        injectiveXService.walletStrategy.getWallet() === Wallet.Metamask &&
-        ethereumChainId !== mainnet.id)
-    );
-  }, [xChainType, chainId, expectedChainId, ethereumChainId, injectiveXService]);
-
-  const { switchChain } = useSwitchChain();
-
-  const handleSwitchChain = useCallback(() => {
-    if (xChainType === 'INJECTIVE') {
-      switchEthereumChain();
-    } else {
-      switchChain({ chainId: expectedChainId });
-    }
-  }, [switchChain, expectedChainId, xChainType]);
-
-  return useMemo(
-    () => ({
-      isWrongChain,
-      handleSwitchChain,
-    }),
-    [isWrongChain, handleSwitchChain],
-  );
-};

package/src/hooks/useWalletProvider.ts

@@ -1,206 +0,0 @@
-import type {
-  ChainId,
-  IEvmWalletProvider,
-  IIconWalletProvider,
-  IInjectiveWalletProvider,
-  INearWalletProvider,
-  ISolanaWalletProvider,
-  IStacksWalletProvider,
-  IStellarWalletProvider,
-  ISuiWalletProvider,
-  IBitcoinWalletProvider,
-} from '@sodax/types';
-import { useMemo } from 'react';
-import { BitcoinXService } from '../xchains/bitcoin/BitcoinXService';
-import type { BitcoinXConnector } from '../xchains/bitcoin/BitcoinXConnector';
-import {
-  EvmWalletProvider,
-  IconWalletProvider,
-  SuiWalletProvider,
-  InjectiveWalletProvider,
-  StellarWalletProvider,
-  SolanaWalletProvider,
-  NearWalletProvider,
-  StacksWalletProvider,
-} from '@sodax/wallet-sdk-core';
-import { getXChainType } from '../actions';
-import { usePublicClient, useWalletClient } from 'wagmi';
-import { type SolanaXService, type StellarXService, useXAccount, useXService } from '..';
-import type { SuiXService } from '../xchains/sui/SuiXService';
-import { CHAIN_INFO, SupportedChainId } from '../xchains/icon/IconXService';
-import type { InjectiveXService } from '../xchains/injective/InjectiveXService';
-import type { NearXService } from '../xchains/near/NearXService';
-import { useXConnection } from './useXConnection';
-import { useXConnectors } from './useXConnectors';
-import type { StacksXConnector } from '../xchains/stacks';
-
-/**
- * Hook to get the appropriate wallet provider based on the chain type.
- * Supports EVM, SUI, ICON, INJECTIVE, STELLAR, SOLANA and NEAR chains.
- *
- * @param {ChainId | undefined} spokeChainId - The chain ID to get the wallet provider for. Can be any valid ChainId value.
- * @returns {EvmWalletProvider | SuiWalletProvider | IconWalletProvider | InjectiveWalletProvider | undefined}
- * The appropriate wallet provider instance for the given chain ID, or undefined if:
- * - No chain ID is provided
- * - Chain type is not supported
- * - Required wallet provider options are not available
- *
- * @example
- * ```tsx
- * // Get wallet provider for a specific chain
- * const walletProvider = useWalletProvider('sui');
- * ```
- */
-export function useWalletProvider(
-  spokeChainId: ChainId | undefined,
-):
-  | IEvmWalletProvider
-  | ISuiWalletProvider
-  | IIconWalletProvider
-  | IInjectiveWalletProvider
-  | IStellarWalletProvider
-  | ISolanaWalletProvider
-  | IBitcoinWalletProvider
-  | INearWalletProvider
-  | IStacksWalletProvider
-  | undefined {
-  const xChainType = getXChainType(spokeChainId);
-  // EVM-specific hooks
-  const evmPublicClient = usePublicClient();
-
-  const { data: evmWalletClient } = useWalletClient();
-
-  // Cross-chain hooks
-  const xService = useXService(getXChainType(spokeChainId));
-  const xAccount = useXAccount(spokeChainId);
-  const stacksConnection = useXConnection('STACKS');
-  const stacksConnectors = useXConnectors('STACKS');
-  const xConnection = useXConnection(xChainType);
-
-  return useMemo(() => {
-    switch (xChainType) {
-      case 'EVM': {
-        if (!evmWalletClient) {
-          return undefined;
-        }
-        if (!evmPublicClient) {
-          return undefined;
-        }
-
-        return new EvmWalletProvider({
-          walletClient: evmWalletClient,
-          publicClient: evmPublicClient,
-        });
-      }
-
-      case 'SUI': {
-        const suiXService = xService as SuiXService;
-        const { client, wallet, account } = {
-          client: suiXService.suiClient,
-          wallet: suiXService.suiWallet,
-          account: suiXService.suiAccount,
-        };
-
-        return new SuiWalletProvider({ client, wallet, account });
-      }
-
-      case 'ICON': {
-        const { walletAddress, rpcUrl } = {
-          walletAddress: xAccount.address,
-          rpcUrl: CHAIN_INFO[SupportedChainId.MAINNET].APIEndpoint,
-        };
-
-        return new IconWalletProvider({
-          walletAddress: walletAddress as `hx${string}` | undefined,
-          rpcUrl: rpcUrl as `http${string}`,
-        });
-      }
-
-      case 'INJECTIVE': {
-        const injectiveXService = xService as InjectiveXService;
-        if (!injectiveXService) {
-          return undefined;
-          // throw new Error('InjectiveXService is not initialized');
-        }
-
-        return new InjectiveWalletProvider({
-          msgBroadcaster: injectiveXService.msgBroadcaster,
-        });
-      }
-
-      case 'STELLAR': {
-        const stellarXService = xService as StellarXService;
-        if (!stellarXService.walletsKit) {
-          return undefined;
-        }
-
-        return new StellarWalletProvider({
-          type: 'BROWSER_EXTENSION',
-          walletsKit: stellarXService.walletsKit,
-          network: 'PUBLIC',
-        });
-      }
-
-      case 'SOLANA': {
-        const solanaXService = xService as SolanaXService;
-
-        if (!solanaXService.wallet) {
-          return undefined;
-        }
-
-        if (!solanaXService.connection) {
-          return undefined;
-        }
-
-        return new SolanaWalletProvider({
-          wallet: solanaXService.wallet,
-          endpoint: solanaXService.connection.rpcEndpoint,
-        });
-      }
-
-      case 'BITCOIN': {
-        if (!xConnection?.xConnectorId) return undefined;
-        const connector = BitcoinXService.getInstance().getXConnectorById(xConnection.xConnectorId) as
-          | BitcoinXConnector
-          | undefined;
-        if (!connector) return undefined;
-        // Recreate from window extension object — works after page reload without reconnect
-        return connector.recreateWalletProvider(xConnection.xAccount);
-      }
-
-      case 'NEAR': {
-        const nearXService = xService as NearXService;
-        if (!nearXService.walletSelector) {
-          return undefined;
-        }
-
-        return new NearWalletProvider({ wallet: nearXService.walletSelector });
-      }
-
-      case 'STACKS': {
-        const address = xAccount.address;
-        if (!address) {
-          return undefined;
-        }
-
-        const activeStacksConnector = stacksConnectors.find(c => c.id === stacksConnection?.xConnectorId) as
-          | StacksXConnector
-          | undefined;
-
-        return new StacksWalletProvider({ address, provider: activeStacksConnector?.getProvider() });
-      }
-
-      default:
-        return undefined;
-    }
-  }, [
-    xChainType,
-    evmPublicClient,
-    evmWalletClient,
-    xService,
-    xAccount,
-    stacksConnection,
-    stacksConnectors,
-    xConnection,
-  ]);
-}

package/src/hooks/useXAccount.ts

@@ -1,51 +0,0 @@
-import { useMemo } from 'react';
-
-import { ChainTypeArr, type ChainId, type ChainType } from '@sodax/types';
-
-import type { XAccount } from '../types';
-import { useXConnection } from './useXConnection';
-import { getXChainType } from '../actions';
-
-/**
- * Hook to get the current connected account for a specific blockchain
- *
- * @param chainIdentifier - The blockchain identifier (either chain type like 'EVM' or chain ID like '0xa86a.avax')
- * @returns {XAccount} The current connected account, or undefined if no account is connected
- *
- * @example
- * ```ts
- * // Using ChainType (preferred)
- * const { address } = useXAccount('EVM');
- *
- * // Using ChainId
- * const { address } = useXAccount('0xa86a.avax');
- *
- * // Returns: { address: string | undefined, xChainType: ChainType | undefined }
- * ```
- */
-function isChainType(chainIdentifier: ChainType | ChainId): chainIdentifier is ChainType {
-  return ChainTypeArr.includes(chainIdentifier as ChainType);
-}
-
-export function useXAccount(chainIdentifier?: ChainType | ChainId): XAccount {
-  const resolvedChainType: ChainType | undefined = chainIdentifier
-    ? isChainType(chainIdentifier)
-      ? chainIdentifier
-      : getXChainType(chainIdentifier as ChainId)
-    : undefined;
-
-  const xConnection = useXConnection(resolvedChainType);
-
-  const xAccount = useMemo((): XAccount => {
-    if (!resolvedChainType) {
-      return {
-        address: undefined,
-        xChainType: undefined,
-      };
-    }
-
-    return xConnection?.xAccount || { address: undefined, xChainType: resolvedChainType };
-  }, [resolvedChainType, xConnection]);
-
-  return xAccount;
-}

package/src/hooks/useXAccounts.ts

@@ -1,56 +0,0 @@
-import { useMemo } from 'react';
-
-import type { ChainType } from '@sodax/types';
-import { useCurrentAccount } from '@mysten/dapp-kit';
-import { useWallet } from '@solana/wallet-adapter-react';
-import { useAccount } from 'wagmi';
-
-import type { XAccount } from '../types';
-import { useXWagmiStore } from '../useXWagmiStore';
-
-export function useXAccounts() {
-  const xChainTypes = useXWagmiStore(state => Object.keys(state.xServices));
-  const xConnections = useXWagmiStore(state => state.xConnections);
-  const { address: evmAddress } = useAccount();
-  const suiAccount = useCurrentAccount();
-  const solanaWallet = useWallet();
-
-  const xAccounts = useMemo(() => {
-    const result: Partial<Record<ChainType, XAccount>> = {};
-    for (const xChainType of xChainTypes) {
-      const xConnection = xConnections[xChainType];
-
-      if (xConnection?.xAccount) {
-        result[xChainType] = xConnection.xAccount;
-      } else {
-        result[xChainType] = {
-          address: undefined,
-          xChainType,
-        };
-      }
-    }
-
-    if (evmAddress) {
-      result['EVM'] = {
-        address: evmAddress,
-        xChainType: 'EVM',
-      };
-    }
-    if (suiAccount) {
-      result['SUI'] = {
-        address: suiAccount.address,
-        xChainType: 'SUI',
-      };
-    }
-    if (solanaWallet.publicKey) {
-      result['SOLANA'] = {
-        address: solanaWallet.publicKey.toString(),
-        xChainType: 'SOLANA',
-      };
-    }
-
-    return result;
-  }, [xChainTypes, xConnections, evmAddress, suiAccount, solanaWallet]);
-
-  return xAccounts;
-}

package/src/hooks/useXBalances.ts

@@ -1,65 +0,0 @@
-import { getXChainType } from '@/actions';
-import { type UseQueryResult, useQuery } from '@tanstack/react-query';
-import type { ChainId, XToken } from '@sodax/types';
-import { useXService } from './useXService';
-
-/**
- * Hook to fetch token balances for multiple tokens on a specific chain
- *
- * @param params - Query parameters object
- * @param params.xChainId - Chain identifier (e.g. '0xa86a.avax', '0x1.base', '0x2.bsc', '0x89.polygon', '0x1.optimism')
- * @param params.xTokens - Array of token objects to fetch balances for.
- * @param params.address - Wallet address to fetch balances for. If undefined, returns empty object
- *
- * @returns UseQueryResult containing an object mapping token addresses to their balances as bigints.
- *          The balances are denominated in the token's smallest unit (e.g. wei for ETH).
- *          Returns empty object if wallet is not connected or service is unavailable.
- */
-/**
- * @example
- * ```tsx
- * // Example usage in a component
- * function TokenBalances({ tokens }: { tokens: XToken[] }) {
- *   const { address } = useXAccount('EVM');
- *   const { data: balances } = useXBalances({
- *     xChainId: '0xa86a.avax',
- *     xTokens: tokens,
- *     address,
- *   });
- *
- *   return (
- *     <div>
- *       {tokens.map(token => (
- *         <div key={token.address}>
- *           {token.symbol}: {formatUnits(balances?.[token.address] || 0n, token.decimals)}
- *         </div>
- *       ))}
- *     </div>
- *   );
- * }
- * ```
- */
-
-export function useXBalances({
-  xChainId,
-  xTokens,
-  address,
-}: { xChainId: ChainId; xTokens: readonly XToken[]; address: string | undefined }): UseQueryResult<{
-  [key: string]: bigint;
-}> {
-  const xService = useXService(getXChainType(xChainId));
-  return useQuery({
-    queryKey: ['xBalances', xChainId, xTokens.map(x => x.symbol), address],
-    queryFn: async () => {
-      if (!xService) {
-        return {};
-      }
-
-      const balances = await xService.getBalances(address, xTokens);
-
-      return balances;
-    },
-    enabled: !!xService && !!address && (xTokens?.length ?? 0) > 0,
-    refetchInterval: 5_000,
-  });
-}