Skip to content

fix(citizen-claim-widget): keep claim toast visible through on-chain confirmation - #168

Open
goodbounties-nanoclaw-agent[bot] wants to merge 2 commits into
mainfrom
fix/citizen-claim-toast-confirmation
Open

fix(citizen-claim-widget): keep claim toast visible through on-chain confirmation#168
goodbounties-nanoclaw-agent[bot] wants to merge 2 commits into
mainfrom
fix/citizen-claim-toast-confirmation

Conversation

@goodbounties-nanoclaw-agent

Copy link
Copy Markdown
Contributor

Summary

  • Toast for a chain's claim used to stay on "sign transaction in your wallet" copy forever, even after the wallet had already signed and broadcast the tx — reported by @hadar Rottenberg (screenshot showed 3 stacked signing toasts for Celo/Fuse/XDC).
  • Rather than dismissing the toast at signing time (which would hide the still-pending on-chain confirmation), the toast now updates its copy/color the moment the tx is signed+broadcast, and only actually resolves/dismisses once the claim is confirmed on-chain.
  • No @goodsdks/citizen-sdk change required — GoodWidget already owns the raw wallet provider it hands to viem's custom() transport in adapter.ts, so it can observe the eth_sendTransaction call resolving directly.

Changes

  • adapter.ts: provider-proxy helper (wrapProviderWithSubmissionSignal) detects the wallet's eth_sendTransaction resolving; threaded as an optional onTransactionSubmitted callback through claim / claimOnChain / claimAll.
  • CitizenClaimWidget.tsx: on that signal, updates each chain's toast to "Claiming on <chain> — waiting for blockchain confirmation" with a confirming status, staying persistent (duration: 0) until the claim promise settles.
  • Toast.tsx: adds a confirming ToastStatus with a subtly deeper blue border ($primaryDark vs $primary for signing) so it reads as related-but-distinct from the initial signing toast, and stays clearly different from the green success state.

Scope note

Only the default non-custodial (wallet-provider-driven) claim path is covered — the one in the bug report. Custodial execution mode (claimExecution.clientsByChain) supplies pre-built clients from outside GoodWidget, so we don't control that provider and can't intercept it the same way; flagging as a possible separate follow-up if that path is ever in scope.

Test plan

  • pnpm --filter @goodwidget/ui --filter @goodwidget/citizen-claim-widget --filter @goodwidget/superfluid-campaign-widget --filter @goodwidget/embed build — clean
  • pnpm --filter @goodwidget/ui --filter @goodwidget/citizen-claim-widget --filter @goodwidget/superfluid-campaign-widget --filter @goodwidget/embed lint — clean (only pre-existing warnings unrelated to this change)
  • Manual: connect wallet, claim on a chain, confirm toast updates from "sign transaction" -> "waiting for blockchain confirmation" -> "succeeded", never disappearing early

🤖 Generated with Claude Code

…rough on-chain confirmation

Previously the "sign transaction in your wallet" toast for a chain's claim
never updated after the wallet finished signing, so with a switch to
manual sign-per-chain it looked stuck/duplicated across chains.

- adapter.ts: wrap the wallet provider so an optional callback fires the
  instant eth_sendTransaction resolves (signed + broadcast), threaded
  through claim/claimOnChain/claimAll. No citizen-sdk change needed since
  GoodWidget already owns the provider handed to viem's custom() transport.
- CitizenClaimWidget.tsx: on that signal, update each chain's toast copy to
  "waiting for blockchain confirmation" and keep it persistent until the
  claim promise actually settles (success/error), instead of leaving stale
  "sign in your wallet" copy visible.
- Toast.tsx: add a 'confirming' status with a subtly deeper blue border
  ($primaryDark vs $primary) to distinguish "signing" from "awaiting
  confirmation" without resembling the success (green) state.

Co-Authored-By: Claude <noreply@anthropic.com>

On-Behalf-Of: gdpatchagent[onecli] (yaskkeryodtdijpv)

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Note

Copilot could not run the full agentic suite for this review because it was automatically requested on a bot-authored pull request. Request a review from Copilot under Reviewers to retry with the full agentic suite. Improved support for bot-authored pull requests is coming soon.

