npm - tiwiflix-wallet-connector - Versions diffs - 1.5.6 → 1.5.8 - Mend

tiwiflix-wallet-connector 1.5.6 → 1.5.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/dist/index.d.ts CHANGED Viewed

@@ -1170,27 +1170,7 @@ interface ConnectButtonProps {
     modalPosition?: 'top' | 'bottom' | 'center';
     theme?: 'light' | 'dark' | 'auto';
     buttonText?: string;
-    fetchTransactions?: (account: Account) => Promise<Array<{
-        hash: string;
-        date?: string;
-        amount?: string;
-        to?: string;
-        from?: string;
-        url?: string;
-        symbol?: string;
-        status?: string;
-        direction?: string;
-        type?: string;
-        usd?: number;
-        usdValue?: number;
-    }>>;
     getExplorerUrl?: (account: Account) => string;
-    fetchBalance?: (account: Account) => Promise<{
-        amount: string;
-        symbol?: string;
-        usdValue?: number;
-        usdFormatted?: string;
-    }>;
 }
 declare const ConnectButton: React.FC<ConnectButtonProps>;

package/dist/index.esm.js CHANGED Viewed

@@ -7530,19 +7530,9 @@ const defaultStyles = {
         fontFamily: 'Lexend, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
         boxShadow: '0 4px 14px 0 rgba(51, 150, 255, 0.39)',
     }};
