feat(claim): claim flow UI improvements (#432-#435) - #522
Conversation
…elet-org#435 bridgelet-org#435: Distinguish 'claimed by you' vs 'claimed by someone else' in ClaimedPanel. Uses sessionStorage to detect if this browser session performed the claim. No re-claim action is offered in either case; disputed claims link to support. bridgelet-org#434: Restyle ExpiredPanel with amber (not red) theme to visually differentiate it from FAILED. Add copy explaining funds are automatically returned to the sender. Confirm no claim action is rendered in the expired state. bridgelet-org#433: Add 'funds are moving' sweep-in-progress state (distinct from claim initiation) and a final success card showing destination address + amount. CLAIMING panel updated with clearer 'funds are moving' heading. PARTIAL_SWEEP panel shows 'finalizing' copy distinct from CLAIMING. bridgelet-org#432: Surface WalletConnect (Freighter) option alongside the manual address entry in AvailablePanel so existing-wallet holders have a first-class path. Both paths now go through a confirmation step before the sweep fires, showing the address and amount for review. WalletConnect gains an onRejected callback so wallet-connect failures are surfaced as contextual (non-alarming) messages rather than a generic error, keeping the manual entry path accessible. Tests updated in clainStatusCard.test.tsx to cover all new states and flows.
|
@halimasbanna-sketch Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits. You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀 |
|
@halimasbanna-sketch is attempting to deploy a commit to the aminubabafatima8-gmailcom's projects Team on Vercel. A member of the Team first needs to authorize it. |
|
Merged to \main\ as part of a consolidated integration (branch \merge-final, now pushed as commit \5155235\ on main). Validation on main:
Note: the Mobile CI Android/iOS native debug build jobs still fail on pre-existing repo issues unrelated to this PR (react-native-reanimated vs RN 0.81 compile error, and the macos-14 runner's Xcode 15.4 vs RN's required Xcode >= 16.1). Tracked as follow-up work, not blocked by this change. |
Summary
Resolves four issues related to the claim flow UI in
frontend/app/claim/[token]/.Changes
#435 — Already-claimed error state
ClaimedPanelinto two distinct sub-states: "claimed by you" (green success confirmation) and "claimed by someone else" (neutral informational).ClaimViewgains aclaimedByMeboolean, written tosessionStoragebymarkTokenClaimed()when a successful claim is made in the current session.loadClaimViewreadssessionStorageon a 409 response to determine which sub-state to show.#434 — Expired-link error state
ExpiredPanelnow uses an amber colour scheme (not red) to visually differentiate expiry from failures.EXPIRED.#433 — Auto-sweep confirmation UI
role="status") distinct from the initial claim step.CLAIMINGpanel updated with a "Funds are moving to your wallet" heading.PARTIAL_SWEEPpanel shows "Finalizing your transfer" copy distinct fromCLAIMING.#432 — Existing-wallet connect path
AvailablePanelnow shows WalletConnect (Freighter) alongside the manual address entry — not hidden behind a toggle.WalletConnectgains anonRejectedcallback so connection failures surface as contextual amber notices, keeping the manual path accessible.Files changed
frontend/lib/claim-view.ts— new fields +markTokenClaimed/wasClaimedByMefrontend/components/claim-status-card.tsx— updated panels for all four issuesfrontend/components/wallet-connect.tsx—onRejectedpropfrontend/app/claim/[token]/claim-page-client.tsx— passes new props, callsmarkTokenClaimedfrontend/components/clainStatusCard.test.tsx— updated and new testsCloses
Closes #432
Closes #433
Closes #434
Closes #435