매매 시그널 디테일 팝업 기능 적용

frontend/src/utils/liveTradeTimeline.ts

@@ -9,6 +9,14 @@ import type {
 
 export type LiveTimelineEventKind = 'SIGNAL' | 'ORDER_PENDING' | 'FILL';
 
+export interface LiveTimelineSignalMeta {
+  signalId: number;
+  candleTime: number;
+  candleType: string;
+  executionType: string;
+  strategyId?: number | null;
+}
+
 export interface LiveTimelineFilter {
   symbol?: string;
   strategyId?: number | null;
@@ -25,6 +33,8 @@ export interface LiveTimelineEvent {
   strategyName?: string | null;
   sourceLabel?: string;
   detail?: string;
+  /** kind === 'SIGNAL' 일 때만 채워짐 */
+  signalMeta?: LiveTimelineSignalMeta;
 }
 
 export const LIVE_TIMELINE_KIND_LABEL: Record<LiveTimelineEventKind, string> = {
@@ -79,6 +89,13 @@ export function buildLiveTradeTimeline(
       price: s.price,
       strategyName: s.strategyName,
       detail: [s.candleType, s.executionType].filter(Boolean).join(' · ') || undefined,
+      signalMeta: {
+        signalId: s.id,
+        candleTime: s.candleTime > 1e12 ? Math.floor(s.candleTime / 1000) : s.candleTime,
+        candleType: s.candleType,
+        executionType: s.executionType,
+        strategyId: s.strategyId,
+      },
     });
   }
 
@@ -230,3 +247,27 @@ export function formatTimelineTime(ts: number): string {
   return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} `
     + `${pad(d.getHours())}:${pad(d.getMinutes())}:${pad(d.getSeconds())}`;
 }
+
+/** 타임라인 SIGNAL 이벤트 → 상세 팝업용 메타 */
+export interface TimelineSignalDetailSource {
+  side: 'BUY' | 'SELL';
+  price: number;
+  symbol: string;
+  strategyName?: string | null;
+  ts: number;
+  signalMeta: LiveTimelineSignalMeta;
+}
+
+export function toTimelineSignalDetail(
+  ev: LiveTimelineEvent,
+): TimelineSignalDetailSource | null {
+  if (ev.kind !== 'SIGNAL' || !ev.signalMeta) return null;
+  return {
+    side: ev.side,
+    price: ev.price,
+    symbol: ev.symbol,
+    strategyName: ev.strategyName,
+    ts: ev.ts,
+    signalMeta: ev.signalMeta,
+  };
+}