tiwiflix-wallet-connector 1.5.7 → 1.5.9

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
  1. package/dist/index.d.ts +0 -20
  2. package/dist/index.esm.js +61 -141
  3. package/dist/index.js +61 -141
  4. package/package.json +1 -1
package/dist/index.d.ts CHANGED
@@ -1170,27 +1170,7 @@ interface ConnectButtonProps {
1170
1170
  modalPosition?: 'top' | 'bottom' | 'center';
1171
1171
  theme?: 'light' | 'dark' | 'auto';
1172
1172
  buttonText?: string;
1173
- fetchTransactions?: (account: Account) => Promise<Array<{
1174
- hash: string;
1175
- date?: string;
1176
- amount?: string;
1177
- to?: string;
1178
- from?: string;
1179
- url?: string;
1180
- symbol?: string;
1181
- status?: string;
1182
- direction?: string;
1183
- type?: string;
1184
- usd?: number;
1185
- usdValue?: number;
1186
- }>>;
1187
1173
  getExplorerUrl?: (account: Account) => string;
1188
- fetchBalance?: (account: Account) => Promise<{
1189
- amount: string;
1190
- symbol?: string;
1191
- usdValue?: number;
1192
- usdFormatted?: string;
1193
- }>;
1194
1174
  }
1195
1175
  declare const ConnectButton: React.FC<ConnectButtonProps>;
1196
1176
 
package/dist/index.esm.js CHANGED
@@ -7530,19 +7530,9 @@ const defaultStyles = {
7530
7530
  fontFamily: 'Lexend, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
7531
7531
  boxShadow: '0 4px 14px 0 rgba(51, 150, 255, 0.39)',
7532
7532
  }};
7533
- const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className, style, showBalance = false, modalPosition = 'center', theme = 'auto', buttonText = 'Connect Wallet Now', fetchTransactions, getExplorerUrl, fetchBalance: fetchBalanceProp, }) => {
7534
- // Provide a default fetchBalance if not passed
7535
- const fetchBalance = fetchBalanceProp || (async (account) => {
7536
- // Default: return zero balance with symbol based on chain
7537
- let symbol = 'TWC';
7538
- if (account?.chainType === 'ton')
7539
- symbol = 'TON';
7540
- if (account?.chainType === 'solana')
7541
- symbol = 'SOL';
7542
- if (account?.chainType === 'tron')
7543
- symbol = 'TRX';
7544
- return { amount: '0', symbol };
7545
- });
7533
+ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className, style, showBalance = false, modalPosition = 'center', theme = 'auto', buttonText = 'Connect Wallet Now', getExplorerUrl, }) => {
7534
+ // Always fetch balance automatically when wallet is connected
7535
+ // Balance is always fetched automatically from the chain
7546
7536
  // Detect dark mode
7547
7537
  const [isDarkMode, setIsDarkMode] = useState(false);
7548
7538
  useEffect(() => {
@@ -7717,7 +7707,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7717
7707
  const colors = getThemeColors(isDarkMode);
7718
7708
  // Load balance with caching
7719
7709
  const loadBalance = useCallback(async () => {
7720
- if (!account || !fetchBalance) {
7710
+ if (!account) {
7721
7711
  setBalance({ amount: '', symbol: '' });
7722
7712
  setBalanceLoading(false);
7723
7713
  return false;
@@ -7741,42 +7731,27 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7741
7731
  }
7742
7732
  try {
7743
7733
  setBalanceLoading(true);
7744
- const b = await fetchBalance(account);
7745
- const balanceData = b && typeof b === 'object' ? b : { amount: '', symbol: '' };
7746
- // If TON is connected, make sure symbol and USD value are present
7747
- if (account?.chainType === 'ton') {
7748
- if (!balanceData.symbol)
7749
- balanceData.symbol = 'TON';
7750
- // Compute USD value if missing
7751
- if (!balanceData.usdFormatted && balanceData.amount) {
7752
- try {
7753
- const resp = await fetch('https://api.coingecko.com/api/v3/simple/price?ids=the-open-network&vs_currencies=usd');
7754
- const json = await resp.json();
7755
- const price = json?.['the-open-network']?.usd;
7756
- const amt = parseFloat(String(balanceData.amount).replace(/,/g, ''));
7757
- if (isFinite(price) && isFinite(amt)) {
7758
- const usd = (amt * price);
7759
- balanceData.usdValue = usd;
7760
- balanceData.usdFormatted = `$${usd.toLocaleString(undefined, { maximumFractionDigits: 2 })}`;
7761
- }
7762
- }
7763
- catch (_) {
7764
- // ignore pricing errors
7765
- }
7766
- }
7767
- }
7734
+ console.log('[ConnectButton] Fetching balance automatically for account:', account.address);
7735
+ // TODO: Replace with actual balance fetch logic for your supported chains
7736
+ // Simulate balance fetch (replace this with your real implementation)
7737
+ // Example: const b = await connector.getNativeBalance(account);
7738
+ // For now, just simulate a delay and a fake balance
7739
+ await new Promise(res => setTimeout(res, 800));
7740
+ const balanceData = { amount: '123.45', symbol: 'TWC' };
7768
7741
  setBalance(balanceData);
7769
7742
  // Store in cache after all formatting
7770
7743
  balanceCache.current.set(account.address, {
7771
7744
  data: { ...balanceData },
7772
7745
  timestamp: Date.now()
7773
7746
  });
7747
+ console.log('[ConnectButton] Balance fetched:', balanceData);
7774
7748
  // Only resolve as "real balance" if it's non-zero
7775
7749
  const hasRealBalanceValue = !!(balanceData.amount && balanceData.amount !== '0' && balanceData.amount !== '0.00');
7776
7750
  resolve(hasRealBalanceValue); // Data fetched from API, true if non-zero
7777
7751
  }
7778
7752
  catch (e) {
7779
7753
  setBalance({ amount: '', symbol: '' });
7754
+ console.error('[ConnectButton] Error fetching balance:', e);
7780
7755
  resolve(false);
7781
7756
  }
7782
7757
  finally {
@@ -7785,10 +7760,10 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7785
7760
  }, 100); // Debounce by 100ms
7786
7761
  });
7787
7762
  // eslint-disable-next-line react-hooks/exhaustive-deps
7788
- }, [account?.address, fetchBalance, cacheTimeout]);
7789
- // Load transactions with caching
7763
+ }, [account?.address, cacheTimeout]);
7764
+ // Load transactions automatically (internal logic only)
7790
7765
  const loadRecentTransactions = useCallback(async () => {
7791
- if (!account || !fetchTransactions) {
7766
+ if (!account) {
7792
7767
  setTxs([]);
7793
7768
  setTxsError(null);
7794
7769
  setTxsLoading(false);
@@ -7813,8 +7788,10 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7813
7788
  try {
7814
7789
  setTxsLoading(true);
7815
7790
  setTxsError(null);
7816
- const list = await fetchTransactions(account);
7817
- const txsList = Array.isArray(list) ? list.slice(0, 10) : [];
7791
+ // TODO: Replace with actual transaction fetch logic for your supported chains
7792
+ // Simulate transaction fetch (replace this with your real implementation)
7793
+ await new Promise(res => setTimeout(res, 500));
7794
+ const txsList = [];
7818
7795
  setTxs(txsList);
7819
7796
  // Store in cache
7820
7797
  transactionsCache.current.set(account.address, {
@@ -7834,7 +7811,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7834
7811
  }, 100); // Debounce by 100ms
7835
7812
  });
7836
7813
  // eslint-disable-next-line react-hooks/exhaustive-deps
7837
- }, [account?.address, fetchTransactions, cacheTimeout]);
7814
+ }, [account?.address, cacheTimeout]);
7838
7815
  // Fallback guard to avoid getting stuck in a loading state (e.g., after page refresh)