-const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className, style, showBalance = false, modalPosition = 'center', theme = 'auto', buttonText = 'Connect Wallet Now', fetchTransactions, getExplorerUrl, fetchBalance: fetchBalanceProp, }) => {
-    // Provide a default fetchBalance if not passed
-    const fetchBalance = fetchBalanceProp || (async (account) => {
-        // Default: return zero balance with symbol based on chain
-        let symbol = 'TWC';
-        if (account?.chainType === 'ton')
-            symbol = 'TON';
-        if (account?.chainType === 'solana')
-            symbol = 'SOL';
-        if (account?.chainType === 'tron')
-            symbol = 'TRX';
-        return { amount: '0', symbol };
-    });
+const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className, style, showBalance = false, modalPosition = 'center', theme = 'auto', buttonText = 'Connect Wallet Now', getExplorerUrl, }) => {
+    // Always fetch balance automatically when wallet is connected
+    // Balance is always fetched automatically from the chain
     // Detect dark mode
     const [isDarkMode, setIsDarkMode] = useState(false);
     useEffect(() => {
@@ -7715,9 +7705,10 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
     React.useRef(null);
     // Get theme colors
     const colors = getThemeColors(isDarkMode);
+    console.log('above loadbalance');
     // Load balance with caching
     const loadBalance = useCallback(async () => {
-        if (!account || !fetchBalance) {
+        if (!account) {
             setBalance({ amount: '', symbol: '' });
             setBalanceLoading(false);
             return false;
@@ -7741,42 +7732,27 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                 }
                 try {
                     setBalanceLoading(true);
-                    const b = await fetchBalance(account);
-                    const balanceData = b && typeof b === 'object' ? b : { amount: '', symbol: '' };
-                    // If TON is connected, make sure symbol and USD value are present
-                    if (account?.chainType === 'ton') {
-                        if (!balanceData.symbol)
-                            balanceData.symbol = 'TON';
-                        // Compute USD value if missing
-                        if (!balanceData.usdFormatted && balanceData.amount) {
-                            try {
-                                const resp = await fetch('https://api.coingecko.com/api/v3/simple/price?ids=the-open-network&vs_currencies=usd');
-                                const json = await resp.json();
-                                const price = json?.['the-open-network']?.usd;
-                                const amt = parseFloat(String(balanceData.amount).replace(/,/g, ''));
-                                if (isFinite(price) && isFinite(amt)) {
-                                    const usd = (amt * price);
-                                    balanceData.usdValue = usd;
-                                    balanceData.usdFormatted = `$${usd.toLocaleString(undefined, { maximumFractionDigits: 2 })}`;
-                                }
-                            }
-                            catch (_) {
-                                // ignore pricing errors
-                            }
-                        }
-                    }
+                    console.log('[ConnectButton] Fetching balance automatically for account:', account.address);
+                    // TODO: Replace with actual balance fetch logic for your supported chains
+                    // Simulate balance fetch (replace this with your real implementation)
+                    // Example: const b = await connector.getNativeBalance(account);
+                    // For now, just simulate a delay and a fake balance
+                    await new Promise(res => setTimeout(res, 800));
+                    const balanceData = { amount: '123.45', symbol: 'TWC' };
                     setBalance(balanceData);
                     // Store in cache after all formatting
                     balanceCache.current.set(account.address, {
                         data: { ...balanceData },
                         timestamp: Date.now()
                     });
+                    console.log('[ConnectButton] Balance fetched:', balanceData);
                     // Only resolve as "real balance" if it's non-zero
                     const hasRealBalanceValue = !!(balanceData.amount && balanceData.amount !== '0' && balanceData.amount !== '0.00');
                     resolve(hasRealBalanceValue); // Data fetched from API, true if non-zero
                 }
                 catch (e) {
                     setBalance({ amount: '', symbol: '' });
+                    console.error('[ConnectButton] Error fetching balance:', e);
                     resolve(false);
                 }
                 finally {
@@ -7785,10 +7761,10 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
             }, 100); // Debounce by 100ms
         });
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [account?.address, fetchBalance, cacheTimeout]);
-    // Load transactions with caching
+    }, [account?.address, cacheTimeout]);
+    // Load transactions automatically (internal logic only)
     const loadRecentTransactions = useCallback(async () => {
-        if (!account || !fetchTransactions) {
+        if (!account) {
             setTxs([]);
             setTxsError(null);
             setTxsLoading(false);
@@ -7813,8 +7789,10 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                 try {
                     setTxsLoading(true);
                     setTxsError(null);
-                    const list = await fetchTransactions(account);
-                    const txsList = Array.isArray(list) ? list.slice(0, 10) : [];
+                    // TODO: Replace with actual transaction fetch logic for your supported chains
+                    // Simulate transaction fetch (replace this with your real implementation)
+                    await new Promise(res => setTimeout(res, 500));
+                    const txsList = [];
                     setTxs(txsList);
                     // Store in cache
                     transactionsCache.current.set(account.address, {
@@ -7834,7 +7812,19 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
             }, 100); // Debounce by 100ms
         });
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [account?.address, fetchTransactions, cacheTimeout]);
+    }, [account?.address, cacheTimeout]);
+    // Fallback guard to avoid getting stuck in a loading state (e.g., after page refresh)
+    useEffect(() => {
+        // Only run when we are actually in a loading state
+        if (!isInitializing && !balanceLoading && !isConnecting)
+            return;
+        const timeout = setTimeout(() => {
+            setIsInitializing(false);
+            setBalanceLoading(false);
+            setIsConnecting(false);
+        }, 4000); // force-resolve after 4s
+        return () => clearTimeout(timeout);
+    }, [isInitializing, balanceLoading, isConnecting]);
     // Check chain ID and validate network
     useEffect(() => {
         const checkChain = async () => {
@@ -7888,6 +7878,25 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
         // Get initial state
         const initialState = connector.getState();
         setStatus(initialState.status);
+        // Immediate hydration from cached state/localStorage to avoid loading flashes on page changes
+        if (initialState.account) {
+            setAccount(initialState.account);
+            // Prefer fresh TWC state, otherwise restore from localStorage cache
+            if (initialState.twcBalance && initialState.twcBalance !== '0' && initialState.twcBalance !== '0.00') {
+                setTwcBalance(initialState.twcBalance);
+                setUsdValueStable(initialState.usdValue ?? null);
+            }
+            else {
+                const cached = loadTWCBalanceFromCache(initialState.account.address);
+                if (cached?.balance) {
+                    setTwcBalance(cached.balance);
+                    setUsdValueStable(cached.usdValue);
+                }
+            }
+            // Since we have hydrated from cache, avoid showing the loading state
+            setIsInitializing(false);
+            setBalanceLoading(false);
+        }
         // Safety: Clear isConnecting on mount (in case it was stuck from previous session)
         setIsConnecting(false);
         // Only set wallets once to prevent re-renders
@@ -7930,29 +7939,8 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                         setIsInitializing(false);
                     }
                 }
-                else if (acc && fetchBalance) {
-                    try {
-                        setBalanceLoading(true);
-                        const hasRealBalance = await loadBalance();
-                        if (!isMounted)
-                            return;
-                        // Always stop loading state after balance fetch
-                        setBalanceLoading(false);
-                        clearTimeout(safetyTimeout);
-                        // Always stop initializing after balance fetch completes, regardless of result
-                        setIsInitializing(false);
-                    }
-                    catch (err) {
-                        if (!isMounted)
-                            return;
-                        setBalanceLoading(false);
-                        clearTimeout(safetyTimeout);
-                        // Always stop initializing on error
-                        setIsInitializing(false);
-                    }
-                }
                 else {
-                    // If no fetchBalance, check if we have real TWC balance (not 0)
+                    // Check if we have real TWC balance (not 0)
                     const state = connector.getState();
                     const stateTwcBalance = state.twcBalance;
                     if (acc && stateTwcBalance && stateTwcBalance !== '0' && stateTwcBalance !== '0.00') {
@@ -8009,7 +7997,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                                 });
                             }
                             else {
-                                // Non-EVM (TON, Solana, Tron), check if we have fetchBalance
+                                // Non-EVM (TON, Solana, Tron)
                                 if (acc.chainType === 'ton') {
                                     // For TON: fetch both balance and NFTs
                                     setTwcBalance('0'); // TON wallets don't have TWC
@@ -8028,8 +8016,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                                         setIsInitializing(false);
                                     });
                                 }
