@sodax/wallet-sdk-react 1.5.0-beta → 1.5.2-beta

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sodax/wallet-sdk-react",
   "license": "MIT",
-  "version": "1.5.0-beta",
+  "version": "1.5.2-beta",
   "description": "Wallet SDK of Sodax",
   "type": "module",
   "main": "./dist/index.cjs",
@@ -28,14 +28,14 @@
     "@stacks/transactions": "7.3.1",
     "@creit.tech/stellar-wallets-kit": "^1.7.5",
     "@hot-labs/near-connect": "0.10.0",
-    "@injectivelabs/networks": "1.16.10",
-    "@injectivelabs/sdk-ts": "1.16.10",
-    "@injectivelabs/ts-types": "1.16.10",
-    "@injectivelabs/wallet-base": "1.16.10",
-    "@injectivelabs/wallet-core": "1.16.10",
-    "@injectivelabs/wallet-cosmos": "1.16.10",
-    "@injectivelabs/wallet-evm": "1.16.10",
-    "@injectivelabs/wallet-strategy": "1.16.10",
+    "@injectivelabs/networks": "1.18.14",
+    "@injectivelabs/sdk-ts": "1.18.14",
+    "@injectivelabs/ts-types": "1.18.14",
+    "@injectivelabs/wallet-base": "1.18.14",
+    "@injectivelabs/wallet-core": "1.18.14",
+    "@injectivelabs/wallet-cosmos": "1.18.14",
+    "@injectivelabs/wallet-evm": "1.18.14",
+    "@injectivelabs/wallet-strategy": "1.18.14",
     "@mysten/dapp-kit": "0.14.18",
     "@mysten/sui": "1.21.2",
     "near-api-js": "7.2.0",
@@ -51,8 +51,8 @@
     "wagmi": "2.16.9",
     "zustand": "4.5.2",
     "bs58": "6.0.0",
