sdk: show error state on balance fetch failure#214
sdk: show error state on balance fetch failure#214andrewliu08 wants to merge 1 commit intomasterfrom
Conversation
…ailure When fetchBalances fails (missing clientSecret or API error), the token selection page showed infinite skeleton loading rows. Add balanceError state and retryBalances callback to useWalletFlow, and render an error message with retry button in SelectTokenPage. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
andrewliu08
force-pushed
the
wallet-balance-error-ui
branch
from
687241c to
4f5b3fc
Compare
![devin-ai-integration[bot]](https://avatars.githubusercontent.com/in/811515?s=60&v=4){kind=small}
There was a problem hiding this comment.
🟡 Stale balanceError shown instead of loading skeleton on account switch after failure
When a balance fetch fails (setting balanceError), and the user then switches wallet accounts (triggering handleAccountsChanged), the old error message is shown instead of a loading skeleton while the new account's balances are being fetched.
Root Cause
The fetchBalances function does not clear balanceError when it begins a new non-cached fetch (around line 123). Meanwhile, the handleAccountsChanged handler at useWalletFlow.ts:296-323 calls fetchBalances(updated, true) without clearing balanceError either.
In SelectTokenPage.tsx:44, the error check takes priority over the isLoading check at line 65:
if (error) { return error UI; } // line 44 — wins
if (isLoading || options === null) { ... } // line 65 — never reachedSo when isLoadingBalances=true AND balanceError is still set from a previous failed fetch for a different wallet, the user sees the stale error instead of loading skeletons.
The retryBalances callback correctly clears the error before re-fetching (useWalletFlow.ts:252), but the handleAccountsChanged and handleAccountChanged (Solana) paths at useWalletFlow.ts:296-323 and useWalletFlow.ts:336-355 do not.
Impact: After a balance fetch failure, switching accounts in the wallet extension shows the old error message instead of a loading state for the new account.
(Refers to line 123)
Was this helpful? React with 👍 or 👎 to provide feedback.
| isConnecting: boolean; | ||
| isLoadingBalances: boolean; | ||
| connectError: string | null; | ||
| balanceError: string | null; |
There was a problem hiding this comment.
why do connectError and balanceError render differently?
can we treat them symmetrically?
| setBalanceError("missing authentication"); | ||
| setIsLoadingBalances(false); | ||
| return; | ||
| } |
2 participants
Summary
balanceErrorstate andretryBalancescallback touseWalletFlowSelectTokenPageinstead of infinite skeleton rowsclientSecretis missing or API errors occur,fetchBalancesnow sets an error state instead of silently failingContext
After connecting a wallet on
/session/:id, if?cs=is missing from the URL or the API returns an error,fetchBalancessilently failed —balancesstayednullforever and the UI showed infinite skeleton loading rows. Now users see an error message with a retry button and contact support link.Test plan
/session/:id?cs=<valid>— token options load normally/session/:idwithout?cs=— error message shown instead of infinite skeletons🤖 Generated with Claude Code