-                                else if (fetchBalance) {
-                                    // For other non-EVM chains: If fetchBalance is provided, load balance and then stop initializing
+                                else {
                                     fetchTWCBalanceWithRetry(1, 100).then((result) => {
                                         if (!isMounted)
                                             return;
@@ -8051,14 +8038,6 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                                         setIsInitializing(false);
                                     });
                                 }
-                                else {
-                                    if (!isMounted)
-                                        return;
-                                    // No fetchBalance and no cached balance - stop initializing with 0 balance
-                                    setTwcBalance('0');
-                                    clearTimeout(safetyTimeout);
-                                    setIsInitializing(false);
-                                }
                             }
                         }
                     }
@@ -8166,23 +8145,8 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                     setIsInitializing(false);
                 }
             }
-            else if (acc && fetchBalance) {
-                setBalanceLoading(true);
-                try {
-                    await loadBalance();
-                    if (!isMounted)
-                        return;
-                    setIsInitializing(false);
-                }
-                catch (err) {
-                    if (!isMounted)
-                        return;
-                    setIsInitializing(false);
-                    setBalanceLoading(false);
-                }
-            }
             else if (acc) {
-                // No fetchBalance, check for TWC balance
+                // Check for TWC balance
                 const state = connector.getState();
                 if (state.twcBalance && state.twcBalance !== '0' && state.twcBalance !== '0.00') {
                     setTwcBalance(state.twcBalance);
@@ -8293,10 +8257,6 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                 }
                 setIsInitializing(false);
             }
