연결 설명 필드 추가 및 외부 호출 설정 개선

frontend/components/dataflow/connection/ExternalCallSettings.tsx

@@ -27,7 +27,7 @@ export const ExternalCallSettings: React.FC<ExternalCallSettingsProps> = ({ sett
           </Label>
           <Select
             value={settings.callType}
-            onValueChange={(value: "rest-api" | "email" | "webhook" | "ftp" | "queue") =>
+            onValueChange={(value: "rest-api" | "email" | "webhook" | "kakao-talk" | "ftp" | "queue") =>
               onSettingsChange({ ...settings, callType: value })
             }
           >
@@ -36,6 +36,7 @@ export const ExternalCallSettings: React.FC<ExternalCallSettingsProps> = ({ sett
             </SelectTrigger>
             <SelectContent>
               <SelectItem value="rest-api">REST API 호출</SelectItem>
+              <SelectItem value="kakao-talk"> 카카오톡 알림</SelectItem>
               <SelectItem value="email">이메일 전송</SelectItem>
               <SelectItem value="webhook">웹훅</SelectItem>
               <SelectItem value="ftp">FTP 업로드</SelectItem>
@@ -109,6 +110,64 @@ export const ExternalCallSettings: React.FC<ExternalCallSettingsProps> = ({ sett
             </div>
           </>
         )}
+
+        {settings.callType === "kakao-talk" && (
+          <>
+            <div>
+              <Label htmlFor="kakaoAccessToken" className="text-sm">
+                카카오 액세스 토큰 <span className="text-red-500">*</span>
+              </Label>
+              <Input
+                id="kakaoAccessToken"
+                type="password"
+                value={settings.kakaoAccessToken || ""}
+                onChange={(e) =>
+                  onSettingsChange({
+                    ...settings,
+                    kakaoAccessToken: e.target.value,
+                  })
+                }
+                placeholder="카카오 개발자 센터에서 발급받은 토큰"
+                className="text-sm"
+              />
+              <p className="mt-1 text-xs text-gray-600">
+                💡{" "}
+                <a
+                  href="https://developers.kakao.com"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="text-blue-500 hover:underline"
+                >
+                  카카오 개발자 센터
+                </a>
+                에서 앱 등록 후 토큰을 발급받으세요
+              </p>
+            </div>
+
+            <div>
+              <Label htmlFor="kakaoMessage" className="text-sm">
+                메시지 템플릿 <span className="text-red-500">*</span>
+              </Label>
+              <Textarea
+                id="kakaoMessage"
+                value={settings.bodyTemplate || ""}
+                onChange={(e) =>
+                  onSettingsChange({
+                    ...settings,
+                    bodyTemplate: e.target.value,
+                  })
+                }
+                placeholder="안녕하세요! {{customer_name}}님의 주문({{order_id}})이 처리되었습니다."
+                rows={3}
+                className="text-sm"
+              />
+              <p className="mt-1 text-xs text-gray-600">
+                💡 {"{{"} 필드명 {"}"} 형태로 데이터를 삽입할 수 있습니다 (예: {"{{"} user_name {"}"}, {"{{"} amount{" "}
+                {"}"})
+              </p>
+            </div>
+          </>
+        )}
       </div>
     </div>
   );