signer-test-sdk-react 0.0.10 → 0.0.12

package/README.md

@@ -11,7 +11,7 @@ npm install @abstraxn/signer-react
 ```
 
 **Requirements:**
-- React 18.0.0 or higher
+- React 18.0.0 or higher (supports both React 18 and React 19)
 - Node.js 16.0.0 or higher
 - `@abstraxn/signer-core` (installed automatically as a dependency)
 

package/dist/src/AbstraxnProvider.js

@@ -9,8 +9,9 @@ import { OnboardingUIWeb } from './components/OnboardingUI';
 import { WagmiProvider, useAccount, useConnect, useDisconnect, useSignMessage, useSendTransaction, useSwitchChain, useBalance, useChainId } from 'wagmi';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { createWagmiConfig } from './wagmiConfig';
-import { parseEther } from 'viem';
+import { parseEther, createPublicClient, http } from 'viem';
 import { ExternalWalletButtons } from './ExternalWalletButtons';
+import { EVM_CHAINS, SOLANA_CHAINS, getChainById, toCoreChain } from './chains';
 export const AbstraxnContext = createContext(null);
 // Create a default QueryClient for wagmi
 const defaultQueryClient = new QueryClient({
@@ -31,6 +32,7 @@ function useAbstraxnProviderBase(_config) {
     const [chainId, setChainId] = useState(null);
     const [error, setError] = useState(null);
     const [loading, setLoading] = useState(false);
+    const [walletBalance, setWalletBalance] = useState(null);
     const onboardingRef = useRef(null);
     const otpIdRef = useRef(null);
     const walletRef = useRef(null);
@@ -46,6 +48,7 @@ function useAbstraxnProviderBase(_config) {
         chainId, setChainId,
         error, setError,
         loading, setLoading,
+        walletBalance, setWalletBalance,
         onboardingRef, otpIdRef, walletRef, googleCallbackHandledRef, twitterCallbackHandledRef, discordCallbackHandledRef,
     };
 }
@@ -83,7 +86,7 @@ function AbstraxnProviderWithoutWagmi({ config, children }) {
     return _jsx(AbstraxnProviderInner, { config: config, children: children, base: base, wagmi: null });
 }
 function AbstraxnProviderInner({ config, children, base, wagmi }) {
-    const { isInitialized, setIsInitialized, isConnected, setIsConnected, address, setAddress, user, setUser, whoami, setWhoami, chainId, setChainId, error, setError, loading, setLoading, onboardingRef, otpIdRef, walletRef, googleCallbackHandledRef, twitterCallbackHandledRef, discordCallbackHandledRef, } = base;
+    const { isInitialized, setIsInitialized, isConnected, setIsConnected, address, setAddress, user, setUser, whoami, setWhoami, chainId, setChainId, error, setError, loading, setLoading, walletBalance, setWalletBalance, onboardingRef, otpIdRef, walletRef, googleCallbackHandledRef, twitterCallbackHandledRef, discordCallbackHandledRef, } = base;
     const externalWalletsEnabled = config.externalWallets?.enabled ?? false;
     // Keep a ref to avoid re-creating callbacks when toggling config (prevents flicker)
     const externalWalletsEnabledRef = useRef(externalWalletsEnabled);
@@ -150,12 +153,47 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
         if (walletRef.current) {
             return;
         }
+        // Compute supported chains from chain config (outside useMemo since we're in useEffect)
+        // This should include ALL chains that might be shown in the UI (availableChains)
+        // We use the same logic as availableChains to ensure consistency
+        let computedSupportedChains = undefined;
+        if (config.supportedChains) {
+            // Use explicitly provided chains
+            computedSupportedChains = config.supportedChains;
+        }
+        else {
+            // Compute from chains config - use same logic as availableChains
+            const chainConfig = config.chains;
+            const chains = [];
+            // Priority 1: Check new chains config format
+            if (chainConfig?.supportedEvmChains && chainConfig.supportedEvmChains.length > 0) {
+                chainConfig.supportedEvmChains.forEach(chainName => {
+                    const chainData = EVM_CHAINS[chainName];
+                    if (chainData && chainData.type === 'evm') {
+                        chains.push(toCoreChain(chainData));
+                    }
+                });
+            }
+            // Priority 2: If no specific config, include default chains that might be shown
+            // This ensures Base and other common chains are available even if not explicitly configured
+            if (chains.length === 0) {
+                // Include common chains that are likely to be in availableChains
+                chains.push(toCoreChain(EVM_CHAINS.ethereum));
+                chains.push(toCoreChain(EVM_CHAINS.polygon));
+                chains.push(toCoreChain(EVM_CHAINS.base));
+            }
+            computedSupportedChains = chains.length > 0 ? chains : [
+                toCoreChain(EVM_CHAINS.ethereum),
+                toCoreChain(EVM_CHAINS.polygon),
+                toCoreChain(EVM_CHAINS.base),
+            ];
+        }
         const walletInstance = new AbstraxnWallet({
             apiKey: config.apiKey,
             authMethods: config.authMethods,
             googleClientId: config.googleClientId,
-            defaultChainId: config.defaultChainId,
-            supportedChains: config.supportedChains,
+            defaultChainId: config.chains?.defaultChainId || config.defaultChainId,
+            supportedChains: computedSupportedChains,
             autoConnect: config.autoConnect ?? false,
             enableLogging: config.enableLogging ?? false,
         });
@@ -187,6 +225,24 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
             catch (err) {
                 console.error('Error getting wallet info on connect:', err);
             }
+            // Ensure loading modal is closed when connected (whoami received)
+            if (onboardingRef.current) {
+                const onboardingAny = onboardingRef.current;
+                if (onboardingAny.hideLoadingModal) {
+                    onboardingAny.hideLoadingModal();
+                }
+                // Also ensure the overlay is hidden if it was opened
+                if (onboardingAny.modalOverlay && onboardingAny.modalOverlay.classList.contains('onboarding-modal-open')) {
+                    onboardingAny.modalOverlay.classList.remove('onboarding-modal-open');
+                    onboardingAny.modalOverlay.classList.add('onboarding-modal-closing');
+                    setTimeout(() => {
+                        if (onboardingAny.modalOverlay) {
+                            onboardingAny.modalOverlay.style.display = 'none';
+                        }
+                    }, 200);
+                    document.body.style.overflow = '';
+                }
+            }
         });
         walletInstance.on('disconnect', () => {
             setIsConnected(false);
@@ -250,7 +306,9 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
                 }
                 catch (err) {
                     console.error('OTP Verify Error:', err);
-                    return { success: false };
+                    // Return the actual error message from the API
+                    const errorMessage = err instanceof Error ? err.message : 'Failed to verify OTP';
+                    return { success: false, error: errorMessage };
                 }
             },
             onGoogleLogin: async () => {
@@ -294,22 +352,6 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
             onLoginSuccess: async (data) => {
                 // Clear any previous errors on successful login
                 setError(null);
-                // Hide onboarding UI
-                if (onboardingRef.current) {
-                    const onboardingAny = onboardingRef.current;
-                    if (onboardingAny.modalOverlay) {
-                        onboardingAny.modalOverlay.classList.remove('onboarding-modal-open');
-                        onboardingAny.modalOverlay.classList.add('onboarding-modal-closing');
-                        setTimeout(() => {
-                            if (onboardingAny.modalOverlay) {
-                                onboardingAny.modalOverlay.style.display = 'none';
-                            }
-                        }, 200);
-                    }
-                    document.body.style.overflow = '';
-                }
-                // Set connected state
-                setIsConnected(true);
                 // Set user if provided in data
                 if (data.user) {
                     setUser(data.user);
@@ -323,9 +365,45 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
                         setAddress(addr);
                         const cid = await walletInstance.getChainId();
                         setChainId(cid);
+                        // Only hide onboarding UI and set connected if whoami succeeds
+                        if (onboardingRef.current) {
+                            const onboardingAny = onboardingRef.current;
+                            if (onboardingAny.hideLoadingModal) {
+                                onboardingAny.hideLoadingModal();
+                            }
+                            if (onboardingAny.modalOverlay) {
+                                onboardingAny.modalOverlay.classList.remove('onboarding-modal-open');
+                                onboardingAny.modalOverlay.classList.add('onboarding-modal-closing');
+                                setTimeout(() => {
+                                    if (onboardingAny.modalOverlay) {
+                                        onboardingAny.modalOverlay.style.display = 'none';
+                                    }
+                                }, 200);
+                            }
+                            document.body.style.overflow = '';
+                        }
+                        // Set connected state only after whoami succeeds
+                        setIsConnected(true);
                     }
                     catch (err) {
                         console.error('Error loading whoami after login:', err);
+                        // Hide loading modal on whoami error
+                        if (onboardingRef.current) {
+                            const onboardingAny = onboardingRef.current;
+                            if (onboardingAny.hideLoadingModal) {
+                                onboardingAny.hideLoadingModal();
+                            }
+                            // Show error modal/screen
+                            const errorMessage = err instanceof Error ? err.message : 'Failed to load user information';
+                            if (onboardingAny.showError) {
+                                onboardingAny.showError(errorMessage);
+                            }
+                        }
+                        // Set error state
+                        const error = err instanceof Error ? err : new Error('Failed to load user information after login');
+                        setError(error);
+                        // Don't set connected if whoami fails
+                        setIsConnected(false);
                     }
                 }
             },
@@ -347,6 +425,20 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
             params.get('error') ||
             params.get('code') ||
             params.get('accessToken');
+        const getAuthProviderFromToken = (token) => {
+            try {
+                const base64Url = token.split('.')[1];
+                const base64 = base64Url.replace(/-/g, '+').replace(/_/g, '/');
+                const jsonPayload = decodeURIComponent(window.atob(base64).split('').map(function (c) {
+                    return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
+                }).join(''));
+                const payload = JSON.parse(jsonPayload);
+                return (payload.authProvider || payload.provider || '').toLowerCase();
+            }
+            catch (e) {
+                return null;
+            }
+        };
         const matchesProvider = (provider, params) => {
             const providerParam = (params.get('provider') || params.get('authProvider') || '').toLowerCase();
             const path = window.location.pathname.toLowerCase();
@@ -356,6 +448,17 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
                 }
                 return providerParam === provider;
             }
+            // Check accessToken for provider
+            const accessToken = params.get('accessToken');
+            if (accessToken) {
+                const tokenProvider = getAuthProviderFromToken(accessToken);
+                if (tokenProvider) {
+                    if (provider === 'twitter') {
+                        return tokenProvider === 'twitter' || tokenProvider === 'x';
+                    }
+                    return tokenProvider === provider;
+                }
+            }
             if (provider === 'twitter') {
                 return path.includes('/twitter') || path.includes('/x');
             }
@@ -375,12 +478,16 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
             onboardingAny.modalOverlay.style.display = 'none';
             document.body.style.overflow = '';
         }
-        else if (hasSuccess && onboardingAny.modalOverlay) {
-            // If success=true is in URL, ensure modal is open to show loading
-            onboardingAny.modalOverlay.classList.remove('onboarding-modal-closing');
-            onboardingAny.modalOverlay.classList.add('onboarding-modal-open');
-            onboardingAny.modalOverlay.style.display = 'flex';
-            document.body.style.overflow = 'hidden';
+        else if (hasSuccess) {
+            // If success=true is in URL, show loading modal
+            // Use setTimeout to ensure onboarding is fully initialized
+            setTimeout(() => {
+                const onboardingInstance = onboardingRef.current;
+                if (onboardingInstance && onboardingInstance.showLoadingModal) {
+                    // Directly show loading modal - it creates its own overlay with header and footer
+                    onboardingInstance.showLoadingModal();
+                }
+            }, 150);
         }
         onboardingRef.current = onboarding;
         // Handle Google OAuth callback (only in useEffect, not exposed)
@@ -420,12 +527,17 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
             }
             catch (err) {
                 console.error('Google callback error:', err);
-                // Hide loading modal on error
+                // Hide loading modal on error (including whoami API failures)
                 if (onboardingRef.current) {
                     const onboardingAny = onboardingRef.current;
+                    // Always try to hide loading modal first
                     if (onboardingAny.hideLoadingModal) {
                         onboardingAny.hideLoadingModal();
                     }
+                    // Also hide any main modal overlay
+                    if (onboardingAny.modalOverlay) {
+                        onboardingAny.modalOverlay.style.display = 'none';
+                    }
                     // Show error modal/screen
                     const errorMessage = err instanceof Error ? err.message : 'Google authentication failed';
                     if (onboardingAny.showError) {
@@ -434,6 +546,8 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
                 }
                 setError(err instanceof Error ? err : new Error('Google callback failed'));
                 googleCallbackHandledRef.current = false;
+                // Ensure body scroll is restored
+                document.body.style.overflow = '';
             }
         };
         const handleDiscordCallback = async () => {
@@ -472,12 +586,17 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
             }
             catch (err) {
                 console.error('Discord callback error:', err);
-                // Hide loading modal on error
+                // Hide loading modal on error (including whoami API failures)
                 if (onboardingRef.current) {
                     const onboardingAny = onboardingRef.current;
+                    // Always try to hide loading modal first
                     if (onboardingAny.hideLoadingModal) {
                         onboardingAny.hideLoadingModal();
                     }
+                    // Also hide any main modal overlay
+                    if (onboardingAny.modalOverlay) {
+                        onboardingAny.modalOverlay.style.display = 'none';
+                    }
                     // Show error modal/screen
                     const errorMessage = err instanceof Error ? err.message : 'Discord authentication failed';
                     if (onboardingAny.showError) {
@@ -486,6 +605,8 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
                 }
                 setError(err instanceof Error ? err : new Error('Discord callback failed'));
                 discordCallbackHandledRef.current = false;
+                // Ensure body scroll is restored
+                document.body.style.overflow = '';
             }
         };
         const handleTwitterCallback = async () => {
@@ -524,12 +645,17 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
             }
             catch (err) {
                 console.error('Twitter callback error:', err);
-                // Hide loading modal on error
+                // Hide loading modal on error (including whoami API failures)
                 if (onboardingRef.current) {
                     const onboardingAny = onboardingRef.current;
+                    // Always try to hide loading modal first
                     if (onboardingAny.hideLoadingModal) {
                         onboardingAny.hideLoadingModal();
                     }
+                    // Also hide any main modal overlay
+                    if (onboardingAny.modalOverlay) {
+                        onboardingAny.modalOverlay.style.display = 'none';
+                    }
                     // Show error modal/screen
                     const errorMessage = err instanceof Error ? err.message : 'Twitter authentication failed';
                     if (onboardingAny.showError) {
@@ -538,6 +664,8 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
                 }
                 setError(err instanceof Error ? err : new Error('Twitter callback failed'));
                 twitterCallbackHandledRef.current = false;
+                // Ensure body scroll is restored
+                document.body.style.overflow = '';
             }
         };
         handleGoogleCallback();
@@ -1653,6 +1781,177 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
     const currentChainId = isExternalWalletConnected && externalWalletChainId
         ? externalWalletChainId
         : chainId;
+    // Fetch balance for Abstraxn wallet (not external wallet)
+    useEffect(() => {
+        if (isExternalWalletConnected || !address || !currentChainId) {
+            setWalletBalance(null);
+            return;
+        }
+        const fetchBalance = async () => {
+            try {
+                const currentChain = getChainById(currentChainId);
+                if (!currentChain || currentChain.type !== 'evm') {
+                    setWalletBalance(null);
+                    return;
+                }
+                const publicClient = createPublicClient({
+                    chain: {
+                        id: currentChain.id,
+                        name: currentChain.name,
+                        nativeCurrency: currentChain.nativeCurrency,
+                        rpcUrls: {
+                            default: {
+                                http: [currentChain.rpcUrl],
+                            },
+                        },
+                    },
+                    transport: http(currentChain.rpcUrl),
+                });
+                const balance = await publicClient.getBalance({
+                    address: address,
+                });
+                setWalletBalance(balance);
+            }
+            catch (error) {
+                console.error('Failed to fetch balance:', error);
+                setWalletBalance(null);
+            }
+        };
+        fetchBalance();
+        // Refetch balance every 10 seconds
+        const interval = setInterval(fetchBalance, 10000);
+        return () => clearInterval(interval);
+    }, [address, currentChainId, isExternalWalletConnected]);
+    // Compute available chains from config - supports both legacy and new format
+    const availableChains = useMemo(() => {
+        const chains = [];
+        const chainConfig = config.chains;
+        // Priority 1: Check new chains config format
+        if (chainConfig?.supportedEvmChains && chainConfig.supportedEvmChains.length > 0) {
+            // Use configured chains from new format
+            chainConfig.supportedEvmChains.forEach(chainName => {
+                const chain = EVM_CHAINS[chainName];
+                if (chain) {
+                    chains.push(chain);
+                }
+            });
+        }
+        // Priority 2: Check legacy supportedChains format
+        else if (config.supportedChains && config.supportedChains.length > 0) {
+            // Convert legacy Chain format to ChainData
+            config.supportedChains.forEach(legacyChain => {
+                // Try to find matching chain by ID
+                const chainData = getChainById(legacyChain.id);
+                if (chainData) {
+                    chains.push(chainData);
+                }
+                else {
+                    // If not found, create ChainData from legacy chain
+                    const newChain = {
+                        id: legacyChain.id,
+                        name: legacyChain.name.toLowerCase().replace(/\s+/g, '-'),
+                        displayName: legacyChain.name,
+                        rpcUrl: legacyChain.rpcUrl,
+                        explorerUrl: `https://etherscan.io`, // Default explorer
+                        nativeCurrency: legacyChain.nativeCurrency,
+                        type: 'evm', // Assume EVM for legacy chains
+                        isTestnet: legacyChain.id !== 1 && legacyChain.id !== 137 && legacyChain.id !== 8453, // Common mainnets
+                    };
+                    chains.push(newChain);
+                }
+            });
+        }
+        // Priority 3: Default chains only if nothing configured at all
+        // Only show defaults if both config.chains and config.supportedChains are missing
+        else if (!chainConfig && !config.supportedChains) {
+            chains.push(EVM_CHAINS.ethereum, EVM_CHAINS.polygon, EVM_CHAINS.base);
+        }
+        // Add Solana chains if enabled (from new config format)
+        if (chainConfig?.enableSolana) {
+            chains.push(SOLANA_CHAINS.solana);
+        }
+        // Remove duplicates by chain ID
+        const uniqueChains = chains.filter((chain, index, self) => index === self.findIndex(c => c.id === chain.id));
+        // Only return defaults if absolutely nothing was configured
+        return uniqueChains.length > 0
+            ? uniqueChains
+            : (!chainConfig && !config.supportedChains
+                ? [EVM_CHAINS.ethereum, EVM_CHAINS.polygon, EVM_CHAINS.base]
+                : []);
+    }, [config.chains, config.supportedChains]);
+    // Get current chain data
+    const currentChain = useMemo(() => {
+        if (!currentChainId)
+            return null;
+        return getChainById(currentChainId) || null;
+    }, [currentChainId]);
+    // Enhanced switchChain that works for both EVM and Solana
+    const switchChainEnhanced = useCallback(async (targetChainId) => {
+        if (!walletRef.current) {
+            throw new Error('Wallet not initialized');
+        }
+        // Check if chain is in availableChains (user-configured chains)
+        const targetChainInAvailable = availableChains?.find(c => c.id === targetChainId);
+        if (!targetChainInAvailable) {
+            throw new Error(`Chain with ID ${targetChainId} is not available. Please configure it in your SDK setup.`);
+        }
+        const targetChain = getChainById(targetChainId);
+        if (!targetChain) {
+            throw new Error(`Chain with ID ${targetChainId} is not supported`);
+        }
+        setLoading(true);
+        setError(null);
+        try {
+            if (targetChain.type === 'evm') {
+                // For EVM chains, use the existing switchChain
+                if (isExternalWalletConnected && wagmiSwitchChain) {
+                    // External wallet - use wagmi switchChain
+                    await wagmiSwitchChain.switchChainAsync({ chainId: targetChainId });
+                    setExternalWalletChainId(targetChainId);
+                }
+                else {
+                    // Abstraxn wallet - try to switch, but if chain is not in wallet's supportedChains,
+                    // we'll update the state directly (for chains that are in availableChains but not in wallet config)
+                    try {
+                        await switchChain(targetChainId);
+                    }
+                    catch (switchErr) {
+                        // If the wallet doesn't support this chain, but it's in availableChains,
+                        // we can still update the state to allow UI to work
+                        if (switchErr?.message?.includes('not supported') && targetChainInAvailable) {
+                            // Update chainId state directly for chains in availableChains
+                            setChainId(targetChainId);
+                            // Emit chainChanged event if wallet supports it
+                            if (walletRef.current && typeof walletRef.current.emit === 'function') {
+                                walletRef.current.emit('chainChanged', targetChainId);
+                            }
+                        }
+                        else {
+                            throw switchErr;
+                        }
+                    }
+                }
+            }
+            else if (targetChain.type === 'solana') {
+                // For Solana, we might need different handling
+                // For now, just update the chainId state
+                // TODO: Implement actual Solana chain switching when wallet supports it
+                setChainId(targetChainId);
+            }
+            // Update chainId state
+            if (!isExternalWalletConnected) {
+                setChainId(targetChainId);
+            }
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(`Failed to switch to chain ${targetChainId}: ${err instanceof Error ? err.message : String(err)}`);
+            setError(error);
+            throw error;
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [isExternalWalletConnected, wagmiSwitchChain, switchChain, availableChains]);
     const value = {
         wallet: walletRef.current,
         isInitialized,
@@ -1692,6 +1991,12 @@ function AbstraxnProviderInner({ config, children, base, wagmi }) {
         externalWalletNetwork: externalWalletsEnabled && wagmiChainIdHook ? getNetworkName(wagmiChainIdHook) : undefined,
         availableConnectors: externalWalletsEnabled ? availableConnectors : undefined,
         switchExternalWalletChain: externalWalletsEnabled ? switchExternalWalletChain : undefined,
+        // Chain management
+        switchChainEnhanced,
+        currentChain,
+        availableChains,
+        // Balance (for Abstraxn wallet)
+        walletBalance: !isExternalWalletConnected ? walletBalance : undefined,
     };
     // Ref to store latest value to avoid dependency issues (defined after value)
     const valueRef = useRef(value);
@@ -2168,11 +2473,35 @@ export function AbstraxnProvider({ config, children }) {
     // Create wagmi config if external wallets are enabled
     // Use useMemo to ensure config is created synchronously during render
     // This prevents the "Loading wallet connectors..." state from flashing or blocking initial render
+    // Compute chains for wagmi config (needs to be done before useMemo)
+    const wagmiChains = useMemo(() => {
+        // Use the same logic as availableChains but convert to Core Chain format
+        const chains = [];
+        const chainConfig = config.chains;
+        // Priority 1: Check new chains config format
+        if (chainConfig?.supportedEvmChains && chainConfig.supportedEvmChains.length > 0) {
+            chainConfig.supportedEvmChains.forEach(chainName => {
+                const chainData = EVM_CHAINS[chainName];
+                if (chainData && chainData.type === 'evm') {
+                    chains.push(toCoreChain(chainData));
+                }
+            });
+        }
+        // Priority 2: Check legacy supportedChains format
+        else if (config.supportedChains && config.supportedChains.length > 0) {
+            chains.push(...config.supportedChains);
+        }
+        // Priority 3: Default chains
+        else {
+            chains.push(toCoreChain(EVM_CHAINS.ethereum));
+        }
+        return chains.length > 0 ? chains : [toCoreChain(EVM_CHAINS.ethereum)];
+    }, [config.chains, config.supportedChains]);
     const { wagmiConfig, configError } = useMemo(() => {
         if (!externalWalletsEnabled)
             return { wagmiConfig: null, configError: null };
         try {
-            const configResult = createWagmiConfig(config.supportedChains, config.externalWallets?.walletConnectProjectId, config.externalWallets?.connectors, config.ui?.theme || 'dark');
+            const configResult = createWagmiConfig(wagmiChains, config.externalWallets?.walletConnectProjectId, config.externalWallets?.connectors, config.ui?.theme || 'dark');
             return { wagmiConfig: configResult, configError: null };
         }
         catch (error) {
@@ -2182,7 +2511,7 @@ export function AbstraxnProvider({ config, children }) {
                 configError: error instanceof Error ? error : new Error('Failed to create wagmi config')
             };
         }
-    }, [externalWalletsEnabled, config.supportedChains, config.externalWallets?.walletConnectProjectId, config.externalWallets?.connectors]);
+    }, [externalWalletsEnabled, wagmiChains, config.externalWallets?.walletConnectProjectId, config.externalWallets?.connectors]);
     // If external wallets are enabled, wrap with QueryClientProvider and WagmiProvider
     if (externalWalletsEnabled) {
         if (configError) {