github-samples / github-samples/tailspin-toys

Add a search box to find games by title

Open
#2 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

Players who already know what they're looking for shouldn't have to scan the whole catalog. Adding a simple search box on the game list page lets users quickly narrow the list by title, improving discoverability alongside the planned category and publisher filters. This builds on the existing game list data layer without changing the data model.

Acceptance criteria

  • The game list page includes a search input that filters games by title
  • Matching is case-insensitive and updates the visible list as the user types or submits
  • An appropriate empty state is shown when no games match the search
  • The search input follows the project's accessibility guidelines (labeling, keyboard navigation, visible focus states) and includes a data-testid attribute
  • Unit tests cover any new data-layer/search helper and Playwright e2e tests cover the search 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 at the game list page and trace the existing game list data layer to find where title filtering belongs. Add the accessible search input and empty state, then run the relevant unit tests and Playwright e2e tests; done means case-insensitive filtering updates the visible list and all acceptance criteria pass.

Written by the indexing model from the issue text.

Assessment

Tech stack
playwright, typescript
Domain
accessibility, frontend, 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.