가상투자 화면 추가

frontend/src/components/virtual/VirtualConditionList.tsx

@@ -0,0 +1,28 @@
+import React from 'react';
+import type { ConditionMetric } from '../../utils/virtualSignalMetrics';
+import ConditionStatusSignal from './ConditionStatusSignal';
+
+interface Props {
+  metrics: ConditionMetric[];
+}
+
+const VirtualConditionList: React.FC<Props> = ({ metrics }) => {
+  if (metrics.length === 0) {
+    return <p className="vtd-cond-list-empty vtd-muted">조건 없음</p>;
+  }
+
+  return (
+    <ul className="vtd-cond-list" aria-label="전략 조건 목록">
+      {metrics.map(({ row, status, progress }) => (
+        <li key={row.id} className="vtd-cond-list-item">
+          <span className="vtd-cond-list-name" title={row.displayName}>
+            {row.displayName}
+          </span>
+          <ConditionStatusSignal status={status} progress={progress} compact />
+        </li>
+      ))}
+    </ul>
+  );
+};
+
+export default VirtualConditionList;