실시간 차트 오류수정

frontend/src/components/TradingChart.tsx

@@ -4,6 +4,9 @@ import type { OHLCVBar, ChartType, Theme, IndicatorConfig, LegendData, Drawing,
 import { ChartManager } from '../utils/ChartManager';
 import { setIndicatorChartContext } from '../utils/indicatorRegistry';
 import { DISPLAY_COUNT } from '../hooks/useUpbitData';
+
+/** Upbit 실시간 — 초기 히스토리가 이 개수 미만이면 setData 하지 않음 (종목 전환 직후 1~2봉만 로드되는 깨짐 방지) */
+const MIN_BARS_FOR_FULL_RELOAD = Math.min(50, Math.floor(DISPLAY_COUNT / 4));
 import DrawingCanvas, { hitTestDrawing } from './DrawingCanvas';
 import PaneLegend, { type PaneLegendProps } from './PaneLegend';
 import ChartHoverToolbar from './ChartHoverToolbar';
@@ -274,6 +277,25 @@ const TradingChart: React.FC<TradingChartProps> = ({
     inds: IndicatorConfig[],
   ) => Promise<void>>(async () => {});
 
+  const queueFullReload = useCallback(() => {
+    if (recoveryTimerRef.current) clearTimeout(recoveryTimerRef.current);
+    recoveryTimerRef.current = window.setTimeout(() => {
+      recoveryTimerRef.current = null;
+      const m = managerRef.current;
+      const barData = barsRef.current;
+      const inds = indicatorsRef.current;
+      if (!m || barData.length === 0) return;
+      if (barsMarket !== undefined && barsMarket !== market) return;
+      if (market.startsWith('KRW-') && barData.length < MIN_BARS_FOR_FULL_RELOAD) return;
+      prevBarsKey.current = '';
+      reloadAllRef.current?.(
+        m, barData,
+        prevChartType.current, prevTheme.current, prevLogScale.current,
+        inds,
+      );
+    }, 80);
+  }, [market, barsMarket]);
+
   const queueIndicatorRecovery = useCallback(() => {
     if (recoveryTimerRef.current) clearTimeout(recoveryTimerRef.current);
     recoveryTimerRef.current = window.setTimeout(() => {
@@ -329,7 +351,7 @@ const TradingChart: React.FC<TradingChartProps> = ({
     mgr.setData(newBars, ct, th);
     if (gen !== reloadGenRef.current) {
       prevBarsKey.current = '';
-      queueIndicatorRecovery();
+      queueFullReload();
       return;
     }
     mgr.setTheme(th);
@@ -339,7 +361,7 @@ const TradingChart: React.FC<TradingChartProps> = ({
     for (const ind of inds) {
       if (gen !== reloadGenRef.current) {
         prevBarsKey.current = '';
-        queueIndicatorRecovery();
+        queueFullReload();
         return;
       }
       await mgr.addIndicator(ind);
@@ -347,7 +369,7 @@ const TradingChart: React.FC<TradingChartProps> = ({
 
     if (gen !== reloadGenRef.current) {
       prevBarsKey.current = '';
-      queueIndicatorRecovery();
+      queueFullReload();
       return;
     }
 
@@ -360,7 +382,7 @@ const TradingChart: React.FC<TradingChartProps> = ({
         reloadRetryRef.current += 1;
         await mgr.reloadIndicatorsOnly(inds);
         if (gen !== reloadGenRef.current) {
-          queueIndicatorRecovery();
+          queueFullReload();
           return;
         }
       }
@@ -392,7 +414,7 @@ const TradingChart: React.FC<TradingChartProps> = ({
 
     if (gen !== reloadGenRef.current) {
       prevBarsKey.current = '';
-      queueIndicatorRecovery();
+      queueFullReload();
       return;
     }
 
@@ -416,7 +438,7 @@ const TradingChart: React.FC<TradingChartProps> = ({
         if (delay === 1400) onDataLoaded?.();
       }, delay)
     );
-  }, [applyPaneLayout, onDataLoaded, displayTimezone, timeframe, market, queueIndicatorRecovery]);
+  }, [applyPaneLayout, onDataLoaded, displayTimezone, timeframe, market, queueFullReload]);
 
   useEffect(() => {
     reloadAllRef.current = reloadAll;
@@ -740,6 +762,7 @@ const TradingChart: React.FC<TradingChartProps> = ({
       ? true
       : barsMarket === market;
     if (!barsReady) return;
+    if (market.startsWith('KRW-') && bars.length < MIN_BARS_FOR_FULL_RELOAD) return;
 
     // manager 준비 전 bars 가 먼저 도착한 경우(로그인 직후 등) 메인 시리즈 누락 방지
     if (!mgr.hasMainSeries()) {