Skip to content

feat: implement story cards and event-aware annotations (issue #14)#27

Merged
WFord26 merged 8 commits intomainfrom
issue/14-story-cards-and-annotations
Apr 5, 2026
Merged

feat: implement story cards and event-aware annotations (issue #14)#27
WFord26 merged 8 commits intomainfrom
issue/14-story-cards-and-annotations

Conversation

@WFord26
Copy link
Copy Markdown
Owner

@WFord26 WFord26 commented Apr 5, 2026

Overview

Implements issue #14: story cards and event-aware annotations across dashboard surfaces to provide narrative context alongside price data.

Changes

New Components

  • StoryCard — Reusable narrative card component with:

    • Icon, title, insight text, optional detail line
    • Category badge (market, supply, event, correlation)
    • Color variants (blue, amber, red, green, slate)
    • Optional action button with callback
    • Fully accessible with role="article"
  • EventAnnotationControls — Category filter pill bar for event overlays:

    • Shows event counts per category
    • Clear filters reset button
    • Visual feedback for selected categories

New Hooks

  • useMarketStories — Derives 3–5 story cards from live events, volatility & disruption data
  • useChartEvents — Manages event data fetching, category filtering, and conversion to chart annotation markers

New Utilities

  • eventAnnotations — Pure functions for event-to-annotation conversion and filtering

Feature Integration

Dashboard

  • Story cards rail (3-column grid) above national average prices table
  • Sources from useMarketStories hook

Correlation

  • 3-card context rail: correlation strength, rockets-and-feathers asymmetry, latest event

State Pages

  • "Recent Market Events" story card rail
  • Price history chart with EventAnnotationControls
  • Color-coded event annotations on chart

Historical

  • "Show Events" toggle now shows color-coded vertical reference lines:
    • Red = bullish (price up)
    • Green = bearish (price down)
    • Gray = neutral

Chart Enhancement

  • Extended PriceLineChart ChartReferenceLine with x property for vertical lines
  • Automatic label positioning (vertical vs horizontal)

Testing

  • 12 unit tests for StoryCard component (all passing)
  • All web tests passing: 50/50 ✓

Acceptance Criteria Met

✓ Dashboard and historical views show 3–5 structured story cards
✓ Charts surface consistent event annotations with category filtering
✓ Clicking a story or annotation reveals actionable context
✓ Event context reused across dashboard, state, and correlation surfaces
✓ Consistent styling and UX patterns across all surfaces

Files Changed

  • 5 new components/hooks/utils
  • 5 modified pages/components
  • 1 new test file (12 tests)
  • CHANGELOG updated

WFord26 and others added 8 commits April 4, 2026 22:44
- Create StoryCard component with reusable narrative cards
- Implement useMarketStories hook to generate event-based narratives
- Integrate story cards rail into Dashboard
- Add market context stories for events, volatility, and disruption
…tate pages

- Create eventAnnotations utility for converting events to chart markers
- Create EventAnnotationControls component for category filtering
- Create useChartEvents hook for date-range event fetching and filtering
- Add correlation-specific story cards to Correlation page
- Add state-scoped market event story cards to State page
…story cards

- Extend PriceLineChart with vertical reference line support via x prop
- Wire Historical page 'Show Events' toggle to actual event data
- Convert events to vertical reference lines on Historical price chart
- Fix StoryCardData type references in Correlation story card computation
- Add full issue #14 entry to CHANGELOG [Unreleased] section
- Fix StoryCard.test.tsx: use userEvent.setup() directly instead of destructuring from render()
- Set minimum pool size to 0 and added acquireTimeoutMillis to database configuration.
- Created a new test file for StoryCard component with comprehensive tests for rendering and interaction.
- Change moduleResolution from 'bundler' to 'node' (bundler requires ESM)
- Remove invalid ignoreDeprecations option
- Fixes CI build failure: TS5095 and TS5103 errors
- Update packages/db/src/config.ts development pool min from 0 to 2
- Fixes failing test in packages/db/src/__tests__/config.test.ts
- All 54 db tests now passing
@WFord26 WFord26 merged commit 023e43f into main Apr 5, 2026
1 check passed
@WFord26 WFord26 deleted the issue/14-story-cards-and-annotations branch April 5, 2026 06:20
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant