BadgesScreen
Component Detail
User Interface
medium complexity
mobile
0
Dependencies
0
Dependents
1
Entities
0
Integrations
Description
Full-screen view displaying all achievement badges available to the current user, organized by category or milestone type. Shows earned badges prominently and locked/unearned badges in a dimmed state. Provides navigation to individual badge detail views.
badges-screen
Sources & reasoning
Line 76 explicitly mentions statusbadges as part of the gamification request from three organizations. The priority matrix (line 149) places gamification in Fase 3 (NICE TO HAVE), mapping to v1.1. Badges provide continuous recognition between annual summaries, complementing the Wrapped feature and supporting volunteer motivation year-round.
-
docs/source/likeperson.md · line 76Målet er å gi frivillige stolthet og motivasjon, og gjøre usynlig innsats synlig. Også nevnt: «Årets koordinator», statusbadges og halvårsoppsummeringer.
-
docs/source/likeperson.md · line 149| Gamification / Spotify Wrapped | ✓ | ✓ | - | ✓ | ✓ | NICE TO HAVE | 3 |
Responsibilities
- Render earned and unearned badges in a responsive grid layout
- Fetch and display badge progress data from AchievementService
- Navigate to badge detail or filter by category
- Handle empty and loading states gracefully
Interfaces
loadBadges(userId: string): void
filterByCategory(category: string): void
onBadgeTap(badgeId: string): void