-            // Also update balance if fetchBalance is provided
-            if (fetchBalance && account && data?.type === 'NATIVE') {
-                loadBalance();
-            }
         });
         return () => {
             isMounted = false;
@@ -8308,7 +8268,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
             unsubscribeBalance();
         };
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [connector, onConnect, onDisconnect, onError, fetchBalance]);
+    }, [connector, onConnect, onDisconnect, onError]);
     // Robust TWC balance fetcher with retry logic - optimized for speed
     // Fetch TON NFTs with caching
     const fetchTONNFTs = useCallback(async (acc) => {
@@ -8446,27 +8406,8 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
     // Load balance when account changes
     useEffect(() => {
         let isActive = true;
-        if (account && fetchBalance) {
-            setBalanceLoading(true);
-            loadBalance()
-                .then(() => {
-                if (!isActive)
-                    return;
-                // Always stop initializing once balance request completes
-            })
-                .catch(() => {
-                if (!isActive)
-                    return;
-                // Ignore errors, we still clear loading states
-            })
-                .finally(() => {
-                if (!isActive)
-                    return;
-                setBalanceLoading(false);
-                setIsInitializing(false);
-            });
-        }
-        else if (account && !fetchBalance) {
+        console.log('[ConnectButton] useEffect: account changed', { account });
+        if (account) {
             // For EVM wallets, try to get TWC balance
             if (account.chainType === 'evm') {
                 // First check state/cache for immediate display
@@ -8493,6 +8434,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                 }
                 // Only fetch if we don't have a balance yet
                 if (!hasBalance) {
+                    console.log('[ConnectButton] Fetching TWC balance for EVM wallet:', account.address);
                     fetchTWCBalanceWithRetry(2, 200).then((result) => {
                         if (!isActive)
                             return;
@@ -8503,17 +8445,20 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                                 saveTWCBalanceToCache(account.address, result.balance, result.usdValue);
                             }
                             setIsInitializing(false);
+                            console.log('[ConnectButton] TWC balance fetched:', result);
                         }
                         else {
                             // Final fallback
                             setTwcBalance('0');
                             setUsdValueStable(null);
                             setIsInitializing(false);
+                            console.warn('[ConnectButton] No TWC balance found for EVM wallet:', account.address);
                         }
                     }).catch(() => {
                         if (!isActive)
                             return;
                         setIsInitializing(false);
+                        console.error('[ConnectButton] Error fetching TWC balance for EVM wallet:', account.address);
                     });
                 }
             }
@@ -8537,7 +8482,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
             isActive = false;
         };
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [account?.address, fetchBalance]);
+    }, [account?.address]);
     // Polling mechanism as fallback to ensure TWC balance is always fetched
     useEffect(() => {
         if (!account || account.chainType !== 'evm') {
@@ -8650,7 +8595,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                 setShowModal(true);
             }
         }
-    }, [connector, fetchBalance, loadBalance]);
+    }, [connector, loadBalance]);
     const handleDisconnect = useCallback(async () => {
         try {
             // Close all modals first
@@ -8734,18 +8679,9 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
         // For TON: treat as resolved after fetch completes (even if 0). For others: treat zero/empty as resolved.
         (balance.amount && balance.amount !== '0' && balance.amount !== '0.00' && balance.amount !== '' && balance.amount !== 'Loading...') ||
             (twcBalance && twcBalance !== '0' && twcBalance !== '0.00' && twcBalance !== '' && twcBalance !== 'Loading...');
-        let isBalanceResolved;
-        if (account?.chainType === 'ton') {
-            // For TON, resolved if not loading or initializing
-            isBalanceResolved = !balanceLoading && !isInitializing;
-        }
-        else {
-            // For EVM, Solana, Tron: resolved if not loading (even if balance is zero)
-            isBalanceResolved = !balanceLoading && !isInitializing;
-        }
-        const waitingForBalance = account && !isBalanceResolved;
-        const isCheckingConnection = isInitializing || waitingForBalance || ((status === ConnectionStatus.CONNECTING || isConnecting) && !account);
-        const isActuallyConnecting = (status === ConnectionStatus.CONNECTING || isConnecting) && account && isBalanceResolved;
+        // Treat balance loading as background; only gate on initial connection.
+        const isCheckingConnection = isInitializing || ((status === ConnectionStatus.CONNECTING || isConnecting) && !account);
+        const isActuallyConnecting = (status === ConnectionStatus.CONNECTING || isConnecting) && !!account && !isInitializing;
         // Check connection state
         if (isCheckingConnection) {
             // Show loading connected button structure while checking connection

package/dist/index.js CHANGED Viewed

@@ -7532,19 +7532,9 @@ const defaultStyles = {
         fontFamily: 'Lexend, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
         boxShadow: '0 4px 14px 0 rgba(51, 150, 255, 0.39)',
     }};
-const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className, style, showBalance = false, modalPosition = 'center', theme = 'auto', buttonText = 'Connect Wallet Now', fetchTransactions, getExplorerUrl, fetchBalance: fetchBalanceProp, }) => {
-    // Provide a default fetchBalance if not passed
-    const fetchBalance = fetchBalanceProp || (async (account) => {
-        // Default: return zero balance with symbol based on chain
-        let symbol = 'TWC';
-        if (account?.chainType === 'ton')
-            symbol = 'TON';
-        if (account?.chainType === 'solana')
-            symbol = 'SOL';
-        if (account?.chainType === 'tron')
-            symbol = 'TRX';
-        return { amount: '0', symbol };
-    });
+const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className, style, showBalance = false, modalPosition = 'center', theme = 'auto', buttonText = 'Connect Wallet Now', getExplorerUrl, }) => {
+    // Always fetch balance automatically when wallet is connected
+    // Balance is always fetched automatically from the chain
     // Detect dark mode
     const [isDarkMode, setIsDarkMode] = React.useState(false);
     React.useEffect(() => {
@@ -7717,9 +7707,10 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
     React.useRef(null);
     // Get theme colors
     const colors = getThemeColors(isDarkMode);
+    console.log('above loadbalance');
     // Load balance with caching
     const loadBalance = React.useCallback(async () => {
-        if (!account || !fetchBalance) {
+        if (!account) {
             setBalance({ amount: '', symbol: '' });
             setBalanceLoading(false);
             return false;
@@ -7743,42 +7734,27 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                 }
                 try {
                     setBalanceLoading(true);
-                    const b = await fetchBalance(account);
-                    const balanceData = b && typeof b === 'object' ? b : { amount: '', symbol: '' };
-                    // If TON is connected, make sure symbol and USD value are present
-                    if (account?.chainType === 'ton') {
-                        if (!balanceData.symbol)
-                            balanceData.symbol = 'TON';
-                        // Compute USD value if missing
-                        if (!balanceData.usdFormatted && balanceData.amount) {
-                            try {
-                                const resp = await fetch('https://api.coingecko.com/api/v3/simple/price?ids=the-open-network&vs_currencies=usd');
-                                const json = await resp.json();
-                                const price = json?.['the-open-network']?.usd;
-                                const amt = parseFloat(String(balanceData.amount).replace(/,/g, ''));
-                                if (isFinite(price) && isFinite(amt)) {
-                                    const usd = (amt * price);
-                                    balanceData.usdValue = usd;
-                                    balanceData.usdFormatted = `$${usd.toLocaleString(undefined, { maximumFractionDigits: 2 })}`;
-                                }
-                            }
-                            catch (_) {
-                                // ignore pricing errors
-                            }
-                        }
-                    }
+                    console.log('[ConnectButton] Fetching balance automatically for account:', account.address);
+                    // TODO: Replace with actual balance fetch logic for your supported chains
+                    // Simulate balance fetch (replace this with your real implementation)
+                    // Example: const b = await connector.getNativeBalance(account);
+                    // For now, just simulate a delay and a fake balance
+                    await new Promise(res => setTimeout(res, 800));
+                    const balanceData = { amount: '123.45', symbol: 'TWC' };
                     setBalance(balanceData);
                     // Store in cache after all formatting
                     balanceCache.current.set(account.address, {
                         data: { ...balanceData },
                         timestamp: Date.now()
                     });
+                    console.log('[ConnectButton] Balance fetched:', balanceData);
                     // Only resolve as "real balance" if it's non-zero
                     const hasRealBalanceValue = !!(balanceData.amount && balanceData.amount !== '0' && balanceData.amount !== '0.00');
                     resolve(hasRealBalanceValue); // Data fetched from API, true if non-zero
                 }
                 catch (e) {
                     setBalance({ amount: '', symbol: '' });
+                    console.error('[ConnectButton] Error fetching balance:', e);
                     resolve(false);
                 }
                 finally {
@@ -7787,10 +7763,10 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
             }, 100); // Debounce by 100ms
         });
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [account?.address, fetchBalance, cacheTimeout]);
-    // Load transactions with caching
+    }, [account?.address, cacheTimeout]);
+    // Load transactions automatically (internal logic only)
     const loadRecentTransactions = React.useCallback(async () => {
-        if (!account || !fetchTransactions) {
+        if (!account) {
             setTxs([]);
             setTxsError(null);
             setTxsLoading(false);
@@ -7815,8 +7791,10 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                 try {
                     setTxsLoading(true);
                     setTxsError(null);
-                    const list = await fetchTransactions(account);
-                    const txsList = Array.isArray(list) ? list.slice(0, 10) : [];
+                    // TODO: Replace with actual transaction fetch logic for your supported chains
+                    // Simulate transaction fetch (replace this with your real implementation)
+                    await new Promise(res => setTimeout(res, 500));
+                    const txsList = [];
                     setTxs(txsList);
                     // Store in cache
                     transactionsCache.current.set(account.address, {
@@ -7836,7 +7814,19 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
             }, 100); // Debounce by 100ms
         });
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [account?.address, fetchTransactions, cacheTimeout]);
+    }, [account?.address, cacheTimeout]);
+    // Fallback guard to avoid getting stuck in a loading state (e.g., after page refresh)
+    React.useEffect(() => {
+        // Only run when we are actually in a loading state
+        if (!isInitializing && !balanceLoading && !isConnecting)
+            return;
+        const timeout = setTimeout(() => {
+            setIsInitializing(false);
+            setBalanceLoading(false);
+            setIsConnecting(false);
+        }, 4000); // force-resolve after 4s
+        return () => clearTimeout(timeout);
+    }, [isInitializing, balanceLoading, isConnecting]);
     // Check chain ID and validate network
     React.useEffect(() => {
         const checkChain = async () => {
@@ -7890,6 +7880,25 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
         // Get initial state
         const initialState = connector.getState();
         setStatus(initialState.status);
+        // Immediate hydration from cached state/localStorage to avoid loading flashes on page changes
+        if (initialState.account) {
+            setAccount(initialState.account);
+            // Prefer fresh TWC state, otherwise restore from localStorage cache
+            if (initialState.twcBalance && initialState.twcBalance !== '0' && initialState.twcBalance !== '0.00') {
+                setTwcBalance(initialState.twcBalance);
+                setUsdValueStable(initialState.usdValue ?? null);
+            }
+            else {
+                const cached = loadTWCBalanceFromCache(initialState.account.address);
+                if (cached?.balance) {
+                    setTwcBalance(cached.balance);
+                    setUsdValueStable(cached.usdValue);
+                }
+            }
+            // Since we have hydrated from cache, avoid showing the loading state
+            setIsInitializing(false);
+            setBalanceLoading(false);
+        }
         // Safety: Clear isConnecting on mount (in case it was stuck from previous session)
         setIsConnecting(false);
         // Only set wallets once to prevent re-renders
@@ -7932,29 +7941,8 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                         setIsInitializing(false);
                     }
                 }
-                else if (acc && fetchBalance) {
-                    try {
-                        setBalanceLoading(true);
-                        const hasRealBalance = await loadBalance();
-                        if (!isMounted)
-                            return;
-                        // Always stop loading state after balance fetch
-                        setBalanceLoading(false);
-                        clearTimeout(safetyTimeout);
-                        // Always stop initializing after balance fetch completes, regardless of result
-                        setIsInitializing(false);
-                    }
-                    catch (err) {
-                        if (!isMounted)
-                            return;
-                        setBalanceLoading(false);
-                        clearTimeout(safetyTimeout);
-                        // Always stop initializing on error
-                        setIsInitializing(false);
-                    }
-                }
                 else {
-                    // If no fetchBalance, check if we have real TWC balance (not 0)
+                    // Check if we have real TWC balance (not 0)
                     const state = connector.getState();
                     const stateTwcBalance = state.twcBalance;
                     if (acc && stateTwcBalance && stateTwcBalance !== '0' && stateTwcBalance !== '0.00') {
@@ -8011,7 +7999,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                                 });
                             }
                             else {
-                                // Non-EVM (TON, Solana, Tron), check if we have fetchBalance
+                                // Non-EVM (TON, Solana, Tron)
                                 if (acc.chainType === 'ton') {
                                     // For TON: fetch both balance and NFTs
                                     setTwcBalance('0'); // TON wallets don't have TWC
@@ -8030,8 +8018,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                                         setIsInitializing(false);
                                     });
                                 }
