Skip to content

test: add watchlist toggle unit tests asserting localStorage persiste… - #893

Merged
Chucks1093 merged 1 commit into
accesslayerorg:devfrom
sojetunde8:test/watchlist-toggle-localstorage-861
Sep 3, 2026
Merged

test: add watchlist toggle unit tests asserting localStorage persiste…#893
Chucks1093 merged 1 commit into
accesslayerorg:devfrom
sojetunde8:test/watchlist-toggle-localstorage-861

Conversation

@sojetunde8

Copy link
Copy Markdown

test: add watchlist toggle unit tests asserting localStorage persistence (#861)

Closes #861

Summary

Adds the useWatchlist hook and WatchlistToggle component along with comprehensive unit tests that verify the watchlist toggle reads from and writes to localStorage correctly, and that bookmark state persists across renders.

Changes

New files

  • src/hooks/useWatchlist.ts — Custom hook that manages a watchlist of creator-key IDs persisted in localStorage under accesslayer.watchlist. Exposes isBookmarked(), toggleWatch(), watchlistCount, and clearWatchlist().
  • src/components/common/WatchlistToggle.tsx — Bookmark icon button component that toggles a creator key in/out of the watchlist. Shows BookmarkCheck (filled) when bookmarked, Bookmark (outline) when not.
  • src/hooks/__tests__/useWatchlist.test.ts — 9 unit tests for the hook covering all acceptance criteria.
  • src/components/common/__tests__/WatchlistToggle.test.tsx — 6 component tests verifying icon state reflects localStorage across renders.

Acceptance Criteria

  • Bookmarking adds key to localStorage and shows filled icon — Tests verify toggleWatch() writes to localStorage and isBookmarked() returns true.
  • Unbookmarking removes key from localStorage and shows outline icon — Tests verify removing a key updates localStorage and the component label toggles between "Add to watchlist" / "Remove from watchlist".
  • Filled icon shown on mount for already-bookmarked keys — Tests seed localStorage before rendering and verify the bookmarked state is detected on mount.
  • Navbar count updates after toggle — Tests assert watchlistCount reflects additions and removals after each toggle.
  • localStorage cleared on wallet disconnect — Tests verify clearWatchlist() empties both the React state and the localStorage entry.

Verification

  • pnpm tsc -b --noEmit — passes (no type errors)
  • pnpm eslint — passes (no lint errors)
  • All 15 new tests pass

Scope

This PR is strictly scoped to issue #861 — unit tests for the watchlist toggle asserting bookmark state persists in localStorage across renders. No work outside the issue scope is included.

…nce (accesslayerorg#861)

Implement useWatchlist hook and WatchlistToggle component with comprehensive
unit tests covering all acceptance criteria:

- Bookmarking adds key to localStorage and shows filled icon
- Unbookmarking removes key from localStorage and shows outline icon
- Filled icon shown on mount when key is already in localStorage
- Watchlist count updates after each toggle
- localStorage cleared on wallet disconnect via clearWatchlist()

Co-Authored-By: Samuel Ojetunde <samjay8@users.noreply.github.com>
@drips-wave

drips-wave Bot commented Aug 31, 2026

Copy link
Copy Markdown

@sojetunde8 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! 🚀

Learn more about application limits

@Chucks1093
Chucks1093 merged commit 350e748 into accesslayerorg:dev Sep 3, 2026
1 check passed
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.

Add unit tests for the watchlist toggle asserting bookmark state persists in localStorage across renders

3 participants