Repository navigation
[UI/UX] Develop Savings Group Dashboard and Management Experience #11
Description
🔴 Priority: Critical
Difficulty: Hard
Estimated Effort: 4-5 days
Relevant Files: src/app/(dashboard)/groups/[id]/page.tsx, src/components/groups/
Labels: enhancement, priority:critical, ui
Requirements
-
Group View Implementation
- Translate the Savings Group Dashboard Figma screens into code.
- Must include: Group information header, interactive Savings progress bar, Contribution history table, Member list with avatars, Upcoming payouts schedule, and Invite member modals.
-
Complex States
- Handle visual states for members who have paid, are late, or have received their payout.
- Implement the Invite functionality with proper form validation and error handling as designed.
-
Testing
- E2E testing: Navigate from the main dashboard into a specific group, open the invite modal, and view the contribution history.
Activity
Rampop01 commentedon Aug 25, 2026
I’d like to work on #11 because it aligns closely with my experience building responsive React/Next.js interfaces and translating product designs into reusable components.
My approach would be to:
I’ll focus on keeping the UI consistent with the existing design system while making the group management experience clear and easy to use.
grantfox-oss commentedon Aug 25, 2026
🦊 GrantFox — @Rampop01 has been assigned to this issue as part of the Third Campaign campaign!
Next steps:
Closes #11)Good luck! Track your progress on GrantFox.
Merge pull request #22 from Rampop01/feature/dashboard-ui
grantfox-oss commentedon Aug 26, 2026
🎉 This issue has been marked as completed on GrantFox as part of the Third Campaign campaign!
@Rampop01's PR #22 was approved and merged by @Queenode.
🏆 @Rampop01: You earned 35 FoxPoints for this contribution! Your current tier: Explorer (748 total points). Track your full progress on GrantFox.
👏 Great work, @Rampop01! Keep contributing to Kolo-Org.