This PR adds a mid-flight “confirming” state for claim transactions and propagates a callback that fires after wallet submission (broadcast) but before on-chain confirmation, enabling UX toasts to transition from “sign in wallet” to “waiting for confirmation”.

Changes:

  • Added confirming toast status with styling and icon behavior.
  • Extended claim adapter action APIs to accept an onTransactionSubmitted callback.
  • Implemented an EIP-1193 provider proxy to detect eth_sendTransaction completion and trigger the callback, then updated the widget to use the new confirming toast state.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 2 comments.

File Description
packages/ui/src/components/Toast.tsx Adds confirming toast status and maps it to styling + spinner icon behavior.
packages/citizen-claim-widget/src/widgetRuntimeContract.ts Extends adapter action contract with optional onTransactionSubmitted callbacks.
packages/citizen-claim-widget/src/adapter.ts Proxies EIP-1193 provider to emit a submission signal and threads callback through claim flows.
packages/citizen-claim-widget/src/CitizenClaimWidget.tsx Uses onTransactionSubmitted to update toast status/message to confirming.

💡 Add a code-review agent skill for context-aware, tailored reviews. Learn more in the docs.

Comment on lines +79 to +85
return async (args: Parameters<EIP1193Provider['request']>[0]) => {
const result = await target.request(args)
if (args.method === 'eth_sendTransaction') {
onTransactionSubmitted()
}
return result
}
Comment on lines +76 to +81
claim: (onTransactionSubmitted?: () => void) => Promise<unknown>
claimOnChain: (chainId: number, onTransactionSubmitted?: () => void) => Promise<unknown>
claimAll: (
chainIds: number[],
onTransactionSubmitted?: (chainId: number) => void,
) => Promise<CitizenClaimWidgetChainClaimResult[]>
@sirpy

sirpy commented Aug 17, 2026

Copy link
Copy Markdown
Contributor

@copilot

  1. claim widget tests are failing. useEffect is unknown is the error we get.
  2. add running playwright tests to the github actions
  3. modify github actions so superfluid widget and ai widget are only deployed if their code has changed

Co-authored-by: sirpy <671095+sirpy@users.noreply.github.com>

Copilot AI commented Aug 17, 2026

Copy link
Copy Markdown
Contributor

@copilot

  1. claim widget tests are failing. useEffect is unknown is the error we get.
  2. add running playwright tests to the github actions
    ...

Addressed in 6668551: fixed the missing useEffect import in the citizen-claim Storybook helper, added a GitHub Actions workflow to run the root Playwright demo suite, and narrowed the AI credits / Superfluid deploy workflows so they only trigger when their own app/widget code changes.

Copilot AI requested a review from sirpy August 17, 2026 08:40
@sirpy

sirpy commented Aug 17, 2026

Copy link
Copy Markdown
Contributor

@copilot

  1. restore the deploy paths for ai credits and superfluid under push to branch main (the section for pull requests changes are fine)
  2. undo the wrapping of the provider with a proxy and instead create a PR to modify the claim sdk in the repo GoodDollar/GoodSDKs to receive an optional callback

Copilot AI commented Aug 17, 2026

Copy link
Copy Markdown
Contributor

@sirpy I've opened a new pull request, #169, to work on those changes. Once the pull request is ready, I'll request review from you.

@sirpy

sirpy commented Aug 17, 2026

Copy link
Copy Markdown
Contributor

@copilot

  1. restore the deploy paths for ai credits and superfluid under push to branch main (the section for pull requests changes are fine)
  2. undo the wrapping of the provider with a proxy.
  3. in the GoodDollar/GoodSDKs repo create a new PR to modify the claim sdk package to receive an optional callback (currently there's an onTxhash callback, which is not fully configured and used correctly in that claim sdk)
  4. fix the toast issue based on the upcomming changes you did to the goodsdks package

Copilot AI commented Aug 17, 2026

Copy link
Copy Markdown
Contributor

@sirpy I've opened a new pull request, #171, to work on those changes. Once the pull request is ready, I'll request review from you.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants