Skip to content

WalletProvider's connect FIX - #415

Merged
Jagadeeshftw merged 1 commit into
AnchorNet-Org:mainfrom
Mitch5000:WalletProvider's-connect-FIXED
Jul 27, 2026
Merged

WalletProvider's connect FIX#415
Jagadeeshftw merged 1 commit into
AnchorNet-Org:mainfrom
Mitch5000:WalletProvider's-connect-FIXED

Conversation

@Mitch5000

Copy link
Copy Markdown
Contributor

Description
Connecting and disconnecting the wallet were the only mutating actions in the app that didn't confirm themselves with a toast. Every other one does — registering and deactivating an anchor (AnchorsPanel, AnchorDetail), opening, executing and cancelling a settlement (SettlementsPanel, SettlementDetail). There was no useToast import and no notify call anywhere in WalletProvider.tsx or ConnectButton.tsx, so the only feedback was the header button silently swapping its label.

ConnectButton now calls notify("success", "Wallet connected.") after connect() and notify("success", "Wallet disconnected.") after a confirmed disconnect(), using the ToastProvider that already wraps the whole tree in layout.tsx.

WalletProvider is deliberately left untouched. It also updates account from the cross-tab storage event, so raising a toast there would notify a user in a tab that never took the action. Keeping the call in the click handlers draws a clean line between "user initiated" and "synced from another tab". The button label behaviour and the disconnect confirmation dialog are unchanged.

Files changed for the fix

src/components/ConnectButton.tsx — useToast() plus the two notify calls, and a doc comment explaining why the toast lives here rather than in the provider.
src/components/ConnectButton.test.tsx — four new tests (below).
src/components/SiteHeader.test.tsx, src/app/not-found.test.tsx — wrapped in ToastProvider; both render a ConnectButton transitively and now need the context, mirroring the real nesting in layout.tsx.
CHANGELOG.md — entry under ## [0.10.0].
Pre-existing breakages repaired to get a green build

main didn't compile and couldn't run its full test suite before this branch. Three unrelated defects, apparently left by an earlier merge, were in the way:

src/components/AnchorsPanel.tsx referenced initialSort, setSortParam and setDirParam, none of which were declared — a hard TypeScript error that failed next build. Restored the URL-backed sort state using the file's own already-present useQueryState import and its declared-but-unused VALID_SORT_KEYS / VALID_SORT_DIRECTIONS constants, including the corrective cleanup of invalid sort/dir params. Also wired the already-computed debouncedQuery into the filter. Side effect: the 33 previously failing AnchorsPanel tests now pass.
src/components/PoolsPanel.tsx referenced an undeclared PoolsPanelProps type and passed a possibly-undefined loader to useAsync. Declared and exported the interface, fixed the argument typing.
src/components/ToastProvider.test.tsx had a test block duplicated three times after the describe() closing brace, producing an esbuild syntax error — the whole file collected zero tests. De-duplicated; it now runs 18 passing tests.
Validation

npm run build — passes, TypeScript clean, all 9 routes generated. On main this failed with Type error: Cannot find name 'initialSort'.
npm run lint — no new errors or warnings from any file in this PR.
Coverage on src/components/ConnectButton.tsx — 100% statements / branches / functions / lines, above the repo's 95% standard.
Full suite: 79 failures before this branch, 46 after, and the 46 are a strict subset of the original 79 (verified by diffing sorted failure lists). Zero new failures. The remaining 46 are pre-existing and unrelated — SettlementsPanel duplicate-text query collisions, jsdom localStorage-throw handling, ThemeProvider matchMedia, and useAsync timing.
Acceptance criteria: connecting shows a success notification; confirming a disconnect shows a success notification; a cross-tab storage sync does not trigger a notification in the receiving tab. All three covered by tests.

No new attack surface — client-side UX consistency built on the existing notification system, no new dependencies, no network calls, no change to what's stored in localStorage.

Closes the wallet connect/disconnect toast notification issue.

Checklist
I added a CHANGELOG.md entry under the next ## [x.y.z] section
(see the Format note at the top of CHANGELOG.md), or this PR
is docs-only / test-only / internal tooling and doesn't change
user-facing behavior.
Tests added/updated for the change.
Changelog entry added under ## [0.10.0] with a ### Added bullet tagged UX: for the toasts and a ### Fixed bullet tagged Build: for the compile repairs.

Tests added to src/components/ConnectButton.test.tsx, rendered inside the real ToastProvider:

shows a success notification after connecting — asserts the toast text and that it renders in the shared viewport with role="status" and aria-live="polite"
shows a success notification after confirming a disconnect
does not notify when the disconnect dialog is cancelled
does not notify when the wallet state syncs from another tab — dispatches a StorageEvent for both a cross-tab connect and a cross-tab disconnect, asserts the button label updates but no toast appears

Closes #324

@Mitch5000

Copy link
Copy Markdown
Contributor Author

Heads up on the failing check — I dug into it and I don't think it's coming from this PR.

CI runs npm ci → lint → build → test, and it's dying at the lint step (the ~34s runtime is install + lint, so build and test never execute).

I cloned AnchorNet-Org/AnchorNet-Frontend@main untouched and ran npm run lint against it:

text

✖ 23 problems (10 errors, 13 warnings)
ESLint exits non-zero on any error, so main currently can't pass its own CI. The 10 pre-existing errors:

src/components/AnchorDetail.test.tsx (2) — @typescript-eslint/no-explicit-any
src/components/MetricsBar.test.tsx (4) — @typescript-eslint/no-explicit-any
src/components/SettlementDetail.test.tsx (1) — @typescript-eslint/no-explicit-any
src/components/SortAnnouncer.tsx:38 — react-hooks/set-state-in-effect
src/components/ToastProvider.test.tsx:405 — Parsing error: Declaration or statement expected
vitest.setup.ts:38 — ban-ts-comment (@ts-ignore@ts-expect-error)
This branch reports 9 errors — the same list minus the ToastProvider.test.tsx parse error, which this PR fixes (a test block was duplicated three times after the describe() closing brace, so that file was collecting zero tests). Net effect on lint is −1 error, +0. Nothing in the output points at ConnectButton.tsx or any line added here.

Same story one step further down: main also fails npm run build with Type error: Cannot find name 'initialSort' (AnchorsPanel.tsx:244), plus an undeclared PoolsPanelProps in PoolsPanel.tsx. Both look like leftovers from an earlier merge. I've restored those declarations here so the build compiles — happy to pull them into a separate PR if you'd rather keep this one scoped strictly to the wallet toasts.

One thing that is on me: the CHANGELOG.md in 1b4408f lost its Markdown formatting (headings and bold stripped, which is why the diff shows 133/153 on a file I only added ~19 lines to). Fixing that now and re-pushing with the entry under a proper ## [x.y.z] heading.

How would you like to handle the lint failures? I can either fix all 9 in this PR (mechanical — type the anys, restructure the SortAnnouncer effect, swap the ts-comment), or open a separate CI-unblocking PR and leave this one focused. Your call on which keeps the history cleaner.

@Jagadeeshftw
Jagadeeshftw merged commit b6b4e35 into AnchorNet-Org:main Jul 27, 2026
1 check failed
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.

WalletProvider's connect()/disconnect() never notify the user via the app's toast system, unlike every other mutating action

2 participants