From 364fa0cbc036acc5a3a5441ae6687818a1a7b08b Mon Sep 17 00:00:00 2001
From: Junyan Qin <rockchinq@gmail.com>
Date: Thu, 8 May 2025 18:33:29 +0800
Subject: [PATCH] perf: make runner detailed config form dynamicly hideaway

---
 web/src/app/home/models/page.tsx              |  2 +-
 .../pipeline-form/PipelineFormComponent.tsx   | 34 +++++++++++++++++++
 2 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/web/src/app/home/models/page.tsx b/web/src/app/home/models/page.tsx
index 1856111c..6c47470e 100644
--- a/web/src/app/home/models/page.tsx
+++ b/web/src/app/home/models/page.tsx
@@ -8,7 +8,7 @@ import LLMCard from '@/app/home/models/component/llm-card/LLMCard';
 import LLMForm from '@/app/home/models/component/llm-form/LLMForm';
 import CreateCardComponent from '@/app/infra/basic-component/create-card-component/CreateCardComponent';
 import { httpClient } from '@/app/infra/http/HttpClient';
-import { LLMModel } from '@/app/infra/api/api-types';
+import { LLMModel } from '@/app/infra/entities/api';
 import {
   Dialog,
   DialogContent,
diff --git a/web/src/app/home/pipelines/components/pipeline-form/PipelineFormComponent.tsx b/web/src/app/home/pipelines/components/pipeline-form/PipelineFormComponent.tsx
index c64c3149..d3c1f21a 100644
--- a/web/src/app/home/pipelines/components/pipeline-form/PipelineFormComponent.tsx
+++ b/web/src/app/home/pipelines/components/pipeline-form/PipelineFormComponent.tsx
@@ -209,6 +209,40 @@ export default function PipelineFormComponent({
   }
 
   function renderDynamicForms(stage: PipelineConfigStage, formName: keyof FormValues) {
+    // 如果是 AI 配置，需要特殊处理
+    if (formName === 'ai') {
+      // 获取当前选择的 runner
+      const currentRunner = form.watch('ai.runner.runner');
+      
+      // 如果是 runner 配置项，直接渲染
+      if (stage.name === 'runner') {
+        return (
+          <div key={stage.name} className="space-y-4 mb-6">
+            <div className="text-lg font-medium">{stage.label.zh_CN}</div>
+            {stage.description && (
+              <div className="text-sm text-gray-500">{stage.description.zh_CN}</div>
+            )}
+            <DynamicFormComponent
+              itemConfigList={stage.config}
+              initialValues={(form.watch(formName) as Record<string, any>)?.[stage.name] || {}}
+              onSubmit={(values) => {
+                const currentValues = form.getValues(formName) as Record<string, any> || {};
+                form.setValue(formName, {
+                  ...currentValues,
+                  [stage.name]: values,
+                });
+              }}
+            />
+          </div>
+        );
+      }
+      
+      // 如果不是当前选择的 runner 对应的配置项，则不渲染
+      if (stage.name !== currentRunner) {
+        return null;
+      }
+    }
+
     return (
       <div key={stage.name} className="space-y-4 mb-6">
         <div className="text-lg font-medium">{stage.label.zh_CN}</div>