From 30ea3cb7028647d712044baeb96c113e51dc5011 Mon Sep 17 00:00:00 2001 From: Joel Date: Tue, 12 Mar 2024 17:58:51 +0800 Subject: [PATCH] feat: can run code node --- .../components/variable/output-var-list.tsx | 41 ++++++++++++------- .../nodes/_base/hooks/use-one-step-run.ts | 31 ++++++++++++-- .../nodes/_base/hooks/use-output-var-list.ts | 19 +++++---- .../components/workflow/nodes/code/panel.tsx | 6 +-- .../components/workflow/nodes/code/types.ts | 15 +++++-- .../workflow/nodes/code/use-config.ts | 4 +- 6 files changed, 81 insertions(+), 35 deletions(-) diff --git a/web/app/components/workflow/nodes/_base/components/variable/output-var-list.tsx b/web/app/components/workflow/nodes/_base/components/variable/output-var-list.tsx index dfd6952ceb..09437be694 100644 --- a/web/app/components/workflow/nodes/_base/components/variable/output-var-list.tsx +++ b/web/app/components/workflow/nodes/_base/components/variable/output-var-list.tsx @@ -2,45 +2,56 @@ import type { FC } from 'react' import React, { useCallback } from 'react' import produce from 'immer' -import type { OutputVar } from '../../../code/types' +import type { OutputVar, OutputVarType } from '../../../code/types' import RemoveButton from '../remove-button' import VarTypePicker from './var-type-picker' type Props = { readonly: boolean - list: OutputVar[] - onChange: (list: OutputVar[]) => void + outputs: OutputVar + onChange: (payload: OutputVar) => void } const OutputVarList: FC = ({ readonly, - list, + outputs, onChange, }) => { + const list = (Object.keys(outputs)).map((key) => { + return { + variable: key, + variable_type: outputs[key].type, + } + }) const handleVarNameChange = useCallback((index: number) => { return (e: React.ChangeEvent) => { - const newList = produce(list, (draft) => { - draft[index].variable = e.target.value + const oldKey = list[index].variable + const newOutputs = produce(outputs, (draft) => { + const newKey = e.target.value + draft[newKey] = draft[oldKey] + delete draft[oldKey] }) - onChange(newList) + onChange(newOutputs) } }, [list, onChange]) - const handleVarChange = useCallback((index: number) => { + const handleVarTypeChange = useCallback((index: number) => { return (value: string) => { - const newList = produce(list, (draft) => { - draft[index].variable_type = value + const key = list[index].variable + const newOutputs = produce(outputs, (draft) => { + draft[key].type = value as OutputVarType }) - onChange(newList) + onChange(newOutputs) } }, [list, onChange]) const handleVarRemove = useCallback((index: number) => { return () => { - const newList = produce(list, (draft) => { - draft.splice(index, 1) + const key = list[index].variable + const newOutputs = produce(outputs, (draft) => { + delete draft[key] }) - onChange(newList) + onChange(newOutputs) } }, [list, onChange]) @@ -57,7 +68,7 @@ const OutputVarList: FC = ({ = { id: string @@ -13,6 +15,8 @@ type Params = { } const useOneStepRun = ({ id, data, defaultRunInputData, isInvalid = () => true }: Params) => { + const { t } = useTranslation() + const appId = useAppStore.getState().appDetail?.id const [runInputData, setRunInputData] = useState>(defaultRunInputData || {}) @@ -38,9 +42,30 @@ const useOneStepRun = ({ id, data, defaultRunInputData, isInvalid = () => tru _singleRunningStatus: NodeRunningStatus.Running, }, }) - - const res = await singleNodeRun(appId!, id, { inputs: runInputData }) - console.log(res) + try { + const res = await singleNodeRun(appId!, id, { inputs: runInputData }) + } + catch (e) { + handleNodeDataUpdate({ + id, + data: { + ...data, + _singleRunningStatus: NodeRunningStatus.Failed, + }, + }) + return false + } + handleNodeDataUpdate({ + id, + data: { + ...data, + _singleRunningStatus: NodeRunningStatus.Succeeded, + }, + }) + Toast.notify({ + type: 'success', + message: t('common.api.success'), + }) } const handleStop = () => { diff --git a/web/app/components/workflow/nodes/_base/hooks/use-output-var-list.ts b/web/app/components/workflow/nodes/_base/hooks/use-output-var-list.ts index 48661c97d3..b21b0b7b1f 100644 --- a/web/app/components/workflow/nodes/_base/hooks/use-output-var-list.ts +++ b/web/app/components/workflow/nodes/_base/hooks/use-output-var-list.ts @@ -1,6 +1,6 @@ import { useCallback } from 'react' import produce from 'immer' -import type { OutputVar } from '../../code/types' +import { type OutputVar, OutputVarType } from '../../code/types' type Params = { inputs: T setInputs: (newInputs: T) => void @@ -11,25 +11,28 @@ function useOutputVarList({ setInputs, varKey = 'outputs', }: Params) { - const handleVarListChange = useCallback((newList: OutputVar[]) => { + const handleVarsChange = useCallback((newVars: OutputVar) => { const newInputs = produce(inputs, (draft: any) => { - draft[varKey] = newList + draft[varKey] = newVars }) setInputs(newInputs) }, [inputs, setInputs, varKey]) const handleAddVariable = useCallback(() => { const newInputs = produce(inputs, (draft: any) => { - draft[varKey].push({ - variable: '', - variable_type: 'string', - }) + draft[varKey] = { + ...draft[varKey], + [`var-${Object.keys(draft[varKey]).length + 1}`]: { + type: OutputVarType.string, + children: null, + }, + } }) setInputs(newInputs) }, [inputs, setInputs, varKey]) return { - handleVarListChange, + handleVarsChange, handleAddVariable, } } diff --git a/web/app/components/workflow/nodes/code/panel.tsx b/web/app/components/workflow/nodes/code/panel.tsx index 7c8399c5e1..7a3ddd5c7e 100644 --- a/web/app/components/workflow/nodes/code/panel.tsx +++ b/web/app/components/workflow/nodes/code/panel.tsx @@ -39,7 +39,7 @@ const Panel: FC> = ({ handleAddVariable, handleCodeChange, handleCodeLanguageChange, - handleOutputVarListChange, + handleVarsChange, handleAddOutputVariable, // single run isShowSingleRun, @@ -91,8 +91,8 @@ const Panel: FC> = ({ > diff --git a/web/app/components/workflow/nodes/code/types.ts b/web/app/components/workflow/nodes/code/types.ts index 9039325071..f7953f61d5 100644 --- a/web/app/components/workflow/nodes/code/types.ts +++ b/web/app/components/workflow/nodes/code/types.ts @@ -6,14 +6,21 @@ export enum CodeLanguage { json = 'json', } -export type OutputVar = { - variable: string - variable_type: string +export enum OutputVarType { + string = 'string', + number = 'number', + boolean = 'boolean', + object = 'object', } +export type OutputVar = Record + export type CodeNodeType = CommonNodeType & { variables: Variable[] code_language: CodeLanguage code: string - outputs: OutputVar[] + outputs: OutputVar } diff --git a/web/app/components/workflow/nodes/code/use-config.ts b/web/app/components/workflow/nodes/code/use-config.ts index b3ef5c999a..97d47c9329 100644 --- a/web/app/components/workflow/nodes/code/use-config.ts +++ b/web/app/components/workflow/nodes/code/use-config.ts @@ -27,7 +27,7 @@ const useConfig = (id: string, payload: CodeNodeType) => { setInputs(newInputs) }, [inputs, setInputs]) - const { handleVarListChange: handleOutputVarListChange, handleAddVariable: handleAddOutputVariable } = useOutputVarList({ + const { handleVarsChange, handleAddVariable: handleAddOutputVariable } = useOutputVarList({ inputs, setInputs, }) @@ -68,7 +68,7 @@ const useConfig = (id: string, payload: CodeNodeType) => { handleAddVariable, handleCodeChange, handleCodeLanguageChange, - handleOutputVarListChange, + handleVarsChange, handleAddOutputVariable, // single run isShowSingleRun,