[UI/UX Design] Design the Revenue Reporting Calendar with month-by-month overview

[thlpkee20-wq]

Description

Issuers benefit from a calendar overview of revenue-report due dates, submissions, and acceptance status. Design a month-grid view with status dots per day, side panel for selected-month details, and quick access to "Submit report".

Requirements and context

• Must be accessible (WCAG 2.1 AA), responsive, and documented in the design system
• Should be consistent with existing patterns and easy to review
• Relevant code: src/components/RevenueReportForm.tsx
• Calendar must use the WAI-ARIA grid pattern and be operable by keyboard arrow keys

Suggested execution

• Fork the repo and create a branch
• git checkout -b uiux/revenue-reporting-calendar
• Implement changes
  • Design the month grid with status dot per cell
  • Build the selected-month detail side panel
  • Add quick-submit affordance
• Validate accessibility and responsive assumptions

Test and commit

• Run checks
  • npm run lint and component/visual tests
• Cover edge cases
  • Locale week start, mobile (list collapse), screen-reader navigation, RTL
• Include screenshots/before-after and accessibility (axe) notes

Example commit message

design: revenue reporting calendar overview

Guidelines

• Minimum 95 percent test coverage
• Clear documentation
• Timeframe: 96 hours

[daveedAJ]

@daveedAJ has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Hi maintainer,

Please I'd really like to work on this issue. I'll design and implement the revenue reporting calendar with an accessible month-grid view, status indicators, detail side panel, and quick-submit actions while ensuring responsiveness, documentation, and test coverage requirements are met.

Thanks for considering me.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @daveedAJ to this issue.

[drips-wave]

Congratulations, @daveedAJ! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on June 30, 2026.

🧑‍💻 @daveedAJ: Please resolve the issue such that the repo's maintainers have enough time to review your contribution before the due date. You'll earn Points for completing the issue on-time, which will make you eligible for a share of the Stellar Wave Program's reward pool.

Warning

When opening a PR, please link it to this issue to ensure it gets tracked accurately. Points are awarded when this issue is marked as completed by the maintainer.

🤠 Repo maintainers: Please keep an eye on the contributor's progress and review their work before the due date. You can manage this issue, including adjusting its complexity and points, here.

🌊 Happy Wave 🌊