-                                else if (fetchBalance) {
-                                    // For other non-EVM chains: If fetchBalance is provided, load balance and then stop initializing
+                                else {
                                     fetchTWCBalanceWithRetry(1, 100).then((result) => {
                                         if (!isMounted)
                                             return;
@@ -8053,14 +8040,6 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                                         setIsInitializing(false);
                                     });
                                 }
-                                else {
-                                    if (!isMounted)
-                                        return;
-                                    // No fetchBalance and no cached balance - stop initializing with 0 balance
-                                    setTwcBalance('0');
-                                    clearTimeout(safetyTimeout);
-                                    setIsInitializing(false);
-                                }
                             }
                         }
                     }
@@ -8168,23 +8147,8 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                     setIsInitializing(false);
                 }
             }
-            else if (acc && fetchBalance) {
-                setBalanceLoading(true);
-                try {
-                    await loadBalance();
-                    if (!isMounted)
-                        return;
-                    setIsInitializing(false);
-                }
-                catch (err) {
-                    if (!isMounted)
-                        return;
-                    setIsInitializing(false);
-                    setBalanceLoading(false);
-                }
-            }
             else if (acc) {
-                // No fetchBalance, check for TWC balance
+                // Check for TWC balance
                 const state = connector.getState();
                 if (state.twcBalance && state.twcBalance !== '0' && state.twcBalance !== '0.00') {
                     setTwcBalance(state.twcBalance);
@@ -8295,10 +8259,6 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                 }
                 setIsInitializing(false);
             }