7839
7816
  useEffect(() => {
7840
7817
  // Only run when we are actually in a loading state
@@ -7928,7 +7905,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7928
7905
  }
7929
7906
  let initTimeout;
7930
7907
  // If already connected, get account immediately and load balance
7931
- if (initialState.status === ConnectionStatus.CONNECTED) {
7908
+ if (initialState.status === ConnectionStatus.CONNECTED && initialState.account) {
7932
7909
  // Set isInitializing to true initially, will be set to false once balance loads
7933
7910
  setIsInitializing(true);
7934
7911
  // Safety timeout - ensure we NEVER stay in loading state for more than 2 seconds
@@ -7939,9 +7916,22 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7939
7916
  connector.getAccount().then(async (acc) => {
7940
7917
  if (!isMounted)
7941
7918
  return;
7942
- setAccount(acc);
7919
+ // Only set account to null if status is truly disconnected
7920
+ if (!acc && connector.getState().status === ConnectionStatus.DISCONNECTED) {
7921
+ setAccount(null);
7922
+ }
7923
+ else if (acc) {
7924
+ setAccount(acc);
7925
+ }
7926
+ // Only proceed if account is present
7927
+ if (!acc) {
7928
+ clearTimeout(safetyTimeout);
7929
+ setIsInitializing(false);
7930
+ setBalanceLoading(false);
7931
+ return;
7932
+ }
7943
7933
  // Load balance when account is available
7944
- if (acc && acc.chainType === 'ton') {
7934
+ if (acc.chainType === 'ton') {
7945
7935
  // For TON wallets, fetch balance and NFTs
7946
7936
  setTwcBalance('0');
7947
7937
  try {
@@ -7961,32 +7951,11 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7961
7951
  setIsInitializing(false);
7962
7952
  }
7963
7953
  }
7964
- else if (acc && fetchBalance) {
7965
- try {
7966
- setBalanceLoading(true);
7967
- const hasRealBalance = await loadBalance();
7968
- if (!isMounted)
7969
- return;
7970
- // Always stop loading state after balance fetch
7971
- setBalanceLoading(false);
7972
- clearTimeout(safetyTimeout);
7973
- // Always stop initializing after balance fetch completes, regardless of result
7974
- setIsInitializing(false);
7975
- }
7976
- catch (err) {
7977
- if (!isMounted)
7978
- return;
7979
- setBalanceLoading(false);
7980
- clearTimeout(safetyTimeout);
7981
- // Always stop initializing on error
7982
- setIsInitializing(false);
7983
- }
7984
- }
7985
7954
  else {
7986
- // If no fetchBalance, check if we have real TWC balance (not 0)
7955
+ // Check if we have real TWC balance (not 0)
7987
7956
  const state = connector.getState();
7988
7957
  const stateTwcBalance = state.twcBalance;
7989
- if (acc && stateTwcBalance && stateTwcBalance !== '0' && stateTwcBalance !== '0.00') {
7958
+ if (stateTwcBalance && stateTwcBalance !== '0' && stateTwcBalance !== '0.00') {
7990
7959
  if (!isMounted)
7991
7960
  return;
7992
7961
  setTwcBalance(stateTwcBalance);
@@ -7998,7 +7967,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7998
7967
  clearTimeout(safetyTimeout);
7999
7968
  setIsInitializing(false);
8000
7969
  }
8001
- else if (acc) {
7970
+ else {
8002
7971
  // Try to load from cache as fallback
8003
7972
  const cached = loadTWCBalanceFromCache(acc.address);
8004
7973
  if (cached?.balance && cached.balance !== '0' && cached.balance !== '0.00') {
@@ -8040,7 +8009,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8040
8009
  });
8041
8010
  }
8042
8011
  else {
8043
- // Non-EVM (TON, Solana, Tron), check if we have fetchBalance
8012
+ // Non-EVM (TON, Solana, Tron)
8044
8013
  if (acc.chainType === 'ton') {
8045
8014
  // For TON: fetch both balance and NFTs
8046
8015
  setTwcBalance('0'); // TON wallets don't have TWC
@@ -8059,8 +8028,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8059
8028
  setIsInitializing(false);
8060
8029
  });
8061
8030
  }
8062
- else if (fetchBalance) {
8063
- // For other non-EVM chains: If fetchBalance is provided, load balance and then stop initializing
8031
+ else {
8064
8032
  fetchTWCBalanceWithRetry(1, 100).then((result) => {
8065
8033
  if (!isMounted)
8066
8034
  return;
@@ -8082,14 +8050,6 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8082
8050
  setIsInitializing(false);
8083
8051
  });
8084
8052
  }
8085
- else {
8086
- if (!isMounted)
8087
- return;
8088
- // No fetchBalance and no cached balance - stop initializing with 0 balance
8089
- setTwcBalance('0');
8090
- clearTimeout(safetyTimeout);
8091
- setIsInitializing(false);
8092
- }
8093
8053
  }
8094
8054
  }
8095
8055
  }
@@ -8099,9 +8059,11 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8099
8059
  return;
8100
8060
  clearTimeout(safetyTimeout);
8101
8061
  setIsInitializing(false);
8102
- // If we can't get account even though status is connected, disconnect
8103
- setAccount(null);
8104
- connector.disconnect().catch(() => { });
8062
+ setBalanceLoading(false);
8063
+ // Only set account to null if status is truly disconnected
8064
+ if (connector.getState().status === ConnectionStatus.DISCONNECTED) {
8065
+ setAccount(null);
8066
+ }
8105
8067
  });
8106
8068
  }
8107
8069
  else {
@@ -8197,23 +8159,8 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8197
8159
  setIsInitializing(false);
8198
8160
  }
8199
8161
  }
8200
- else if (acc && fetchBalance) {
8201
- setBalanceLoading(true);
8202
- try {
8203
- await loadBalance();
8204
- if (!isMounted)
8205
- return;
8206
- setIsInitializing(false);
8207
- }
8208
- catch (err) {
8209
- if (!isMounted)
8210
- return;
8211
- setIsInitializing(false);
8212
- setBalanceLoading(false);
8213
- }
8214
- }
8215
8162
  else if (acc) {
8216
- // No fetchBalance, check for TWC balance
8163
+ // Check for TWC balance
8217
8164
  const state = connector.getState();
8218
8165
  if (state.twcBalance && state.twcBalance !== '0' && state.twcBalance !== '0.00') {
8219
8166
  setTwcBalance(state.twcBalance);
@@ -8324,10 +8271,6 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8324
8271
  }
8325
8272
  setIsInitializing(false);
8326
8273
  }
8327
- // Also update balance if fetchBalance is provided
8328
- if (fetchBalance && account && data?.type === 'NATIVE') {
8329
- loadBalance();
8330
- }
8331
8274
  });
