[ishu-cspl]

Description

Show each game's star rating on the listing card so visitors can compare games without opening every detail page. Rated games display stars and a score formatted as x.x / 5; games without a rating display No rating yet. The shared rating badge uses the same presentation on detail pages.

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 out of five and display No rating yet for missing ratings.
• Add unit and E2E coverage for rating output on cards and detail pages; document the behavior in the README.

Testing

Data Layer Changes

• Ran npm run test:unit - all tests pass (42 tests)
• Added/updated Vitest tests for data-layer changes (rating score formatting covered; no data-layer behavior changed)
• Generated a migration (npm run db:generate) for any schema change (N/A; no schema change)

Frontend Changes

• Ran npm run test:e2e - all tests pass (22 tests)
• Added data-testid attributes to interactive elements (no new interactive elements; reused existing rating test ID)
• 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
• 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.