Skip to content

Display star ratings on game listing cards - #190

Open
bhagyasrianisetti wants to merge 1 commit into
github-samples:mainfrom
bhagyasrianisetti:bhagyasrianisetti-display-star-ratings-on-game-listing-car
Open

bhagyasrianisetti wants to merge 1 commit into
github-samples:mainfrom
bhagyasrianisetti:bhagyasrianisetti-display-star-ratings-on-game-listing-car

Conversation

@bhagyasrianisetti

Copy link
Copy Markdown

Description

Game listings currently omit ratings, making it harder for visitors to compare games without opening each detail page. This adds the shared star-rating badge to every game card, with a one-decimal score out of five and a No rating yet fallback; the game detail page uses the same formatting.

Related Issue

Fixes: #165

Type of Change

  • 🐛 Bug fix (non-breaking change that fixes an issue)
  • ✨ New feature (non-breaking change that adds functionality)
  • 💥 Breaking change (fix or feature that would cause existing functionality to change)
  • 📚 Documentation update
  • 🧪 Test update
  • 🔧 Refactor (no functional changes)

Changes Made

  • Reuse the shared StarRating component on each game card.
  • Format rated scores as x.x / 5 and show No rating yet when no rating is available.
  • Add unit coverage for score formatting and end-to-end coverage for listing-card rating badges.

Testing

Data Layer Changes

  • Ran npm run test:unit - all tests pass (42 tests)
  • Added/updated Vitest tests for data-layer changes (rating-formatting helper coverage; no database-access changes)
  • Generated a migration (npm run db:generate) for any schema change (not applicable; no schema change)

Frontend Changes

  • Ran npm run test:e2e - all tests pass (rerun as npm run test:e2e -- --workers=1: 22 passed; the initial parallel run had one timeout)
  • Added data-testid attributes to interactive elements (no new interactive elements; the rating badge exposes game-rating)
  • Verified build succeeds (npm run build)

Checklist

  • My code follows the project's coding standards
  • I have used explicit TypeScript types for function parameters and return values
  • I have built the UI with Astro components and Tailwind CSS utility classes (dark theme)
  • I have updated documentation (README, instruction files) if needed (no documentation change needed)
  • My changes are focused on a single concern
  • I have written clear commit messages explaining what and why

Additional Notes

npm run lint and npm run typecheck:all also pass. The first E2E attempt could not start because Playwright Chromium was not installed; after installing Chromium, a parallel run had one timeout and the one-worker rerun passed all 22 tests.

Co-authored-by: Copilot App <223556219+Copilot@users.noreply.github.com>
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.

Display star ratings on game listing cards

1 participant