전략평가 수정

frontend/src/components/StrategyEvaluationPage.tsx

@@ -7,17 +7,18 @@ import '../styles/virtualTradingDashboard.css';
 import '../styles/strategyEditorTheme.css';
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import type { Theme, Timeframe } from '../types';
+import type { VirtualIndicatorSnapshot } from '../hooks/useVirtualIndicatorSnapshots';
 import {
   loadStrategies,
   loadStrategy,
+  type BacktestSignal,
   type StrategyDto,
 } from '../utils/backendApi';
 import { hydrateStrategyDto } from '../utils/strategyHydrate';
 import { repairUtf8Mojibake } from '../utils/textEncoding';
 import { resolveStrategyPrimaryTimeframe } from '../utils/strategyToChartIndicators';
 import { fetchEvaluationSnapshotAtBar } from '../utils/strategyEvaluationSnapshot';
-import type { VirtualIndicatorSnapshot } from '../hooks/useVirtualIndicatorSnapshots';
-import VirtualTargetSignalPanel from './virtual/VirtualTargetSignalPanel';
+import StrategyEvaluationSignalPanel from './strategyEvaluation/StrategyEvaluationSignalPanel';
 import StrategyEvaluationChart from './strategyEvaluation/StrategyEvaluationChart';
 import StrategyEvaluationSettingsTab from './strategyEvaluation/StrategyEvaluationSettingsTab';
 import SePanelCollapseHandle from './strategyEditor/SePanelCollapseHandle';
@@ -34,6 +35,7 @@ import {
   resolveBacktestExecTimeframe,
   type BacktestRunTimeframeChoice,
 } from '../utils/backtestRunTimeframe';
+import { resolveBarSignalHighlight } from '../utils/strategyEvaluationBarSignals';
 import type { OHLCVBar } from '../types';
 
 const LEFT_KEY = 'seval-left-width';
@@ -71,6 +73,7 @@ export default function StrategyEvaluationPage({ theme = 'dark' }: Props) {
   const [appliedIndicatorParams, setAppliedIndicatorParams] = useState<EvalIndicatorParams | null>(null);
   const [paramsRevision, setParamsRevision] = useState(0);
   const [chartLoading, setChartLoading] = useState(false);
+  const [backtestSignals, setBacktestSignals] = useState<BacktestSignal[]>([]);
   const evalSessionRef = useRef(0);
   const paramsRevisionRef = useRef(paramsRevision);
 
@@ -189,6 +192,15 @@ export default function StrategyEvaluationPage({ theme = 'dark' }: Props) {
 
   const selectedBarTimeSec = bars[selectedBarIndex]?.time ?? null;
 
+  const barSignalHighlight = useMemo(
+    () => resolveBarSignalHighlight(backtestSignals, selectedBarTimeSec),
+    [backtestSignals, selectedBarTimeSec],
+  );
+
+  const handleSignalsChange = useCallback((signals: BacktestSignal[]) => {
+    setBacktestSignals(signals);
+  }, []);
+
   const refreshEvaluation = useCallback(async () => {
     if (!selectedStrategyId || !selectedStrategy) {
       setSnapshot(undefined);
@@ -410,6 +422,7 @@ export default function StrategyEvaluationPage({ theme = 'dark' }: Props) {
               getParamsOverride={getEvalParams}
               getVisualConfigOverride={getVisualConfig}
               evalLoading={evalLoading}
+              onSignalsChange={handleSignalsChange}
             />
           </div>
         </main>
@@ -443,9 +456,9 @@ export default function StrategyEvaluationPage({ theme = 'dark' }: Props) {
                 <span className="seval-eval-loading-text">전략 조건 확인 중…</span>
               </div>
             )}
-            <VirtualTargetSignalPanel
+            <StrategyEvaluationSignalPanel
               snapshot={snapshot}
-              viewMode="summary"
+              barSignalHighlight={barSignalHighlight}
               loading={evalLoading}
               loadingMessage="전략 조건 확인 중…"
               hasStrategy={selectedStrategyId != null}