-    "@sodax/wallet-sdk-core": "1.5.0-beta",
-    "@sodax/types": "1.5.0-beta"
+    "@sodax/types": "1.5.2-beta",
+    "@sodax/wallet-sdk-core": "1.5.2-beta"
   },
   "devDependencies": {
     "@types/react": "^19.0.8",

package/src/SodaxWalletProvider.tsx

@@ -22,8 +22,10 @@ import type { RpcConfig } from '@sodax/types';
 import { Hydrate } from './Hydrate';
 import { createWagmiConfig } from './xchains/evm/EvmXService';
 import { reconnectIcon } from './xchains/icon/actions';
+import { reconnectInjective } from './xchains/injective/actions';
 import { reconnectStellar } from './xchains/stellar/actions';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import type { State as WagmiState } from 'wagmi';
 
 const queryClient = new QueryClient();
 
@@ -59,9 +61,10 @@ export type SodaxWalletProviderProps = {
   children: React.ReactNode;
   rpcConfig: RpcConfig;
   options?: SodaxWalletProviderOptions;
+  initialState?: WagmiState;
 };
 
-export const SodaxWalletProvider = ({ children, rpcConfig, options }: SodaxWalletProviderProps) => {
+export const SodaxWalletProvider = ({ children, rpcConfig, options, initialState }: SodaxWalletProviderProps) => {
   const wagmi = useMemo(() => ({ ...defaultOptions.wagmi, ...options?.wagmi }), [options?.wagmi]);
   const wagmiConfig = useMemo(() => {
     return createWagmiConfig(rpcConfig, wagmi);
@@ -73,7 +76,7 @@ export const SodaxWalletProvider = ({ children, rpcConfig, options }: SodaxWalle
 
   return (
     <QueryClientProvider client={queryClient}>
-      <WagmiProvider reconnectOnMount={wagmi.reconnectOnMount} config={wagmiConfig}>
+      <WagmiProvider reconnectOnMount={wagmi.reconnectOnMount} config={wagmiConfig} initialState={initialState}>
         <SuiClientProvider networks={{ mainnet: { url: getFullnodeUrl('mainnet') } }} defaultNetwork="mainnet">
           <SuiWalletProvider autoConnect={sui.autoConnect}>
             <SolanaConnectionProvider endpoint={rpcConfig['solana'] ?? 'https://api.mainnet-beta.solana.com'}>
@@ -90,5 +93,5 @@ export const SodaxWalletProvider = ({ children, rpcConfig, options }: SodaxWalle
 };
 
 reconnectIcon();
-// reconnectInjective();
+reconnectInjective();
 reconnectStellar();

package/src/hooks/useEthereumChainId.ts

@@ -24,12 +24,20 @@ export default function useEthereumChainId(): number | null {
     if (walletStrategy.getWallet() !== Wallet.Metamask) return;
 
     const getEthereumChainId = async () => {
-      const chainId = await walletStrategy.getEthereumChainId();
-      setEthereumChainId(Number.parseInt(chainId));
+      try {
+        const chainId = await walletStrategy.getEthereumChainId();
+        setEthereumChainId(Number.parseInt(chainId));
+      } catch (e) {
+        console.warn('Failed to get Ethereum chain ID:', e);
+      }
     };
     getEthereumChainId();
 
-    (walletStrategy.getStrategy() as EvmWalletStrategy).onChainIdChanged(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/useXWagmiStore.ts

@@ -7,7 +7,8 @@ import { immer } from 'zustand/middleware/immer';
 import type { XService } from './core';
 import type { XConnection } from './types';
 import { EvmXService } from './xchains/evm';
-import { InjectiveKelprXConnector, InjectiveMetamaskXConnector, InjectiveXService } from './xchains/injective';
+import { InjectiveXConnector, InjectiveXService } from './xchains/injective';
+import { Wallet } from '@injectivelabs/wallet-base';
 import { SolanaXService } from './xchains/solana/SolanaXService';
 import { StellarXService } from './xchains/stellar';
 import { SuiXService } from './xchains/sui';
@@ -49,17 +50,19 @@ const initXServices = () => {
         break;
       case 'BITCOIN':
         xServices[xChainType] = BitcoinXService.getInstance();
-        xServices[xChainType].setXConnectors([
-          new UnisatXConnector(),
-          new XverseXConnector(),
-          new OKXXConnector(),
-        ]);
+        xServices[xChainType].setXConnectors([new UnisatXConnector(), new XverseXConnector(), new OKXXConnector()]);
         break;
 
       // Injective, Stellar, Icon wallet connectors are supported by sodax wallet-sdk-react sdk.
       case 'INJECTIVE':
         xServices[xChainType] = InjectiveXService.getInstance();
-        xServices[xChainType].setXConnectors([new InjectiveMetamaskXConnector(), new InjectiveKelprXConnector()]);
+        xServices[xChainType].setXConnectors([
+          // EVM wallets (auto-detected via EIP-6963)
+          new InjectiveXConnector('MetaMask', Wallet.Metamask),
+          // Cosmos wallets (detected via window globals)
+          new InjectiveXConnector('Keplr', Wallet.Keplr),
+          new InjectiveXConnector('Leap', Wallet.Leap),
+        ]);
         break;
       case 'STELLAR':
         xServices[xChainType] = StellarXService.getInstance();

package/src/xchains/evm/EvmXService.ts

@@ -19,7 +19,7 @@ import { getWagmiChainId, isNativeToken } from '@/utils';
 
 import { type Address, type Chain, defineChain, erc20Abi } from 'viem';
 import { getPublicClient } from 'wagmi/actions';
-import { type Config, createConfig, http } from 'wagmi';
+import { type Config, createConfig, http, createStorage, cookieStorage } from 'wagmi';
 import {
   mainnet,
   avalanche,
@@ -92,6 +92,10 @@ export const createWagmiConfig = (config: RpcConfig, options?: WagmiOptions) =>
       [redbellyMainnet.id]: http(config[REDBELLY_MAINNET_CHAIN_ID]),
       [kaia.id]: http(config[KAIA_MAINNET_CHAIN_ID]),
     },
+    storage: createStorage({
+      storage: cookieStorage,
+      key: 'sodax',
+    }),
   });
 };
 

package/src/xchains/evm/index.ts

@@ -1,2 +1,3 @@
 export { EvmXService } from './EvmXService';
 export { EvmXConnector } from './EvmXConnector';
+export { createWagmiConfig, createWagmiConfig as createWagmi } from './EvmXService';

package/src/xchains/injective/InjectiveXConnector.ts

@@ -0,0 +1,60 @@
+import type { XAccount } from '@/types';
+import { XConnector } from '@/core';
+import { getInjectiveAddress } from '@injectivelabs/sdk-ts';
+import { type Wallet, isEvmBrowserWallet, isCosmosBrowserWallet } from '@injectivelabs/wallet-base';
+import { isCosmosWalletInstalled } from '@injectivelabs/wallet-cosmos';
+import { InjectiveXService } from './InjectiveXService';
+
+const WALLET_ICONS: Partial<Record<Wallet, string>> = {
+  metamask: 'https://raw.githubusercontent.com/balancednetwork/icons/master/wallets/metamask.svg',
+  keplr: 'https://raw.githubusercontent.com/balancednetwork/icons/master/wallets/keplr.svg',
+  leap: 'https://assets.leapwallet.io/logos/leap-cosmos-logo.svg',
+  rabby: 'https://raw.githubusercontent.com/RabbyHub/logo/master/symbol.svg',
+  phantom: 'https://raw.githubusercontent.com/balancednetwork/icons/master/wallets/phantom.svg',
+  'okx-wallet': 'https://static.okx.com/cdn/assets/imgs/247/58E63FEA47A2B7D7.png',
+  'trust-wallet': 'https://trustwallet.com/assets/images/media/assets/twLogo.svg',
+};
+
+export class InjectiveXConnector extends XConnector {
+  private wallet: Wallet;
+
+  constructor(name: string, wallet: Wallet) {
+    super('INJECTIVE', name, wallet);
+    this.wallet = wallet;
+  }
+
+  getXService(): InjectiveXService {
+    return InjectiveXService.getInstance();
+  }
+
+  async connect(): Promise<XAccount | undefined> {
+    if (isCosmosBrowserWallet(this.wallet) && !isCosmosWalletInstalled(this.wallet)) {
+      return undefined;
+    }
+
+    const walletStrategy = this.getXService().walletStrategy;
+    await walletStrategy.setWallet(this.wallet);
+    const addresses = await walletStrategy.getAddresses();
+
+    if (!addresses?.length) return undefined;
+
+    const address = isEvmBrowserWallet(this.wallet) ? getInjectiveAddress(addresses[0]) : addresses[0];
+
+    return {
+      address,
+      xChainType: this.xChainType,
+    };
+  }
+
+  async disconnect(): Promise<void> {
+    if (isEvmBrowserWallet(this.wallet)) {
+      const walletStrategy = this.getXService().walletStrategy;
+      await walletStrategy.setWallet(this.wallet);
+      await walletStrategy.disconnect();
+    }
+  }
+
+  public get icon(): string | undefined {
+    return WALLET_ICONS[this.wallet];
+  }
+}

package/src/xchains/injective/actions.ts

@@ -1,5 +1,7 @@
 import { useXWagmiStore } from '@/useXWagmiStore';
 import { InjectiveXService } from './InjectiveXService';
+import { isEvmBrowserWallet } from '@injectivelabs/wallet-base';
+import { getInjectiveAddress } from '@injectivelabs/sdk-ts';
 import type { Wallet } from '@injectivelabs/wallet-base';
 
 export const reconnectInjective = async () => {
@@ -8,14 +10,19 @@ export const reconnectInjective = async () => {
 
   const recentXConnectorId = injectiveConnection.xConnectorId;
   const walletStrategy = InjectiveXService.getInstance().walletStrategy;
-  walletStrategy.setWallet(recentXConnectorId as Wallet);
+  await walletStrategy.setWallet(recentXConnectorId as Wallet);
   const addresses = await walletStrategy.getAddresses();
+
+  const address = isEvmBrowserWallet(recentXConnectorId as Wallet)
+    ? getInjectiveAddress(addresses?.[0])
+    : addresses?.[0];
+
   useXWagmiStore.setState({
     xConnections: {
       ...useXWagmiStore.getState().xConnections,
       INJECTIVE: {
         xAccount: {
-          address: addresses?.[0],
+          address,
           xChainType: 'INJECTIVE',
         },
         xConnectorId: recentXConnectorId,

package/src/xchains/injective/index.ts

@@ -1,4 +1,2 @@
 export { InjectiveXService } from './InjectiveXService';
-export { InjectiveKelprXConnector } from './InjectiveKelprXConnector';
-export { InjectiveMetamaskXConnector } from './InjectiveMetamaskXConnector';
-export * from './utils';
+export { InjectiveXConnector } from './InjectiveXConnector';

package/src/xchains/injective/InjectiveKelprXConnector.ts

@@ -1,37 +0,0 @@
-import type { XAccount } from '@/types';
-
-import { XConnector } from '@/core';
-import { Wallet } from '@injectivelabs/wallet-base';
-import { isCosmosWalletInstalled } from '@injectivelabs/wallet-cosmos';
-import { InjectiveXService } from './InjectiveXService';
-
-export class InjectiveKelprXConnector extends XConnector {
-  constructor() {
-    super('INJECTIVE', 'Keplr', Wallet.Keplr);
-  }
-
-  getXService(): InjectiveXService {
-    return InjectiveXService.getInstance();
-  }
-
-  async connect(): Promise<XAccount | undefined> {
-    if (!isCosmosWalletInstalled(Wallet.Keplr)) {
-      window.open('https://chrome.google.com/webstore/detail/keplr/dmkamcknogkgcdfhhbddcghachkejeap?hl=en', '_blank');
-      return;
-    }
-
-    this.getXService().walletStrategy.setWallet(Wallet.Keplr);
-    const addresses = await this.getXService().walletStrategy.getAddresses();
-
-    return {
-      address: addresses?.[0],
-      xChainType: this.xChainType,
-    };
-  }
-
-  async disconnect(): Promise<void> {}
-
-  public get icon() {
-    return 'https://raw.githubusercontent.com/balancednetwork/icons/master/wallets/keplr.svg';
-  }
-}

package/src/xchains/injective/InjectiveMetamaskXConnector.ts

@@ -1,40 +0,0 @@
-import type { XAccount } from '@/types';
-
-import { XConnector } from '@/core';
-import { getInjectiveAddress } from '@injectivelabs/sdk-ts';
-import { isEvmBrowserWallet, Wallet } from '@injectivelabs/wallet-base';
-import { InjectiveXService } from './InjectiveXService';
-
-export class InjectiveMetamaskXConnector extends XConnector {
-  constructor() {
-    super('INJECTIVE', 'MetaMask', Wallet.Metamask);
-  }
-
-  getXService(): InjectiveXService {
-    return InjectiveXService.getInstance();
-  }
-
-  async connect(): Promise<XAccount | undefined> {
-    if (!isEvmBrowserWallet(Wallet.Metamask)) {
-      window.open('https://chromewebstore.google.com/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn?hl=en', '_blank');
-      return;
-    }
-
-    this.getXService().walletStrategy.setWallet(Wallet.Metamask);
-    const addresses = await this.getXService().walletStrategy.getAddresses();
-    const injectiveAddresses = addresses.map(getInjectiveAddress);
-
-    return {
-      address: injectiveAddresses?.[0],
-      xChainType: this.xChainType,
-    };
-  }
-
-  async disconnect(): Promise<void> {
-    await this.getXService().walletStrategy.disconnect();
-  }
-
-  public get icon() {
-    return 'https://raw.githubusercontent.com/balancednetwork/icons/master/wallets/metamask.svg';
-  }
-}

package/src/xchains/injective/utils.ts

@@ -1,17 +0,0 @@
-export const switchEthereumChain = async chainId => {
-  const metamaskProvider = (window as any).ethereum as any;
-
-  await Promise.race([
-    metamaskProvider.request({
-      method: 'wallet_switchEthereumChain',
-      params: [{ chainId: `0x${chainId}` }],
-    }),
-    new Promise<void>(resolve =>
-      metamaskProvider.on('change', ({ chain }: any) => {
-        if (chain?.id === chainId) {
-          resolve();
-        }
-      }),
-    ),
-  ]);
-};