diff --git a/web/src/pages/agent/form/iteration-form/dynamic-output.tsx b/web/src/pages/agent/form/iteration-form/dynamic-output.tsx
index 6b7e39e33..89a341a37 100644
--- a/web/src/pages/agent/form/iteration-form/dynamic-output.tsx
+++ b/web/src/pages/agent/form/iteration-form/dynamic-output.tsx
@@ -13,7 +13,7 @@ import { Input } from '@/components/ui/input';
import { Separator } from '@/components/ui/separator';
import { RAGFlowNodeType } from '@/interfaces/database/flow';
import { X } from 'lucide-react';
-import { ReactNode } from 'react';
+import { ReactNode, useCallback, useMemo } from 'react';
import { useFieldArray, useFormContext } from 'react-hook-form';
import { useTranslation } from 'react-i18next';
import { useBuildSubNodeOutputOptions } from './use-build-options';
@@ -28,6 +28,26 @@ export function DynamicOutputForm({ node }: IProps) {
const options = useBuildSubNodeOutputOptions(node?.id);
const name = 'outputs';
+ const flatOptions = useMemo(() => {
+ return options.reduce<{ label: string; value: string; type: string }[]>(
+ (pre, cur) => {
+ pre.push(...cur.options);
+ return pre;
+ },
+ [],
+ );
+ }, [options]);
+
+ const findType = useCallback(
+ (val: string) => {
+ const type = flatOptions.find((x) => x.value === val)?.type;
+ if (type) {
+ return `Array<${type}>`;
+ }
+ },
+ [flatOptions],
+ );
+
const { fields, remove, append } = useFieldArray({
name: name,
control: form.control,
@@ -36,12 +56,13 @@ export function DynamicOutputForm({ node }: IProps) {
return (
{fields.map((field, index) => {
- const typeField = `${name}.${index}.name`;
+ const nameField = `${name}.${index}.name`;
+ const typeField = `${name}.${index}.type`;
return (
(
@@ -64,12 +85,21 @@ export function DynamicOutputForm({ node }: IProps) {
{
+ form.setValue(typeField, findType(val));
+ field.onChange(val);
+ }}
>
)}
/>
+ }
+ />
diff --git a/web/src/pages/agent/form/iteration-form/interface.ts b/web/src/pages/agent/form/iteration-form/interface.ts
index 1a23c0a2e..25f22aab0 100644
--- a/web/src/pages/agent/form/iteration-form/interface.ts
+++ b/web/src/pages/agent/form/iteration-form/interface.ts
@@ -1,2 +1,2 @@
export type OutputArray = Array<{ name: string; ref: string; type?: string }>;
-export type OutputObject = Record;
+export type OutputObject = Record;
diff --git a/web/src/pages/agent/form/iteration-form/use-values.ts b/web/src/pages/agent/form/iteration-form/use-values.ts
index 7c686255d..29cd06324 100644
--- a/web/src/pages/agent/form/iteration-form/use-values.ts
+++ b/web/src/pages/agent/form/iteration-form/use-values.ts
@@ -8,6 +8,7 @@ function convertToArray(outputObject: OutputObject) {
return Object.entries(outputObject).map(([key, value]) => ({
name: key,
ref: value.ref,
+ type: value.type,
}));
}
diff --git a/web/src/pages/agent/form/iteration-form/use-watch-form-change.ts b/web/src/pages/agent/form/iteration-form/use-watch-form-change.ts
index b5d3d6264..be6f3fa0d 100644
--- a/web/src/pages/agent/form/iteration-form/use-watch-form-change.ts
+++ b/web/src/pages/agent/form/iteration-form/use-watch-form-change.ts
@@ -5,7 +5,7 @@ import { OutputArray, OutputObject } from './interface';
function transferToObject(list: OutputArray) {
return list.reduce((pre, cur) => {
- pre[cur.name] = { ref: cur.ref };
+ pre[cur.name] = { ref: cur.ref, type: cur.type };
return pre;
}, {});
}
@@ -18,6 +18,7 @@ export function useWatchFormChange(id?: string, form?: UseFormReturn) {
// Manually triggered form updates are synchronized to the canvas
if (id && form?.formState.isDirty) {
values = form?.getValues();
+ console.log('🚀 ~ useEffect ~ values:', values);
let nextValues: any = {
...values,
outputs: transferToObject(values.outputs),
diff --git a/web/src/pages/agent/index.tsx b/web/src/pages/agent/index.tsx
index 7a195289a..bdf51fcc1 100644
--- a/web/src/pages/agent/index.tsx
+++ b/web/src/pages/agent/index.tsx
@@ -7,14 +7,13 @@ import {
DropdownMenuSeparator,
DropdownMenuTrigger,
} from '@/components/ui/dropdown-menu';
-import { SidebarProvider, SidebarTrigger } from '@/components/ui/sidebar';
+import { SidebarProvider } from '@/components/ui/sidebar';
import { useSetModalState } from '@/hooks/common-hooks';
import { useNavigatePage } from '@/hooks/logic-hooks/navigate-hooks';
import { ReactFlowProvider } from '@xyflow/react';
import { CodeXml, EllipsisVertical, Forward, Import, Key } from 'lucide-react';
import { ComponentPropsWithoutRef, useCallback } from 'react';
import { useTranslation } from 'react-i18next';
-import { AgentSidebar } from './agent-sidebar';
import AgentCanvas from './canvas';
import { useHandleExportOrImportJsonFile } from './hooks/use-export-json';
import { useFetchDataOnMount } from './hooks/use-fetch-data';
@@ -119,9 +118,7 @@ export default function Agent() {