fix: improve onchain checkout error handling #2300
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
- Add feeEstimationError state to layerswap hook for tracking fee estimation errors separately - Clear displayError when token or wallet selection changes - Clear displayError before sending deposit - Handle 'bridge amount too low' error with dedicated warning card - Fix race condition in fee estimation with isCurrent flag pattern - Stop showing spinner in cost breakdown when there's a fee estimation error - Hide generic error alert when dedicated warning is shown
broody
force-pushed
the
fix/onchain-checkout-error-handling
branch
from
b0a2fed to
9f150b7
Compare
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
| onError?.(e as Error); | ||
| if (isCurrent) { | ||
| setFeeEstimationError(e as Error); | ||
| } |
There was a problem hiding this comment.
Non-"too low" fee estimation errors silently hidden from users
The refactoring changed fee estimation error handling to set feeEstimationError instead of calling onError. However, only errors with "too low" in their message get a dedicated warning card. Other fee estimation errors (like network failures or rate limit errors) won't set displayError (since onError is no longer called) and won't match the "too low" check, so no error message is shown to the user. The button will be disabled and cost shows a dash, but users receive no explanation of what went wrong.
Additional Locations (1)
| useEffect(() => { | ||
| if (!swapInput) return; | ||
|
|
||
| let isCurrent = true; |
There was a problem hiding this comment.
Stale fee error disables button after switching to starknet
When switching from an external platform (ethereum, base, etc.) to starknet, feeEstimationError is never cleared. The effect at lines 505-523 doesn't clear swapInput when switching to starknet (because selectedPlatform is truthy), so the fee-fetching effect at line 526 doesn't re-run and feeEstimationError persists. Since globalDisabled checks feeEstimationError first (line 88), a stale error from a previous platform incorrectly disables the purchase button even though starknet doesn't require fee estimation.
Summary
This PR improves error handling in the onchain checkout flow for starter packs, particularly around bridging from external networks.
Changes
Error Handling Improvements:
feeEstimationErrorstate to layerswap hook for tracking fee estimation errors separately from general display errorsdisplayErrorwhen token or wallet selection changes to provide a clean slate for retriesdisplayErrorbefore sending bridge depositsisCurrentflag pattern to prevent stale requests from overwriting stateRefactoring:
pending.tsxinto smaller, focused components:base.tsx- Base pending state componentbridge.tsx- Bridge-specific pending logic with deposit pollingclaim.tsx- Claim completion componentpurchase.tsx- Purchase completion componentconfirming-transaction.tsx- Transaction confirmation componentretry.tsutility for retry logic with exponential backoffTesting
Note
Improves onchain checkout error handling (bridge fee estimation, UI states), refactors pending screens into modular components, adds a retry utility, and enables multi-network wallet selection.
feeEstimationError; suppress generic alert for "amount too low" and show a dedicated warning card; hide spinner and show dash in totals when fee estimation fails.feeEstimationErrorinto disabled state and insufficient balance logic.feeEstimationErrorstate; fix fee-estimation race withisCurrentguard; expose error through context.pending.tsxintopending/base.tsx,pending/purchase.tsx,pending/claim.tsx,pending/bridge.tsx, andpending/confirming-transaction.tsxwith shared transaction waiting and navigation.pending/index.tsxand Storybook stories to use new components.SUPPORTED_PLATFORMSand retain controller/external wallet selection UX.utils/retry.tsfor exponential backoff and use it in pending/bridge flows.Written by Cursor Bugbot for commit 9f150b7. This will update automatically on new commits. Configure here.