외부호출 기능(rest API)

frontend/components/dataflow/ConnectionSetupModal.tsx

@@ -23,6 +23,7 @@ import {
   SimpleExternalCallSettings,
   ConnectionSetupModalProps,
 } from "@/types/connectionTypes";
+import { ExternalCallConfig } from "@/types/external-call/ExternalCallTypes";
 import { isConditionalConnection } from "@/utils/connectionUtils";
 import { useConditionManager } from "@/hooks/useConditionManager";
 import { ConditionalSettings } from "./condition/ConditionalSettings";
@@ -30,6 +31,7 @@ import { ConnectionTypeSelector } from "./connection/ConnectionTypeSelector";
 import { SimpleKeySettings as SimpleKeySettingsComponent } from "./connection/SimpleKeySettings";
 import { DataSaveSettings as DataSaveSettingsComponent } from "./connection/DataSaveSettings";
 import { SimpleExternalCallSettings as ExternalCallSettingsComponent } from "./connection/SimpleExternalCallSettings";
+import ExternalCallPanel from "./external-call/ExternalCallPanel";
 import { toast } from "sonner";
 
 export const ConnectionSetupModal: React.FC<ConnectionSetupModalProps> = ({
@@ -60,6 +62,9 @@ export const ConnectionSetupModal: React.FC<ConnectionSetupModalProps> = ({
     message: "",
   });
 
+  // 새로운 외부호출 설정 상태 (분리된 컴포넌트용)
+  const [externalCallConfig, setExternalCallConfig] = useState<ExternalCallConfig | null>(null);
+
   // 테이블 및 컬럼 선택을 위한 상태들
   const [availableTables, setAvailableTables] = useState<TableInfo[]>([]);
   const [selectedFromTable, setSelectedFromTable] = useState<string>("");
@@ -390,14 +395,21 @@ export const ConnectionSetupModal: React.FC<ConnectionSetupModalProps> = ({
         }
         break;
       case "external-call":
-        // 외부 호출은 plan에 저장
-        plan = {
-          externalCall: {
-            configId: externalCallSettings.configId,
-            configName: externalCallSettings.configName,
-            message: externalCallSettings.message,
-          },
-        };
+        // 새로운 외부호출 설정을 plan에 저장
+        if (externalCallConfig) {
+          plan = {
+            externalCall: externalCallConfig,
+          };
+        } else {
+          // 기존 설정 호환성 유지
+          plan = {
+            externalCall: {
+              configId: externalCallSettings.configId,
+              configName: externalCallSettings.configName,
+              message: externalCallSettings.message,
+            },
+          };
+        }
         settings = {}; // 외부 호출은 settings에 저장하지 않음
         break;
     }
@@ -507,6 +519,9 @@ export const ConnectionSetupModal: React.FC<ConnectionSetupModalProps> = ({
 
   // 연결 종류별 설정 패널 렌더링
   const renderConnectionTypeSettings = () => {
+    console.log("🔍 [ConnectionSetupModal] renderConnectionTypeSettings - connectionType:", config.connectionType);
+    console.log("🔍 [ConnectionSetupModal] externalCallConfig:", externalCallConfig);
+
     switch (config.connectionType) {
       case "simple-key":
         return (
@@ -540,8 +555,13 @@ export const ConnectionSetupModal: React.FC<ConnectionSetupModalProps> = ({
         );
 
       case "external-call":
+        console.log("🚀 [ConnectionSetupModal] Rendering ExternalCallPanel");
         return (
-          <ExternalCallSettingsComponent settings={externalCallSettings} onSettingsChange={setExternalCallSettings} />
+          <ExternalCallPanel
+            relationshipId={connection?.id || `temp-${Date.now()}`}
+            initialSettings={externalCallConfig}
+            onSettingsChange={setExternalCallConfig}
+          />
         );
 
       default:
@@ -631,8 +651,12 @@ export const ConnectionSetupModal: React.FC<ConnectionSetupModalProps> = ({
         return !hasActions || !allActionsHaveMappings || !allMappingsComplete || !allRequiredConditionsMet;
 
       case "external-call":
-        // 외부 호출: 설정 ID와 메시지가 있어야 함
-        return !externalCallSettings.configId || !externalCallSettings.message?.trim();
+        // 외부 호출: 새로운 설정이 있으면 API URL 검증, 없으면 기존 설정 검증
+        if (externalCallConfig) {
+          return !externalCallConfig.restApiSettings?.apiUrl?.trim();
+        } else {
+          return !externalCallSettings.configId || !externalCallSettings.message?.trim();
+        }
 
       default:
         return false;