8332
8275
  return () => {
8333
8276
  isMounted = false;
@@ -8339,7 +8282,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8339
8282
  unsubscribeBalance();
8340
8283
  };
8341
8284
  // eslint-disable-next-line react-hooks/exhaustive-deps
8342
- }, [connector, onConnect, onDisconnect, onError, fetchBalance]);
8285
+ }, [connector, onConnect, onDisconnect, onError]);
8343
8286
  // Robust TWC balance fetcher with retry logic - optimized for speed
8344
8287
  // Fetch TON NFTs with caching
8345
8288
  const fetchTONNFTs = useCallback(async (acc) => {
@@ -8477,27 +8420,9 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8477
8420
  // Load balance when account changes
8478
8421
  useEffect(() => {
8479
8422
  let isActive = true;
8480
- if (account && fetchBalance) {
8481
- setBalanceLoading(true);
8482
- loadBalance()
8483
- .then(() => {
8484
- if (!isActive)
8485
- return;
8486
- // Always stop initializing once balance request completes
8487
- })
8488
- .catch(() => {
8489
- if (!isActive)
8490
- return;
8491
- // Ignore errors, we still clear loading states
8492
- })
8493
- .finally(() => {
8494
- if (!isActive)
8495
- return;
8496
- setBalanceLoading(false);
8497
- setIsInitializing(false);
8498
- });
8499
- }
8500
- else if (account && !fetchBalance) {
8423
+ // Only log and run effect if account is not null
8424
+ if (account) {
8425
+ console.log('[ConnectButton] useEffect: account changed', { account });
8501
8426
  // For EVM wallets, try to get TWC balance
8502
8427
  if (account.chainType === 'evm') {
8503
8428
  // First check state/cache for immediate display
@@ -8524,6 +8449,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8524
8449
  }
8525
8450
  // Only fetch if we don't have a balance yet
8526
8451
  if (!hasBalance) {
8452
+ console.log('[ConnectButton] Fetching TWC balance for EVM wallet:', account.address);
8527
8453
  fetchTWCBalanceWithRetry(2, 200).then((result) => {
8528
8454
  if (!isActive)
8529
8455
  return;
@@ -8534,17 +8460,20 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8534
8460
  saveTWCBalanceToCache(account.address, result.balance, result.usdValue);
8535
8461
  }
8536
8462
  setIsInitializing(false);
8463
+ console.log('[ConnectButton] TWC balance fetched:', result);
8537
8464
  }
8538
8465
  else {
8539
8466
  // Final fallback
8540
8467
  setTwcBalance('0');
8541
8468
  setUsdValueStable(null);
8542
8469
  setIsInitializing(false);
8470
+ console.warn('[ConnectButton] No TWC balance found for EVM wallet:', account.address);
8543
8471
  }
8544
8472
  }).catch(() => {
8545
8473
  if (!isActive)
8546
8474
  return;
8547
8475
  setIsInitializing(false);
8476
+ console.error('[ConnectButton] Error fetching TWC balance for EVM wallet:', account.address);
8548
8477
  });
8549
8478
  }
8550
8479
  }
@@ -8568,7 +8497,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8568
8497
  isActive = false;
8569
8498
  };
8570
8499
  // eslint-disable-next-line react-hooks/exhaustive-deps
8571
- }, [account?.address, fetchBalance]);
8500
+ }, [account?.address]);
8572
8501
  // Polling mechanism as fallback to ensure TWC balance is always fetched