-            // Also update balance if fetchBalance is provided
-            if (fetchBalance && account && data?.type === 'NATIVE') {
-                loadBalance();
-            }
         });
         return () => {
             isMounted = false;
@@ -8310,7 +8270,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
             unsubscribeBalance();
         };
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [connector, onConnect, onDisconnect, onError, fetchBalance]);
+    }, [connector, onConnect, onDisconnect, onError]);
     // Robust TWC balance fetcher with retry logic - optimized for speed
     // Fetch TON NFTs with caching
     const fetchTONNFTs = React.useCallback(async (acc) => {
@@ -8448,27 +8408,8 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
     // Load balance when account changes
     React.useEffect(() => {
         let isActive = true;
-        if (account && fetchBalance) {
-            setBalanceLoading(true);
-            loadBalance()
-                .then(() => {
-                if (!isActive)
-                    return;
-                // Always stop initializing once balance request completes
-            })
-                .catch(() => {
-                if (!isActive)
-                    return;
-                // Ignore errors, we still clear loading states
-            })
-                .finally(() => {
-                if (!isActive)
-                    return;
-                setBalanceLoading(false);
-                setIsInitializing(false);
-            });
-        }
-        else if (account && !fetchBalance) {
+        console.log('[ConnectButton] useEffect: account changed', { account });
+        if (account) {
             // For EVM wallets, try to get TWC balance
             if (account.chainType === 'evm') {
                 // First check state/cache for immediate display
@@ -8495,6 +8436,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                 }
                 // Only fetch if we don't have a balance yet
                 if (!hasBalance) {
+                    console.log('[ConnectButton] Fetching TWC balance for EVM wallet:', account.address);
                     fetchTWCBalanceWithRetry(2, 200).then((result) => {
                         if (!isActive)
                             return;
@@ -8505,17 +8447,20 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                                 saveTWCBalanceToCache(account.address, result.balance, result.usdValue);
                             }
                             setIsInitializing(false);
+                            console.log('[ConnectButton] TWC balance fetched:', result);
                         }
                         else {
                             // Final fallback
                             setTwcBalance('0');
                             setUsdValueStable(null);
                             setIsInitializing(false);
+                            console.warn('[ConnectButton] No TWC balance found for EVM wallet:', account.address);
                         }
                     }).catch(() => {
                         if (!isActive)
                             return;
                         setIsInitializing(false);
+                        console.error('[ConnectButton] Error fetching TWC balance for EVM wallet:', account.address);
                     });
                 }
             }
@@ -8539,7 +8484,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
             isActive = false;
         };
         // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [account?.address, fetchBalance]);
+    }, [account?.address]);
     // Polling mechanism as fallback to ensure TWC balance is always fetched
     React.useEffect(() => {
         if (!account || account.chainType !== 'evm') {
@@ -8652,7 +8597,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
                 setShowModal(true);
             }
         }
-    }, [connector, fetchBalance, loadBalance]);
+    }, [connector, loadBalance]);
     const handleDisconnect = React.useCallback(async () => {
         try {
             // Close all modals first
@@ -8736,18 +8681,9 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
         // For TON: treat as resolved after fetch completes (even if 0). For others: treat zero/empty as resolved.
         (balance.amount && balance.amount !== '0' && balance.amount !== '0.00' && balance.amount !== '' && balance.amount !== 'Loading...') ||
             (twcBalance && twcBalance !== '0' && twcBalance !== '0.00' && twcBalance !== '' && twcBalance !== 'Loading...');
-        let isBalanceResolved;
-        if (account?.chainType === 'ton') {
-            // For TON, resolved if not loading or initializing
-            isBalanceResolved = !balanceLoading && !isInitializing;
-        }
-        else {
-            // For EVM, Solana, Tron: resolved if not loading (even if balance is zero)
-            isBalanceResolved = !balanceLoading && !isInitializing;
-        }
-        const waitingForBalance = account && !isBalanceResolved;
-        const isCheckingConnection = isInitializing || waitingForBalance || ((status === exports.ConnectionStatus.CONNECTING || isConnecting) && !account);
-        const isActuallyConnecting = (status === exports.ConnectionStatus.CONNECTING || isConnecting) && account && isBalanceResolved;
+        // Treat balance loading as background; only gate on initial connection.
+        const isCheckingConnection = isInitializing || ((status === exports.ConnectionStatus.CONNECTING || isConnecting) && !account);
+        const isActuallyConnecting = (status === exports.ConnectionStatus.CONNECTING || isConnecting) && !!account && !isInitializing;
         // Check connection state
         if (isCheckingConnection) {
             // Show loading connected button structure while checking connection

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "tiwiflix-wallet-connector",
-  "version": "1.5.6",
+  "version": "1.5.8",
   "description": "Multi-chain wallet connector for Tiwiflix supporting EVM, TON, Solana, and Tron wallets",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",