Skip to content

watchlist all-items: infinite scroll + TanStack Virtual list #519

@electather

Description

@electather

Part of epic #491. Owner direction: apps/client/src/features/watchlist/components/sections/all-items/index.tsx:60.

I want it to be an infinite scroll, use tanstack virtual list for implementing the infinite view.

Goal

Replace paginated "Load more" pattern on all-items (flat bucket pages) with infinite scroll backed by TanStack Virtual.

Acceptance criteria

  • All-items list uses useVirtualizer (or equivalent TanStack Virtual API).
  • Infinite scroll: page fetches triggered when near end of virtual window.
  • Works on /watchlist/ready, /watchlist/in-progress, /watchlist/awaiting, /watchlist/unavailable, /watchlist/upcoming.
  • Works on /watchlist/moods/:moodId.
  • No phantom Load-more when cursor exhausted (paired with #issue-9).
  • Sort changes (?sort=) reset scroll position + cache.
  • Verify in browser: scroll past 200 items, no jank, no duplicate fetches; scroll back up, position preserved.
  • Typecheck + tests pass.

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions