chore: import clean Agent Desk snapshot (1/7)

flowgram-editor/src/components/testrun/testrun-form/index.tsx

@@ -0,0 +1,130 @@
+/**
+ * Copyright (c) 2025 Bytedance Ltd. and/or its affiliates
+ * SPDX-License-Identifier: MIT
+ */
+
+import { FC } from 'react';
+
+import classNames from 'classnames';
+import { DisplaySchemaTag } from '@flowgram.ai/form-materials';
+import { Input, Switch, InputNumber } from '@douyinfe/semi-ui';
+
+import { JsonValueEditor } from '../json-value-editor';
+import { useFormMeta } from '../hooks/use-form-meta';
+import { useFields } from '../hooks/use-fields';
+import { useSyncDefault } from '../hooks';
+
+import styles from './index.module.less';
+
+interface TestRunFormProps {
+  values: Record<string, unknown>;
+  setValues: (values: Record<string, unknown>) => void;
+}
+
+export const TestRunForm: FC<TestRunFormProps> = ({ values, setValues }) => {
+  const formMeta = useFormMeta();
+
+  const fields = useFields({
+    formMeta,
+    values,
+    setValues,
+  });
+
+  useSyncDefault({
+    formMeta,
+    values,
+    setValues,
+  });
+
+  const renderField = (field: any) => {
+    switch (field.type) {
+      case 'boolean':
+        return (
+          <div className={styles.fieldInput}>
+            <Switch checked={field.value} onChange={(checked) => field.onChange(checked)} />
+          </div>
+        );
+      case 'integer':
+        return (
+          <div className={styles.fieldInput}>
+            <InputNumber
+              precision={0}
+              value={field.value}
+              onChange={(value) => field.onChange(value)}
+              placeholder="Please input integer"
+            />
+          </div>
+        );
+      case 'number':
+        return (
+          <div className={styles.fieldInput}>
+            <InputNumber
+              value={field.value}
+              onChange={(value) => field.onChange(value)}
+              placeholder="Please input number"
+            />
+          </div>
+        );
+      case 'object':
+        return (
+          <div className={classNames(styles.fieldInput, styles.codeEditorWrapper)}>
+            <JsonValueEditor value={field.value} onChange={(value) => field.onChange(value)} />
+          </div>
+        );
+      case 'array':
+        return (
+          <div className={classNames(styles.fieldInput, styles.codeEditorWrapper)}>
+            <JsonValueEditor value={field.value} onChange={(value) => field.onChange(value)} />
+          </div>
+        );
+      default:
+        return (
+          <div className={styles.fieldInput}>
+            <Input
+              value={field.value}
+              onChange={(value) => field.onChange(value)}
+              placeholder="Please input text"
+            />
+          </div>
+        );
+    }
+  };
+
+  // Show empty state if no fields
+  if (fields.length === 0) {
+    return (
+      <div className={styles.formContainer}>
+        <div className={styles.emptyState}>
+          <div className={styles.emptyText}>Empty</div>
+          <div className={styles.emptyText}>No inputs found in start node</div>
+        </div>
+      </div>
+    );
+  }
+
+  return (
+    <div className={styles.formContainer}>
+      {fields.map((field) => (
+        <div key={field.name} className={styles.fieldGroup}>
+          <label htmlFor={field.name} className={styles.fieldLabel}>
+            {field.name}
+            {field.required && <span className={styles.requiredIndicator}>*</span>}
+            <span className={styles.fieldTypeIndicator}>
+              <DisplaySchemaTag
+                value={{
+                  type: field.type,
+                  items: field.itemsType
+                    ? {
+                        type: field.itemsType,
+                      }
+                    : undefined,
+                }}
+              />
+            </span>
+          </label>
+          {renderField(field)}
+        </div>
+      ))}
+    </div>
+  );
+};