makiolaj/SimpleFinanceDash
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs(02): create phase plan — 3 plans across 2 waves for dashboard charts and layout

Browse Source
This commit is contained in:
Jean-Luc Makiola
2026-03-16 12:57:33 +01:00
parent e0b3194211
commit dca5b04494
4 changed files with 759 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
.planning/ROADMAP.md
View File

@@ -37,21 +37,22 @@ Plans:
- [x] 01-02-PLAN.md — Build PageShell, StatCard, SummaryStrip, DashboardSkeleton and integrate into DashboardPage
### Phase 2: Dashboard Charts and Layout
**Goal**: Deliver the full dashboard chart suite — donut, vertical bar, and horizontal bar — inside a responsive ChartPanel, with month navigation and memoized data derivations
**Goal**: Deliver the full dashboard chart suite — donut, vertical bar, and horizontal bar — inside a responsive 3-column layout, with month navigation and memoized data derivations
**Depends on**: Phase 1
**Requirements**: UI-DASH-01, UI-BAR-01, UI-HBAR-01, UI-DONUT-01
**Research flag**: No — Recharts 3.8.0 chart implementations and the `chart.tsx` fix are fully documented
**Research flag**: No — Recharts 2.15.4 chart implementations and the `chart.tsx` fix are fully documented
**Success Criteria** (what must be TRUE):
1. Dashboard displays an expense donut chart with center total label, active sector hover expansion, and a custom legend — replacing the existing flat pie chart
2. Dashboard displays a grouped vertical bar chart comparing income budgeted vs actual amounts
3. Dashboard displays a horizontal bar chart comparing budget vs actual spending by category type
4. All three charts consume colors from CSS variable tokens (no hardcoded hex values) and render correctly with zero-item budgets (empty state)
5. User can navigate between budget months on the dashboard without leaving the page, and all charts and cards update to reflect the selected month
**Plans**: TBD
**Plans**: 3 plans
Plans:
- [ ] 02-01: TBD
- [ ] 02-02: TBD
- [ ] 02-01-PLAN.md — Month navigation infrastructure (useMonthParam hook, MonthNavigator, ChartEmptyState, i18n keys)
- [ ] 02-02-PLAN.md — Three chart components (ExpenseDonutChart, IncomeBarChart, SpendBarChart)
- [ ] 02-03-PLAN.md — Dashboard integration (wire charts + month nav into DashboardPage, update skeleton)
### Phase 3: Collapsible Dashboard Sections
**Goal**: Complete the dashboard hybrid view with collapsible per-category sections that show individual line items, group totals, and variance indicators
@@ -133,6 +134,6 @@ Phases execute in numeric order: 1 -> 2 -> 3 -> 4
| Phase | Plans Complete | Status | Completed |
|-------|----------------|--------|-----------|
| 1. Design Foundation and Primitives | 2/2 | Complete | 2026-03-16 |
| 2. Dashboard Charts and Layout | 0/TBD | Not started | - |
| 2. Dashboard Charts and Layout | 0/3 | Not started | - |
| 3. Collapsible Dashboard Sections | 0/TBD | Not started | - |
| 4. Full-App Design Consistency | 0/TBD | Not started | - |