- Add charts table with id, name (unique), created_at - Add chart_id FK to candles table with composite unique on (chart_id, time) - Add chart_id FK to annotations table - Custom migration handles existing data: creates 'Imported Data' chart and backfills chart_id - Recreates tables for NOT NULL constraint (SQLite limitation)
2.9 KiB
MODIFIED Requirements
Requirement: Candlestick chart rendering
The system SHALL render candle data as a candlestick chart using the lightweight-charts library (v4). The chart MUST display OHLC data with candlestick visuals using a black and white color scheme. Bullish candles SHALL have a white interior with black outline and black wicks. Bearish candles SHALL be completely black (black fill and black wicks). The chart SHALL be a client-side React component. The chart SHALL fetch and display candles scoped to the active chart by passing chartId to the GET /api/candles endpoint.
Scenario: Chart renders candle data for active chart
- WHEN an active chart is selected and candle data exists for that chart
- THEN the chart fetches candles via
GET /api/candles?chartId=<activeChartId>and renders only that chart's candles
Scenario: Empty state
- WHEN no charts exist or the active chart has no candle data
- THEN the chart area displays an empty chart with a prompt to upload CSV data
Scenario: Bullish candle appearance
- WHEN a candle's close price is higher than its open price (bullish)
- THEN the candle displays with white interior, black border, and black wick
Scenario: Bearish candle appearance
- WHEN a candle's close price is lower than its open price (bearish)
- THEN the candle displays as completely black (black fill and black wick)
Scenario: Chart switches when active chart changes
- WHEN user selects a different chart from the chart selector
- THEN the chart clears existing data, fetches candles for the newly selected chart, and renders the new dataset
Requirement: Annotation markers on chart
The chart SHALL display visual markers for existing annotations using the series.setMarkers() API. Break Up annotations MUST appear as green upward arrows above the bar. Break Down annotations MUST appear as red downward arrows below the bar. Markers MUST update when annotations are added or deleted. Markers SHALL be scoped to the active chart by fetching annotations via GET /api/annotations?chartId=<activeChartId>.
Scenario: Break Up marker display
- WHEN a Break Up annotation exists for a candle timestamp in the active chart
- THEN a green upward arrow marker appears above that candle on the chart
Scenario: Break Down marker display
- WHEN a Break Down annotation exists for a candle timestamp in the active chart
- THEN a red downward arrow marker appears below that candle on the chart
Scenario: Marker updates on annotation change
- WHEN user adds or deletes an annotation on the active chart
- THEN chart markers update immediately without requiring a page reload
Scenario: Markers refresh on chart switch
- WHEN user switches to a different chart
- THEN markers from the previous chart are cleared and markers for the new chart's annotations are loaded