Show star ratings on game cards

[katherineattlc]

Description

Show each game's star rating on listing cards so users can compare games without opening detail pages. Cards now render the existing starRating value, and unrated games display No rating yet.

Related Issue

Closes #20

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

• Updated src/components/GameCard.astro to import and render StarRating when game.starRating is present.
• Added a fallback text label No rating yet when game.starRating is null.
• Kept the existing card layout intact with a minimal, component-local change.

Testing

Data Layer Changes

• Ran npm run test:unit - all tests pass
• Added/updated Vitest tests for data-layer changes
• Generated a migration (npm run db:generate) for any schema change

Frontend Changes

• Ran npm run test:e2e - all tests pass
• Added data-testid attributes to interactive elements
• 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

N/A

[Copilot]

Pull request overview

Adds star-rating visibility to game listing cards so users can compare games directly from the index page, aligning the UI with the existing Game.starRating model field.

Changes:

• Import and render StarRating in GameCard.astro when game.starRating is present.
• Display a fallback label (No rating yet) when game.starRating is null.