github-samples / github-samples/tailspin-toys

Implement pagination on the game list page

Open
#7 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
8
Forks
53
Avg merge
20h 1m
Merged PRs (30d)
4

Description

As the number of games grows, loading the entire catalog on a single page hurts performance and makes the list harder to browse. Adding pagination keeps the game list page fast and manageable.

Acceptance criteria

  • The data-access helpers in src/lib/ support pagination (for example page/limit or cursor-based)
  • The game list page includes pagination controls
  • Pagination controls follow the project's accessibility guidelines and include data-testid attributes
  • Vitest unit tests cover the pagination helpers and Playwright e2e tests cover the pagination behavior

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by inspecting the data-access helpers in src/lib/ and the game list page to understand how the catalog is loaded. Add pagination support and accessible controls with the requested data-testid attributes. Run the Vitest unit tests for the helpers and Playwright e2e tests to verify pagination behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
playwright, typescript
Domain
frontend, performance, testing-qa
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
68/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.