Badge Display Widget
Component Detail
User Interface
low complexity
mobile
0
Dependencies
0
Dependents
2
Entities
0
Integrations
Description
Flutter widget rendering the peer mentor's badge grid on profile and summary screens. Displays each badge in a uniform card with locked/unlocked visual state, the badge icon asset, and an earned-date label when unlocked.
badge-display-widget
Sources & reasoning
Badge grid UI is the primary visible surface of this feature. The Flutter profile screen needs a reusable widget that renders locked/unlocked badge cards, giving peer mentors persistent social proof of their contributions directly in their profile.
No source references — this artifact was included based on reasoning alone (see above).
Responsibilities
- Render badge grid with locked/unlocked card states and earned-date labels
- Fetch badge list and earned status from Achievement Service via Riverpod provider
- Display badge detail overlay or sheet on tap
- Adapt layout for embedding in profile screen and annual summary screen
Interfaces
BadgeGrid({required String userId})
BadgeCard({required Achievement badge, required UserAchievement? earned})
BadgeDetailSheet({required Achievement badge})
Related Data Entities (2)
Data entities managed by this component