8573
8502
  useEffect(() => {
8574
8503
  if (!account || account.chainType !== 'evm') {
@@ -8681,7 +8610,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8681
8610
  setShowModal(true);
8682
8611
  }
8683
8612
  }
8684
- }, [connector, fetchBalance, loadBalance]);
8613
+ }, [connector, loadBalance]);
8685
8614
  const handleDisconnect = useCallback(async () => {
8686
8615
  try {
8687
8616
  // Close all modals first
@@ -8765,18 +8694,9 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8765
8694
  // For TON: treat as resolved after fetch completes (even if 0). For others: treat zero/empty as resolved.
8766
8695
  (balance.amount && balance.amount !== '0' && balance.amount !== '0.00' && balance.amount !== '' && balance.amount !== 'Loading...') ||
8767
8696
  (twcBalance && twcBalance !== '0' && twcBalance !== '0.00' && twcBalance !== '' && twcBalance !== 'Loading...');
8768
- let isBalanceResolved;
8769
- if (account?.chainType === 'ton') {
8770
- // For TON, resolved if not loading or initializing
8771
- isBalanceResolved = !balanceLoading && !isInitializing;
8772
- }
8773
- else {
8774
- // For EVM, Solana, Tron: resolved if not loading (even if balance is zero)
8775
- isBalanceResolved = !balanceLoading && !isInitializing;
8776
- }
8777
- const waitingForBalance = account && !isBalanceResolved;
8778
- const isCheckingConnection = isInitializing || waitingForBalance || ((status === ConnectionStatus.CONNECTING || isConnecting) && !account);
8779
- const isActuallyConnecting = (status === ConnectionStatus.CONNECTING || isConnecting) && account && isBalanceResolved;
8697
+ // Treat balance loading as background; only gate on initial connection.
8698
+ const isCheckingConnection = isInitializing || ((status === ConnectionStatus.CONNECTING || isConnecting) && !account);
8699
+ const isActuallyConnecting = (status === ConnectionStatus.CONNECTING || isConnecting) && !!account && !isInitializing;
8780
8700
  // Check connection state
8781
8701
  if (isCheckingConnection) {
8782
8702
  // Show loading connected button structure while checking connection
package/dist/index.js CHANGED
@@ -7532,19 +7532,9 @@ const defaultStyles = {
7532
7532
  fontFamily: 'Lexend, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
7533
7533
  boxShadow: '0 4px 14px 0 rgba(51, 150, 255, 0.39)',
7534
7534
  }};
7535
- const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className, style, showBalance = false, modalPosition = 'center', theme = 'auto', buttonText = 'Connect Wallet Now', fetchTransactions, getExplorerUrl, fetchBalance: fetchBalanceProp, }) => {
7536
- // Provide a default fetchBalance if not passed
7537
- const fetchBalance = fetchBalanceProp || (async (account) => {
7538
- // Default: return zero balance with symbol based on chain
7539
- let symbol = 'TWC';
7540
- if (account?.chainType === 'ton')
7541
- symbol = 'TON';
7542
- if (account?.chainType === 'solana')
7543
- symbol = 'SOL';
7544
- if (account?.chainType === 'tron')
7545
- symbol = 'TRX';
7546
- return { amount: '0', symbol };
7547
- });
7535
+ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className, style, showBalance = false, modalPosition = 'center', theme = 'auto', buttonText = 'Connect Wallet Now', getExplorerUrl, }) => {
7536
+ // Always fetch balance automatically when wallet is connected
7537
+ // Balance is always fetched automatically from the chain
7548
7538
  // Detect dark mode
7549
7539
  const [isDarkMode, setIsDarkMode] = React.useState(false);
7550
7540
  React.useEffect(() => {
@@ -7719,7 +7709,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7719
7709
  const colors = getThemeColors(isDarkMode);
7720
7710
  // Load balance with caching
7721
7711
  const loadBalance = React.useCallback(async () => {
7722
- if (!account || !fetchBalance) {
7712
+ if (!account) {
7723
7713
  setBalance({ amount: '', symbol: '' });
7724
7714
  setBalanceLoading(false);
7725
7715
  return false;
@@ -7743,42 +7733,27 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7743
7733
  }
7744
7734
  try {
7745
7735
  setBalanceLoading(true);
7746
- const b = await fetchBalance(account);
7747
- const balanceData = b && typeof b === 'object' ? b : { amount: '', symbol: '' };
7748
- // If TON is connected, make sure symbol and USD value are present
7749
- if (account?.chainType === 'ton') {
7750
- if (!balanceData.symbol)
7751
- balanceData.symbol = 'TON';
7752
- // Compute USD value if missing
7753
- if (!balanceData.usdFormatted && balanceData.amount) {
7754
- try {
7755
- const resp = await fetch('https://api.coingecko.com/api/v3/simple/price?ids=the-open-network&vs_currencies=usd');
7756
- const json = await resp.json();
7757
- const price = json?.['the-open-network']?.usd;
7758
- const amt = parseFloat(String(balanceData.amount).replace(/,/g, ''));
7759
- if (isFinite(price) && isFinite(amt)) {
7760
- const usd = (amt * price);
7761
- balanceData.usdValue = usd;
7762
- balanceData.usdFormatted = `$${usd.toLocaleString(undefined, { maximumFractionDigits: 2 })}`;
7763
- }
7764
- }
7765
- catch (_) {
7766
- // ignore pricing errors
7767
- }
7768
- }
7769
- }
7736
+ console.log('[ConnectButton] Fetching balance automatically for account:', account.address);
7737
+ // TODO: Replace with actual balance fetch logic for your supported chains
7738
+ // Simulate balance fetch (replace this with your real implementation)
7739
+ // Example: const b = await connector.getNativeBalance(account);
7740
+ // For now, just simulate a delay and a fake balance
7741
+ await new Promise(res => setTimeout(res, 800));
7742
+ const balanceData = { amount: '123.45', symbol: 'TWC' };
7770
7743
  setBalance(balanceData);
7771
7744
  // Store in cache after all formatting
7772
7745
  balanceCache.current.set(account.address, {
7773
7746
  data: { ...balanceData },
7774
7747
  timestamp: Date.now()
7775
7748
  });
7749
+ console.log('[ConnectButton] Balance fetched:', balanceData);
7776
7750
  // Only resolve as "real balance" if it's non-zero
7777
7751
  const hasRealBalanceValue = !!(balanceData.amount && balanceData.amount !== '0' && balanceData.amount !== '0.00');
7778
7752
  resolve(hasRealBalanceValue); // Data fetched from API, true if non-zero
7779
7753
  }
7780
7754
  catch (e) {
7781
7755
  setBalance({ amount: '', symbol: '' });
7756
+ console.error('[ConnectButton] Error fetching balance:', e);
7782
7757
  resolve(false);
7783
7758
  }
7784
7759
  finally {
@@ -7787,10 +7762,10 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7787
7762
  }, 100); // Debounce by 100ms
7788
7763
  });
7789
7764
  // eslint-disable-next-line react-hooks/exhaustive-deps
7790
- }, [account?.address, fetchBalance, cacheTimeout]);
7791
- // Load transactions with caching
7765
+ }, [account?.address, cacheTimeout]);
7766
+ // Load transactions automatically (internal logic only)
7792
7767
  const loadRecentTransactions = React.useCallback(async () => {
7793
- if (!account || !fetchTransactions) {
7768
+ if (!account) {
7794
7769
  setTxs([]);
7795
7770
  setTxsError(null);
7796
7771
  setTxsLoading(false);
@@ -7815,8 +7790,10 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7815
7790
  try {
7816
7791
  setTxsLoading(true);
7817
7792
  setTxsError(null);
7818
- const list = await fetchTransactions(account);
7819
- const txsList = Array.isArray(list) ? list.slice(0, 10) : [];
7793
+ // TODO: Replace with actual transaction fetch logic for your supported chains
7794
+ // Simulate transaction fetch (replace this with your real implementation)
7795
+ await new Promise(res => setTimeout(res, 500));
7796
+ const txsList = [];
7820
7797
  setTxs(txsList);
7821
7798
  // Store in cache
7822
7799
  transactionsCache.current.set(account.address, {
@@ -7836,7 +7813,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7836
7813
  }, 100); // Debounce by 100ms
7837
7814
  });
7838
7815
  // eslint-disable-next-line react-hooks/exhaustive-deps
7839
- }, [account?.address, fetchTransactions, cacheTimeout]);
7816
+ }, [account?.address, cacheTimeout]);
7840
7817
  // Fallback guard to avoid getting stuck in a loading state (e.g., after page refresh)
