UI revamp Phase 2: new Home (brief, spend chart, Lumen found, calendar, bills, budget, activity)

[coderconnoisseur]

UI revamp Phase 2: the new Home. Stacked on #91 (Phase 1), which is stacked on #89 (Phase 0). Merge them in that order and retarget each PR to refactor as its parent lands.
Spec: docs/superpowers/specs/2026-10-20-ui-revamp-design.md §4. Plan: docs/superpowers/plans/2026-10-20-ui-revamp-phase2-home-ui.md.

What you get on /home

• Greeting and a one-sentence brief in the serif, over the sky band, for example "October is running 9% lighter than September. Netflix renews on Friday."
• Spent this month. A hand-drawn SVG chart: cumulative spend now against the same point last period, a dotted forecast to month-end, upcoming bills pinned on the future days, and 1W / 1M / 3M / YTD chips.
• Lumen found: receipts waiting for review, linking to /receipts?tab=review.
• Spending calendar (a heat grid) beside Recent transactions.
• Side column: Budget (an honest "No budget yet"), Upcoming bills, the draft-budget promo ("Coming soon") and Activity.
• The old "Financial Overview" is gone, along with its unused components.
• The app's light pages now set a light theme-color. (app)/layout is a tiny server file; the client shell moved to components/app-shell.tsx.

Honest by design: cards without a backend yet show empty states, never made-up numbers. Phase 3 replaces the interim brief, Lumen found and Activity, and wires up Budget. Every item is listed in spec §12.

Backend (small)

GET /api/analytics/forecast?insights=0 returns the forecast numbers without the LLM-written insight text, so Home costs no LLM call. The default is unchanged. Test: test_forecast_route_can_skip_llm_insights. The full backend suite passes: 903 passed, 15 skipped.

Checks

• npm run test:e2e: 71/71 (Chromium).
  • 14 node unit tests for lib/home-math.ts, covering periods, cumulative spend, the same-day comparison clamped to month length, the brief and UTC timestamps.
  • Home e2e covering:
    • Layout stability: zero layout shift with a 1.5 s slow backend, and range changes never blank other cards.
    • Bad or missing data: a failed forecast, a forecast that matches no days, a brand-new user, and totals across more than 100 transactions (the API caps a page at 100, so Home follows the pages).
    • Slow forecast: a 6 s forecast doesn't hold up the page.
    • Long text: ₹15,00,000 amounts and long vendor names.
    • Cards: pins, calendar shading, bills and activity.
• tsc, lint and build are clean. /home is static at 16.1 kB of route JS, with no chart library on Home.

Review fixes (whole-branch review, Opus)

• Critical: totals were silently cut at the API's 100-row page. Fixed by paging.
• Activity times were off by the UTC offset, because the backend sends naive UTC.
• The page waited on an uncached LLM forecast. It now asks for numbers only (?insights=0), caches them and loads them separately.
• Calendar shading now uses color-mix instead of relative colour syntax, for older browsers.
• A real empty state for the chart.
• No flat "forecast" when no forecast day lands in this month.

Deferred minors are in spec §12.

Manual check

• On a demo account, check the brief and the numbers against Spending.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
lumen	Ready	Preview	Oct 20, 2026 6:18am UTC