feat: add color support for line annotations

- Add color field to annotations schema with default blue (#3b82f6)
- Add color picker UI with 5 preset colors (red, green, blue, yellow, white)
- Pass selected color through component hierarchy (Page -> Toolbox, CandleChart -> SvgOverlay)
- Store color when creating line annotations
- Render lines with their stored color
- Update database with color column
- Preview lines show selected color during drawing

Phase 1 of LINE_DRAWING_IMPROVEMENTS.md complete
This commit is contained in:
Marko Djordjevic 2026-02-12 14:04:51 +01:00
parent 5767669b2c
commit 006e95c266
6 changed files with 51 additions and 5 deletions

View file

@ -28,6 +28,7 @@ interface Annotation {
interface CandleChartProps {
activeTool: string | null;
onAnnotationChange?: () => void;
selectedColor: string;
}
export interface CandleChartHandle {
@ -35,7 +36,7 @@ export interface CandleChartHandle {
}
const CandleChart = forwardRef<CandleChartHandle, CandleChartProps>(
({ activeTool, onAnnotationChange }, ref) => {
({ activeTool, onAnnotationChange, selectedColor }, ref) => {
const chartContainerRef = useRef<HTMLDivElement>(null);
const chartRef = useRef<IChartApi | null>(null);
const seriesRef = useRef<ISeriesApi<'Candlestick'> | null>(null);
@ -277,6 +278,7 @@ const CandleChart = forwardRef<CandleChartHandle, CandleChartProps>(
series={seriesRef.current}
activeTool={activeTool}
onAnnotationChange={onAnnotationChange}
selectedColor={selectedColor}
/>
</div>
);