일목균형표 수정

frontend/src/components/strategyEditor/FlowNodes.tsx

@@ -2,10 +2,12 @@ import React, { memo, useCallback, useState } from 'react';
 import { Handle, Position, useConnection, useReactFlow, type NodeProps } from '@xyflow/react';
 import {
   isStartNodeId,
-  STRATEGY_CANDLE_TYPES,
   type HandleSide,
   type StrategyFlowNodeData,
 } from '../../utils/strategyFlowLayout';
+import { getStartCandleTypes } from '../../utils/strategyStartNodes';
+import StartTimeframeCheckboxes from './StartTimeframeCheckboxes';
+import LogicGateOpToggle from './LogicGateOpToggle';
 import { hasNodeSettings } from '../../utils/conditionPeriods';
 import { getStrategyIndicatorDisplayName } from '../../utils/strategyPaletteStorage';
 import ConditionNodeSettings from './ConditionNodeSettings';
@@ -132,7 +134,9 @@ export const StartNode = memo(function StartNode({ id, data }: NodeProps) {
   const d = data as StrategyFlowNodeData;
   const isSell = d.signalTab === 'sell';
   const { onDragOver, onDragLeave, onDrop } = usePaletteDropHandlers(id, d);
-  const candleType = d.candleType ?? '1m';
+  const candleTypes = d.candleTypes?.length
+    ? d.candleTypes
+    : getStartCandleTypes({ candleType: d.candleType ?? '1m' });
   const canDelete = id !== '__strategy_start__' && !!d.onDeleteStart;
 
   const stop = (e: React.SyntheticEvent) => e.stopPropagation();
@@ -150,35 +154,32 @@ export const StartNode = memo(function StartNode({ id, data }: NodeProps) {
         activeSourceSide={d.activeSourceSide}
         canSourceConnect={d.canSourceConnect !== false}
       />
-      <div className="se-flow-start-head">
-        <div className="se-flow-start-dot" />
-        <span className="se-flow-start-label">START</span>
-        <select
-          className="se-flow-start-tf"
-          value={candleType}
-          title="조건 판별 시간봉"
-          onPointerDown={stop}
-          onMouseDown={stop}
-          onClick={stop}
-          onChange={e => d.onStartCandleTypeChange?.(id, e.target.value)}
-        >
-          {STRATEGY_CANDLE_TYPES.map(ct => (
-            <option key={ct} value={ct}>{ct}</option>
-          ))}
-        </select>
-        {canDelete && (
-          <button
-            type="button"
-            className="se-flow-del se-flow-del--start"
-            title="START 삭제"
-            onClick={e => {
-              e.stopPropagation();
-              d.onDeleteStart?.(id);
-            }}
-          >
-            ×
-          </button>
-        )}
+      <div className="se-flow-start-layout">
+        <div className="se-flow-start-title-row">
+          <div className="se-flow-start-title-left">
+            <div className="se-flow-start-dot" />
+            <span className="se-flow-start-label">START</span>
+          </div>
+          {canDelete && (
+            <button
+              type="button"
+              className="se-flow-del se-flow-del--start"
+              title="START 삭제"
+              onClick={e => {
+                e.stopPropagation();
+                d.onDeleteStart?.(id);
+              }}
+            >
+              ×
+            </button>
+          )}
+        </div>
+        <StartTimeframeCheckboxes
+          layout="graph"
+          className="se-flow-start-tf-checks-wrap"
+          selected={candleTypes}
+          onChange={types => d.onStartCandleTypesChange?.(id, types)}
+        />
       </div>
     </div>
   );
@@ -206,7 +207,15 @@ export const LogicGateNode = memo(function LogicGateNode({ id, data, selected }:
         canTargetConnect={d.canTargetConnect !== false}
       />
       <div className="se-flow-gate-head">
-        <span className="se-flow-gate-badge">[{node.type}]</span>
+        {node.type === 'AND' || node.type === 'OR' ? (
+          <LogicGateOpToggle
+            value={node.type}
+            onChange={op => d.onChangeLogicGateType?.(id, op)}
+            compact
+          />
+        ) : (
+          <span className="se-flow-gate-badge">[{node.type}]</span>
+        )}
       </div>
       {(node.children ?? []).length === 0 && (
         <span className="se-flow-gate-hint">조건을 드롭하세요</span>