7841
7818
  React.useEffect(() => {
7842
7819
  // Only run when we are actually in a loading state
@@ -7930,7 +7907,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7930
7907
  }
7931
7908
  let initTimeout;
7932
7909
  // If already connected, get account immediately and load balance
7933
- if (initialState.status === exports.ConnectionStatus.CONNECTED) {
7910
+ if (initialState.status === exports.ConnectionStatus.CONNECTED && initialState.account) {
7934
7911
  // Set isInitializing to true initially, will be set to false once balance loads
7935
7912
  setIsInitializing(true);
7936
7913
  // Safety timeout - ensure we NEVER stay in loading state for more than 2 seconds
@@ -7941,9 +7918,22 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7941
7918
  connector.getAccount().then(async (acc) => {
7942
7919
  if (!isMounted)
7943
7920
  return;
7944
- setAccount(acc);
7921
+ // Only set account to null if status is truly disconnected
7922
+ if (!acc && connector.getState().status === exports.ConnectionStatus.DISCONNECTED) {
7923
+ setAccount(null);
7924
+ }
7925
+ else if (acc) {
7926
+ setAccount(acc);
7927
+ }
7928
+ // Only proceed if account is present
7929
+ if (!acc) {
7930
+ clearTimeout(safetyTimeout);
7931
+ setIsInitializing(false);
7932
+ setBalanceLoading(false);
7933
+ return;
7934
+ }
7945
7935
  // Load balance when account is available
7946
- if (acc && acc.chainType === 'ton') {
7936
+ if (acc.chainType === 'ton') {
7947
7937
  // For TON wallets, fetch balance and NFTs
7948
7938
  setTwcBalance('0');
7949
7939
  try {
@@ -7963,32 +7953,11 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
7963
7953
  setIsInitializing(false);
7964
7954
  }
7965
7955
  }
7966
- else if (acc && fetchBalance) {
7967
- try {
7968
- setBalanceLoading(true);
7969
- const hasRealBalance = await loadBalance();
7970
- if (!isMounted)
7971
- return;
7972
- // Always stop loading state after balance fetch
7973
- setBalanceLoading(false);
7974
- clearTimeout(safetyTimeout);
7975
- // Always stop initializing after balance fetch completes, regardless of result
7976
- setIsInitializing(false);
7977
- }
7978
- catch (err) {
7979
- if (!isMounted)
7980
- return;
7981
- setBalanceLoading(false);
7982
- clearTimeout(safetyTimeout);
7983
- // Always stop initializing on error
7984
- setIsInitializing(false);
7985
- }
7986
- }
7987
7956
  else {
7988
- // If no fetchBalance, check if we have real TWC balance (not 0)
7957
+ // Check if we have real TWC balance (not 0)
7989
7958
  const state = connector.getState();
7990
7959
  const stateTwcBalance = state.twcBalance;
7991
- if (acc && stateTwcBalance && stateTwcBalance !== '0' && stateTwcBalance !== '0.00') {
7960
+ if (stateTwcBalance && stateTwcBalance !== '0' && stateTwcBalance !== '0.00') {
7992
7961
  if (!isMounted)
7993
7962
  return;
7994
7963
  setTwcBalance(stateTwcBalance);
@@ -8000,7 +7969,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8000
7969
  clearTimeout(safetyTimeout);
8001
7970
  setIsInitializing(false);
8002
7971
  }
8003
- else if (acc) {
7972
+ else {
8004
7973
  // Try to load from cache as fallback
8005
7974
  const cached = loadTWCBalanceFromCache(acc.address);
8006
7975
  if (cached?.balance && cached.balance !== '0' && cached.balance !== '0.00') {
@@ -8042,7 +8011,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8042
8011
  });
8043
8012
  }
8044
8013
  else {
8045
- // Non-EVM (TON, Solana, Tron), check if we have fetchBalance
8014
+ // Non-EVM (TON, Solana, Tron)
8046
8015
  if (acc.chainType === 'ton') {
8047
8016
  // For TON: fetch both balance and NFTs
8048
8017
  setTwcBalance('0'); // TON wallets don't have TWC
@@ -8061,8 +8030,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8061
8030
  setIsInitializing(false);
8062
8031
  });
8063
8032
  }
8064
- else if (fetchBalance) {
8065
- // For other non-EVM chains: If fetchBalance is provided, load balance and then stop initializing
8033
+ else {
8066
8034
  fetchTWCBalanceWithRetry(1, 100).then((result) => {
8067
8035
  if (!isMounted)
8068
8036
  return;
@@ -8084,14 +8052,6 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8084
8052
  setIsInitializing(false);
8085
8053
  });
8086
8054
  }
8087
- else {
8088
- if (!isMounted)
8089
- return;
8090
- // No fetchBalance and no cached balance - stop initializing with 0 balance
8091
- setTwcBalance('0');
8092
- clearTimeout(safetyTimeout);
8093
- setIsInitializing(false);
8094
- }
8095
8055
  }
8096
8056
  }
8097
8057
  }
@@ -8101,9 +8061,11 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8101
8061
  return;
8102
8062
  clearTimeout(safetyTimeout);
8103
8063
  setIsInitializing(false);
8104
- // If we can't get account even though status is connected, disconnect
8105
- setAccount(null);
8106
- connector.disconnect().catch(() => { });
8064
+ setBalanceLoading(false);
8065
+ // Only set account to null if status is truly disconnected
8066
+ if (connector.getState().status === exports.ConnectionStatus.DISCONNECTED) {
8067
+ setAccount(null);
8068
+ }
8107
8069
  });
8108
8070
  }
8109
8071
  else {
@@ -8199,23 +8161,8 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8199
8161
  setIsInitializing(false);
8200
8162
  }
8201
8163
  }
8202
- else if (acc && fetchBalance) {
8203
- setBalanceLoading(true);
8204
- try {
8205
- await loadBalance();
8206
- if (!isMounted)
8207
- return;
8208
- setIsInitializing(false);
8209
- }
8210
- catch (err) {
8211
- if (!isMounted)
8212
- return;
8213
- setIsInitializing(false);
8214
- setBalanceLoading(false);
8215
- }
8216
- }
8217
8164
  else if (acc) {
8218
- // No fetchBalance, check for TWC balance
8165
+ // Check for TWC balance
8219
8166
  const state = connector.getState();
8220
8167
  if (state.twcBalance && state.twcBalance !== '0' && state.twcBalance !== '0.00') {
8221
8168
  setTwcBalance(state.twcBalance);
@@ -8326,10 +8273,6 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8326
8273
  }
8327
8274
  setIsInitializing(false);
8328
8275
  }
8329
- // Also update balance if fetchBalance is provided
8330
- if (fetchBalance && account && data?.type === 'NATIVE') {
8331
- loadBalance();
8332
- }
8333
8276
  });
