perf: remove fitContent() from reconciliation effect, call only on initial load

Move chart.timeScale().fitContent() out of the span annotation reconciliation
effect (which ran on every annotation/selection change) into a dedicated effect
guarded by a hasInitializedRef, so it fires only once when chart and series
first become available.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

openspec/changes/code-review-fix/tasks.md

@@ -72,7 +72,7 @@
 
 - [x] 8.1 `[opus]` Fix SpanAnnotationManager preview primitive memory leak: replace `useState` with `useRef` for preview primitive, add cleanup on unmount (`src/components/SpanAnnotationManager.tsx:265-324`)
 - [x] 8.2 `[sonnet]` Use `chart.applyOptions()` for theme changes instead of re-creating chart (`src/components/CandleChart.tsx:333`)
-- [ ] 8.3 `[sonnet]` Remove `fitContent()` from reconciliation effect, only call on initial load (`src/components/SpanAnnotationManager.tsx:160`)
+- [x] 8.3 `[sonnet]` Remove `fitContent()` from reconciliation effect, only call on initial load (`src/components/SpanAnnotationManager.tsx:160`)
 - [ ] 8.4 `[opus]` Implement incremental primitive updates in SpanAnnotationManager: update only selection state on selection change, full reconciliation only on annotation list changes (`src/components/SpanAnnotationManager.tsx:104-161`)
 - [ ] 8.5 `[sonnet]` Add bounded prediction cache (max 100 entries, FIFO eviction) to `predictionCacheRef` (`src/app/page.tsx:195-199`)
 - [ ] 8.6 `[sonnet]` Fix hardcoded 1-minute candle interval: detect interval from data, use for span iteration (`src/components/CandleChart.tsx:452`)

src/components/SpanAnnotationManager.tsx

@@ -74,6 +74,7 @@ export default function SpanAnnotationManager({
   const [editingSpan, setEditingSpan] = useState<SpanAnnotation | null>(null);
   const primitivesRef = useRef<Map<number, SpanRectanglePrimitive>>(new Map());
   const selectedSpanIdRef = useRef<number | null>(selectedSpanId);
+  const hasInitializedRef = useRef(false);
 
   // Keep selectedSpanIdRef in sync with prop
   useEffect(() => {
@@ -175,11 +176,16 @@ export default function SpanAnnotationManager({
       series.attachPrimitive(primitive);
       primitivesRef.current.set(span.id, primitive);
     });
-
-    // Request chart update
-    chart.timeScale().fitContent();
   }, [spanAnnotations, selectedSpanId, series, chart, candles]);
 
+  // Fit chart content only on initial load when chart and series become available
+  useEffect(() => {
+    if (!chart || !series) return;
+    if (hasInitializedRef.current) return;
+    hasInitializedRef.current = true;
+    chart.timeScale().fitContent();
+  }, [chart, series]);
+
   // Handle clicks on chart for span tool and span selection
   useEffect(() => {
     if (!chart || !series) return;