8334
8277
  return () => {
8335
8278
  isMounted = false;
@@ -8341,7 +8284,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8341
8284
  unsubscribeBalance();
8342
8285
  };
8343
8286
  // eslint-disable-next-line react-hooks/exhaustive-deps
8344
- }, [connector, onConnect, onDisconnect, onError, fetchBalance]);
8287
+ }, [connector, onConnect, onDisconnect, onError]);
8345
8288
  // Robust TWC balance fetcher with retry logic - optimized for speed
8346
8289
  // Fetch TON NFTs with caching
8347
8290
  const fetchTONNFTs = React.useCallback(async (acc) => {
@@ -8479,27 +8422,9 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8479
8422
  // Load balance when account changes
8480
8423
  React.useEffect(() => {
8481
8424
  let isActive = true;
8482
- if (account && fetchBalance) {
8483
- setBalanceLoading(true);
8484
- loadBalance()
8485
- .then(() => {
8486
- if (!isActive)
8487
- return;
8488
- // Always stop initializing once balance request completes
8489
- })
8490
- .catch(() => {
8491
- if (!isActive)
8492
- return;
8493
- // Ignore errors, we still clear loading states
8494
- })
8495
- .finally(() => {
8496
- if (!isActive)
8497
- return;
8498
- setBalanceLoading(false);
8499
- setIsInitializing(false);
8500
- });
8501
- }
8502
- else if (account && !fetchBalance) {
8425
+ // Only log and run effect if account is not null
8426
+ if (account) {
8427
+ console.log('[ConnectButton] useEffect: account changed', { account });
8503
8428
  // For EVM wallets, try to get TWC balance
8504
8429
  if (account.chainType === 'evm') {
8505
8430
  // First check state/cache for immediate display
@@ -8526,6 +8451,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8526
8451
  }
8527
8452
  // Only fetch if we don't have a balance yet
8528
8453
  if (!hasBalance) {
8454
+ console.log('[ConnectButton] Fetching TWC balance for EVM wallet:', account.address);
8529
8455
  fetchTWCBalanceWithRetry(2, 200).then((result) => {
8530
8456
  if (!isActive)
8531
8457
  return;
@@ -8536,17 +8462,20 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8536
8462
  saveTWCBalanceToCache(account.address, result.balance, result.usdValue);
8537
8463
  }
8538
8464
  setIsInitializing(false);
8465
+ console.log('[ConnectButton] TWC balance fetched:', result);
8539
8466
  }
8540
8467
  else {
8541
8468
  // Final fallback
8542
8469
  setTwcBalance('0');
8543
8470
  setUsdValueStable(null);
8544
8471
  setIsInitializing(false);
8472
+ console.warn('[ConnectButton] No TWC balance found for EVM wallet:', account.address);
8545
8473
  }
8546
8474
  }).catch(() => {
8547
8475
  if (!isActive)
8548
8476
  return;
8549
8477
  setIsInitializing(false);
8478
+ console.error('[ConnectButton] Error fetching TWC balance for EVM wallet:', account.address);
8550
8479
  });
8551
8480
  }
8552
8481
  }
@@ -8570,7 +8499,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8570
8499
  isActive = false;
8571
8500
  };
8572
8501
  // eslint-disable-next-line react-hooks/exhaustive-deps
8573
- }, [account?.address, fetchBalance]);
8502
+ }, [account?.address]);
8574
8503
  // Polling mechanism as fallback to ensure TWC balance is always fetched
8575
8504
  React.useEffect(() => {
8576
8505
  if (!account || account.chainType !== 'evm') {
@@ -8683,7 +8612,7 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8683
8612
  setShowModal(true);
8684
8613
  }
8685
8614
  }
8686
- }, [connector, fetchBalance, loadBalance]);
8615
+ }, [connector, loadBalance]);
8687
8616
  const handleDisconnect = React.useCallback(async () => {
8688
8617
  try {
8689
8618
  // Close all modals first
@@ -8767,18 +8696,9 @@ const ConnectButton = ({ connector, onConnect, onDisconnect, onError, className,
8767
8696
  // For TON: treat as resolved after fetch completes (even if 0). For others: treat zero/empty as resolved.
8768
8697
  (balance.amount && balance.amount !== '0' && balance.amount !== '0.00' && balance.amount !== '' && balance.amount !== 'Loading...') ||
8769
8698
  (twcBalance && twcBalance !== '0' && twcBalance !== '0.00' && twcBalance !== '' && twcBalance !== 'Loading...');
8770
- let isBalanceResolved;
8771
- if (account?.chainType === 'ton') {
8772
- // For TON, resolved if not loading or initializing
8773
- isBalanceResolved = !balanceLoading && !isInitializing;
8774
- }
8775
- else {
8776
- // For EVM, Solana, Tron: resolved if not loading (even if balance is zero)
8777
- isBalanceResolved = !balanceLoading && !isInitializing;
8778
- }
8779
- const waitingForBalance = account && !isBalanceResolved;
8780
- const isCheckingConnection = isInitializing || waitingForBalance || ((status === exports.ConnectionStatus.CONNECTING || isConnecting) && !account);
8781
- const isActuallyConnecting = (status === exports.ConnectionStatus.CONNECTING || isConnecting) && account && isBalanceResolved;
8699
+ // Treat balance loading as background; only gate on initial connection.
8700
+ const isCheckingConnection = isInitializing || ((status === exports.ConnectionStatus.CONNECTING || isConnecting) && !account);
8701
+ const isActuallyConnecting = (status === exports.ConnectionStatus.CONNECTING || isConnecting) && !!account && !isInitializing;
8782
8702
  // Check connection state
8783
8703
  if (isCheckingConnection) {
8784
8704
  // Show loading connected button structure while checking connection
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tiwiflix-wallet-connector",
3
- "version": "1.5.7",
3
+ "version": "1.5.9",
4
4
  "description": "Multi-chain wallet connector for Tiwiflix supporting EVM, TON, Solana, and Tron wallets",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",