Introduce Plugins (#13836)

Signed-off-by: yihong0618 <zouzou0208@gmail.com> Signed-off-by: -LAN- <laipz8200@outlook.com> Signed-off-by: xhe <xw897002528@gmail.com> Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: takatost <takatost@gmail.com> Co-authored-by: kurokobo <kuro664@gmail.com> Co-authored-by: Novice Lee <novicelee@NoviPro.local> Co-authored-by: zxhlyh <jasonapring2015@outlook.com> Co-authored-by: AkaraChen <akarachen@outlook.com> Co-authored-by: Yi <yxiaoisme@gmail.com> Co-authored-by: Joel <iamjoel007@gmail.com> Co-authored-by: JzoNg <jzongcode@gmail.com> Co-authored-by: twwu <twwu@dify.ai> Co-authored-by: Hiroshi Fujita <fujita-h@users.noreply.github.com> Co-authored-by: AkaraChen <85140972+AkaraChen@users.noreply.github.com> Co-authored-by: NFish <douxc512@gmail.com> Co-authored-by: Wu Tianwei <30284043+WTW0313@users.noreply.github.com> Co-authored-by: 非法操作 <hjlarry@163.com> Co-authored-by: Novice <857526207@qq.com> Co-authored-by: Hiroki Nagai <82458324+nagaihiroki-git@users.noreply.github.com> Co-authored-by: Gen Sato <52241300+halogen22@users.noreply.github.com> Co-authored-by: eux <euxuuu@gmail.com> Co-authored-by: huangzhuo1949 <167434202+huangzhuo1949@users.noreply.github.com> Co-authored-by: huangzhuo <huangzhuo1@xiaomi.com> Co-authored-by: lotsik <lotsik@mail.ru> Co-authored-by: crazywoola <100913391+crazywoola@users.noreply.github.com> Co-authored-by: nite-knite <nkCoding@gmail.com> Co-authored-by: Jyong <76649700+JohnJyong@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: gakkiyomi <gakkiyomi@aliyun.com> Co-authored-by: CN-P5 <heibai2006@gmail.com> Co-authored-by: CN-P5 <heibai2006@qq.com> Co-authored-by: Chuehnone <1897025+chuehnone@users.noreply.github.com> Co-authored-by: yihong <zouzou0208@gmail.com> Co-authored-by: Kevin9703 <51311316+Kevin9703@users.noreply.github.com> Co-authored-by: -LAN- <laipz8200@outlook.com> Co-authored-by: Boris Feld <lothiraldan@gmail.com> Co-authored-by: mbo <himabo@gmail.com> Co-authored-by: mabo <mabo@aeyes.ai> Co-authored-by: Warren Chen <warren.chen830@gmail.com> Co-authored-by: JzoNgKVO <27049666+JzoNgKVO@users.noreply.github.com> Co-authored-by: jiandanfeng <chenjh3@wangsu.com> Co-authored-by: zhu-an <70234959+xhdd123321@users.noreply.github.com> Co-authored-by: zhaoqingyu.1075 <zhaoqingyu.1075@bytedance.com> Co-authored-by: 海狸大師 <86974027+yenslife@users.noreply.github.com> Co-authored-by: Xu Song <xusong.vip@gmail.com> Co-authored-by: rayshaw001 <396301947@163.com> Co-authored-by: Ding Jiatong <dingjiatong@gmail.com> Co-authored-by: Bowen Liang <liangbowen@gf.com.cn> Co-authored-by: JasonVV <jasonwangiii@outlook.com> Co-authored-by: le0zh <newlight@qq.com> Co-authored-by: zhuxinliang <zhuxinliang@didiglobal.com> Co-authored-by: k-zaku <zaku99@outlook.jp> Co-authored-by: luckylhb90 <luckylhb90@gmail.com> Co-authored-by: hobo.l <hobo.l@binance.com> Co-authored-by: jiangbo721 <365065261@qq.com> Co-authored-by: 刘江波 <jiangbo721@163.com> Co-authored-by: Shun Miyazawa <34241526+miya@users.noreply.github.com> Co-authored-by: EricPan <30651140+Egfly@users.noreply.github.com> Co-authored-by: crazywoola <427733928@qq.com> Co-authored-by: sino <sino2322@gmail.com> Co-authored-by: Jhvcc <37662342+Jhvcc@users.noreply.github.com> Co-authored-by: lowell <lowell.hu@zkteco.in> Co-authored-by: Boris Polonsky <BorisPolonsky@users.noreply.github.com> Co-authored-by: Ademílson Tonato <ademilsonft@outlook.com> Co-authored-by: Ademílson Tonato <ademilson.tonato@refurbed.com> Co-authored-by: IWAI, Masaharu <iwaim.sub@gmail.com> Co-authored-by: Yueh-Po Peng (Yabi) <94939112+y10ab1@users.noreply.github.com> Co-authored-by: Jason <ggbbddjm@gmail.com> Co-authored-by: Xin Zhang <sjhpzx@gmail.com> Co-authored-by: yjc980121 <3898524+yjc980121@users.noreply.github.com> Co-authored-by: heyszt <36215648+hieheihei@users.noreply.github.com> Co-authored-by: Abdullah AlOsaimi <osaimiacc@gmail.com> Co-authored-by: Abdullah AlOsaimi <189027247+osaimi@users.noreply.github.com> Co-authored-by: Yingchun Lai <laiyingchun@apache.org> Co-authored-by: Hash Brown <hi@xzd.me> Co-authored-by: zuodongxu <192560071+zuodongxu@users.noreply.github.com> Co-authored-by: Masashi Tomooka <tmokmss@users.noreply.github.com> Co-authored-by: aplio <ryo.091219@gmail.com> Co-authored-by: Obada Khalili <54270856+obadakhalili@users.noreply.github.com> Co-authored-by: Nam Vu <zuzoovn@gmail.com> Co-authored-by: Kei YAMAZAKI <1715090+kei-yamazaki@users.noreply.github.com> Co-authored-by: TechnoHouse <13776377+deephbz@users.noreply.github.com> Co-authored-by: Riddhimaan-Senapati <114703025+Riddhimaan-Senapati@users.noreply.github.com> Co-authored-by: MaFee921 <31881301+2284730142@users.noreply.github.com> Co-authored-by: te-chan <t-nakanome@sakura-is.co.jp> Co-authored-by: HQidea <HQidea@users.noreply.github.com> Co-authored-by: Joshbly <36315710+Joshbly@users.noreply.github.com> Co-authored-by: xhe <xw897002528@gmail.com> Co-authored-by: weiwenyan-dev <154779315+weiwenyan-dev@users.noreply.github.com> Co-authored-by: ex_wenyan.wei <ex_wenyan.wei@tcl.com> Co-authored-by: engchina <12236799+engchina@users.noreply.github.com> Co-authored-by: engchina <atjapan2015@gmail.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: 呆萌闷油瓶 <253605712@qq.com> Co-authored-by: Kemal <kemalmeler@outlook.com> Co-authored-by: Lazy_Frog <4590648+lazyFrogLOL@users.noreply.github.com> Co-authored-by: Yi Xiao <54782454+YIXIAO0@users.noreply.github.com> Co-authored-by: Steven sun <98230804+Tuyohai@users.noreply.github.com> Co-authored-by: steven <sunzwj@digitalchina.com> Co-authored-by: Kalo Chin <91766386+fdb02983rhy@users.noreply.github.com> Co-authored-by: Katy Tao <34019945+KatyTao@users.noreply.github.com> Co-authored-by: depy <42985524+h4ckdepy@users.noreply.github.com> Co-authored-by: 胡春东 <gycm520@gmail.com> Co-authored-by: Junjie.M <118170653@qq.com> Co-authored-by: MuYu <mr.muzea@gmail.com> Co-authored-by: Naoki Takashima <39912547+takatea@users.noreply.github.com> Co-authored-by: Summer-Gu <37869445+gubinjie@users.noreply.github.com> Co-authored-by: Fei He <droxer.he@gmail.com> Co-authored-by: ybalbert001 <120714773+ybalbert001@users.noreply.github.com> Co-authored-by: Yuanbo Li <ybalbert@amazon.com> Co-authored-by: douxc <7553076+douxc@users.noreply.github.com> Co-authored-by: liuzhenghua <1090179900@qq.com> Co-authored-by: Wu Jiayang <62842862+Wu-Jiayang@users.noreply.github.com> Co-authored-by: Your Name <you@example.com> Co-authored-by: kimjion <45935338+kimjion@users.noreply.github.com> Co-authored-by: AugNSo <song.tiankai@icloud.com> Co-authored-by: llinvokerl <38915183+llinvokerl@users.noreply.github.com> Co-authored-by: liusurong.lsr <liusurong.lsr@alibaba-inc.com> Co-authored-by: Vasu Negi <vasu-negi@users.noreply.github.com> Co-authored-by: Hundredwz <1808096180@qq.com> Co-authored-by: Xiyuan Chen <52963600+GareArc@users.noreply.github.com>
2025-12-15 22:06:52 +08:00 · 2025-02-17 17:05:13 +08:00
parent 222df44d21
commit 403e2d58b9
3272 changed files with 66339 additions and 281594 deletions
--- a/web/app/components/workflow/hooks/use-workflow-run-event/index.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/index.ts
@@ -0,0 +1,12 @@
+export * from './use-workflow-started'
+export * from './use-workflow-finished'
+export * from './use-workflow-failed'
+export * from './use-workflow-node-started'
+export * from './use-workflow-node-finished'
+export * from './use-workflow-node-iteration-started'
+export * from './use-workflow-node-iteration-next'
+export * from './use-workflow-node-iteration-finished'
+export * from './use-workflow-node-retry'
+export * from './use-workflow-text-chunk'
+export * from './use-workflow-text-replace'
+export * from './use-workflow-agent-log'
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-agent-log.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-agent-log.ts
@@ -0,0 +1,50 @@
+import { useCallback } from 'react'
+import produce from 'immer'
+import type { AgentLogResponse } from '@/types/workflow'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+
+export const useWorkflowAgentLog = () => {
+  const workflowStore = useWorkflowStore()
+
+  const handleWorkflowAgentLog = useCallback((params: AgentLogResponse) => {
+    const { data } = params
+    const {
+      workflowRunningData,
+      setWorkflowRunningData,
+    } = workflowStore.getState()
+
+    setWorkflowRunningData(produce(workflowRunningData!, (draft) => {
+      const currentIndex = draft.tracing!.findIndex(item => item.node_id === data.node_id)
+      if (currentIndex > -1) {
+        const current = draft.tracing![currentIndex]
+
+        if (current.execution_metadata) {
+          if (current.execution_metadata.agent_log) {
+            const currentLogIndex = current.execution_metadata.agent_log.findIndex(log => log.id === data.id)
+            if (currentLogIndex > -1) {
+              current.execution_metadata.agent_log[currentLogIndex] = {
+                ...current.execution_metadata.agent_log[currentLogIndex],
+                ...data,
+              }
+            }
+            else {
+              current.execution_metadata.agent_log.push(data)
+            }
+          }
+          else {
+            current.execution_metadata.agent_log = [data]
+          }
+        }
+        else {
+          current.execution_metadata = {
+            agent_log: [data],
+          } as any
+        }
+      }
+    }))
+  }, [workflowStore])
+
+  return {
+    handleWorkflowAgentLog,
+  }
+}
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-failed.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-failed.ts
@@ -0,0 +1,26 @@
+import { useCallback } from 'react'
+import produce from 'immer'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+import { WorkflowRunningStatus } from '@/app/components/workflow/types'
+
+export const useWorkflowFailed = () => {
+  const workflowStore = useWorkflowStore()
+
+  const handleWorkflowFailed = useCallback(() => {
+    const {
+      workflowRunningData,
+      setWorkflowRunningData,
+    } = workflowStore.getState()
+
+    setWorkflowRunningData(produce(workflowRunningData!, (draft) => {
+      draft.result = {
+        ...draft.result,
+        status: WorkflowRunningStatus.Failed,
+      }
+    }))
+  }, [workflowStore])
+
+  return {
+    handleWorkflowFailed,
+  }
+}
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-finished.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-finished.ts
@@ -0,0 +1,35 @@
+import { useCallback } from 'react'
+import produce from 'immer'
+import type { WorkflowFinishedResponse } from '@/types/workflow'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+import { getFilesInLogs } from '@/app/components/base/file-uploader/utils'
+
+export const useWorkflowFinished = () => {
+  const workflowStore = useWorkflowStore()
+
+  const handleWorkflowFinished = useCallback((params: WorkflowFinishedResponse) => {
+    const { data } = params
+    const {
+      workflowRunningData,
+      setWorkflowRunningData,
+    } = workflowStore.getState()
+
+    const isStringOutput = data.outputs && Object.keys(data.outputs).length === 1 && typeof data.outputs[Object.keys(data.outputs)[0]] === 'string'
+
+    setWorkflowRunningData(produce(workflowRunningData!, (draft) => {
+      draft.result = {
+        ...draft.result,
+        ...data,
+        files: getFilesInLogs(data.outputs),
+      } as any
+      if (isStringOutput) {
+        draft.resultTabActive = true
+        draft.resultText = data.outputs[Object.keys(data.outputs)[0]]
+      }
+    }))
+  }, [workflowStore])
+
+  return {
+    handleWorkflowFinished,
+  }
+}
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-node-finished.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-node-finished.ts
@@ -0,0 +1,72 @@
+import { useCallback } from 'react'
+import { useStoreApi } from 'reactflow'
+import produce from 'immer'
+import type { NodeFinishedResponse } from '@/types/workflow'
+import {
+  BlockEnum,
+  NodeRunningStatus,
+} from '@/app/components/workflow/types'
+import { ErrorHandleTypeEnum } from '@/app/components/workflow/nodes/_base/components/error-handle/types'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+
+export const useWorkflowNodeFinished = () => {
+  const store = useStoreApi()
+  const workflowStore = useWorkflowStore()
+
+  const handleWorkflowNodeFinished = useCallback((params: NodeFinishedResponse) => {
+    const { data } = params
+    const {
+      workflowRunningData,
+      setWorkflowRunningData,
+    } = workflowStore.getState()
+    const {
+      getNodes,
+      setNodes,
+      edges,
+      setEdges,
+    } = store.getState()
+    const nodes = getNodes()
+    setWorkflowRunningData(produce(workflowRunningData!, (draft) => {
+      const currentIndex = draft.tracing!.findIndex(item => item.id === data.id)
+      if (currentIndex > -1) {
+        draft.tracing![currentIndex] = {
+          ...draft.tracing![currentIndex],
+          ...data,
+        }
+      }
+    }))
+
+    const newNodes = produce(nodes, (draft) => {
+      const currentNode = draft.find(node => node.id === data.node_id)!
+      currentNode.data._runningStatus = data.status
+      if (data.status === NodeRunningStatus.Exception) {
+        if (data.execution_metadata?.error_strategy === ErrorHandleTypeEnum.failBranch)
+          currentNode.data._runningBranchId = ErrorHandleTypeEnum.failBranch
+      }
+      else {
+        if (data.node_type === BlockEnum.IfElse)
+          currentNode.data._runningBranchId = data?.outputs?.selected_case_id
+
+        if (data.node_type === BlockEnum.QuestionClassifier)
+          currentNode.data._runningBranchId = data?.outputs?.class_id
+      }
+    })
+    setNodes(newNodes)
+    const newEdges = produce(edges, (draft) => {
+      const incomeEdges = draft.filter((edge) => {
+        return edge.target === data.node_id
+      })
+      incomeEdges.forEach((edge) => {
+        edge.data = {
+          ...edge.data,
+          _targetRunningStatus: data.status as any,
+        }
+      })
+    })
+    setEdges(newEdges)
+  }, [store, workflowStore])
+
+  return {
+    handleWorkflowNodeFinished,
+  }
+}
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-node-iteration-finished.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-node-iteration-finished.ts
@@ -0,0 +1,46 @@
+import { useCallback } from 'react'
+import { useStoreApi } from 'reactflow'
+import produce from 'immer'
+import type { IterationFinishedResponse } from '@/types/workflow'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+import { DEFAULT_ITER_TIMES } from '@/app/components/workflow/constants'
+
+export const useWorkflowNodeIterationFinished = () => {
+  const store = useStoreApi()
+  const workflowStore = useWorkflowStore()
+
+  const handleWorkflowNodeIterationFinished = useCallback((params: IterationFinishedResponse) => {
+    const { data } = params
+    const {
+      workflowRunningData,
+      setWorkflowRunningData,
+      setIterTimes,
+    } = workflowStore.getState()
+    const {
+      getNodes,
+      setNodes,
+    } = store.getState()
+    const nodes = getNodes()
+    setWorkflowRunningData(produce(workflowRunningData!, (draft) => {
+      const currentIndex = draft.tracing!.findIndex(item => item.id === data.id)
+
+      if (currentIndex > -1) {
+        draft.tracing![currentIndex] = {
+          ...draft.tracing![currentIndex],
+          ...data,
+        }
+      }
+    }))
+    setIterTimes(DEFAULT_ITER_TIMES)
+    const newNodes = produce(nodes, (draft) => {
+      const currentNode = draft.find(node => node.id === data.node_id)!
+
+      currentNode.data._runningStatus = data.status
+    })
+    setNodes(newNodes)
+  }, [workflowStore, store])
+
+  return {
+    handleWorkflowNodeIterationFinished,
+  }
+}
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-node-iteration-next.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-node-iteration-next.ts
@@ -0,0 +1,35 @@
+import { useCallback } from 'react'
+import { useStoreApi } from 'reactflow'
+import produce from 'immer'
+import type { IterationNextResponse } from '@/types/workflow'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+
+export const useWorkflowNodeIterationNext = () => {
+  const store = useStoreApi()
+  const workflowStore = useWorkflowStore()
+
+  const handleWorkflowNodeIterationNext = useCallback((params: IterationNextResponse) => {
+    const {
+      iterTimes,
+      setIterTimes,
+    } = workflowStore.getState()
+
+    const { data } = params
+    const {
+      getNodes,
+      setNodes,
+    } = store.getState()
+
+    const nodes = getNodes()
+    const newNodes = produce(nodes, (draft) => {
+      const currentNode = draft.find(node => node.id === data.node_id)!
+      currentNode.data._iterationIndex = iterTimes
+      setIterTimes(iterTimes + 1)
+    })
+    setNodes(newNodes)
+  }, [workflowStore, store])
+
+  return {
+    handleWorkflowNodeIterationNext,
+  }
+}
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-node-iteration-started.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-node-iteration-started.ts
@@ -0,0 +1,85 @@
+import { useCallback } from 'react'
+import {
+  useReactFlow,
+  useStoreApi,
+} from 'reactflow'
+import produce from 'immer'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+import type { IterationStartedResponse } from '@/types/workflow'
+import { NodeRunningStatus } from '@/app/components/workflow/types'
+import { DEFAULT_ITER_TIMES } from '@/app/components/workflow/constants'
+
+export const useWorkflowNodeIterationStarted = () => {
+  const store = useStoreApi()
+  const reactflow = useReactFlow()
+  const workflowStore = useWorkflowStore()
+
+  const handleWorkflowNodeIterationStarted = useCallback((
+    params: IterationStartedResponse,
+    containerParams: {
+      clientWidth: number,
+      clientHeight: number,
+    },
+  ) => {
+    const { data } = params
+    const {
+      workflowRunningData,
+      setWorkflowRunningData,
+      setIterTimes,
+    } = workflowStore.getState()
+    const {
+      getNodes,
+      setNodes,
+      edges,
+      setEdges,
+      transform,
+    } = store.getState()
+    const nodes = getNodes()
+    setWorkflowRunningData(produce(workflowRunningData!, (draft) => {
+      draft.tracing!.push({
+        ...data,
+        status: NodeRunningStatus.Running,
+      })
+    }))
+    setIterTimes(DEFAULT_ITER_TIMES)
+
+    const {
+      setViewport,
+    } = reactflow
+    const currentNodeIndex = nodes.findIndex(node => node.id === data.node_id)
+    const currentNode = nodes[currentNodeIndex]
+    const position = currentNode.position
+    const zoom = transform[2]
+
+    if (!currentNode.parentId) {
+      setViewport({
+        x: (containerParams.clientWidth - 400 - currentNode.width! * zoom) / 2 - position.x * zoom,
+        y: (containerParams.clientHeight - currentNode.height! * zoom) / 2 - position.y * zoom,
+        zoom: transform[2],
+      })
+    }
+    const newNodes = produce(nodes, (draft) => {
+      draft[currentNodeIndex].data._runningStatus = NodeRunningStatus.Running
+      draft[currentNodeIndex].data._iterationLength = data.metadata.iterator_length
+      draft[currentNodeIndex].data._waitingRun = false
+    })
+    setNodes(newNodes)
+    const newEdges = produce(edges, (draft) => {
+      const incomeEdges = draft.filter(edge => edge.target === data.node_id)
+
+      incomeEdges.forEach((edge) => {
+        edge.data = {
+          ...edge.data,
+          _sourceRunningStatus: nodes.find(node => node.id === edge.source)!.data._runningStatus,
+          _targetRunningStatus: NodeRunningStatus.Running,
+          _waitingRun: false,
+        }
+      })
+    })
+    setEdges(newEdges)
+  }, [workflowStore, store, reactflow])
+
+  return {
+    handleWorkflowNodeIterationStarted,
+  }
+}
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-node-retry.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-node-retry.ts
@@ -0,0 +1,39 @@
+import { useCallback } from 'react'
+import { useStoreApi } from 'reactflow'
+import produce from 'immer'
+import type {
+  NodeFinishedResponse,
+} from '@/types/workflow'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+
+export const useWorkflowNodeRetry = () => {
+  const store = useStoreApi()
+  const workflowStore = useWorkflowStore()
+
+  const handleWorkflowNodeRetry = useCallback((params: NodeFinishedResponse) => {
+    const { data } = params
+    const {
+      workflowRunningData,
+      setWorkflowRunningData,
+    } = workflowStore.getState()
+    const {
+      getNodes,
+      setNodes,
+    } = store.getState()
+
+    const nodes = getNodes()
+    setWorkflowRunningData(produce(workflowRunningData!, (draft) => {
+      draft.tracing!.push(data)
+    }))
+    const newNodes = produce(nodes, (draft) => {
+      const currentNode = draft.find(node => node.id === data.node_id)!
+
+      currentNode.data._retryIndex = data.retry_index
+    })
+    setNodes(newNodes)
+  }, [workflowStore, store])
+
+  return {
+    handleWorkflowNodeRetry,
+  }
+}
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-node-started.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-node-started.ts
@@ -0,0 +1,89 @@
+import { useCallback } from 'react'
+import {
+  useReactFlow,
+  useStoreApi,
+} from 'reactflow'
+import produce from 'immer'
+import type { NodeStartedResponse } from '@/types/workflow'
+import { NodeRunningStatus } from '@/app/components/workflow/types'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+
+export const useWorkflowNodeStarted = () => {
+  const store = useStoreApi()
+  const workflowStore = useWorkflowStore()
+  const reactflow = useReactFlow()
+
+  const handleWorkflowNodeStarted = useCallback((
+    params: NodeStartedResponse,
+    containerParams: {
+      clientWidth: number,
+      clientHeight: number,
+    },
+  ) => {
+    const { data } = params
+    const {
+      workflowRunningData,
+      setWorkflowRunningData,
+    } = workflowStore.getState()
+    const {
+      getNodes,
+      setNodes,
+      edges,
+      setEdges,
+      transform,
+    } = store.getState()
+    const nodes = getNodes()
+    setWorkflowRunningData(produce(workflowRunningData!, (draft) => {
+      draft.tracing!.push({
+        ...data,
+        status: NodeRunningStatus.Running,
+      })
+    }))
+
+    const {
+      setViewport,
+    } = reactflow
+    const currentNodeIndex = nodes.findIndex(node => node.id === data.node_id)
+    const currentNode = nodes[currentNodeIndex]
+    const position = currentNode.position
+    const zoom = transform[2]
+
+    if (!currentNode.parentId) {
+      setViewport({
+        x: (containerParams.clientWidth - 400 - currentNode.width! * zoom) / 2 - position.x * zoom,
+        y: (containerParams.clientHeight - currentNode.height! * zoom) / 2 - position.y * zoom,
+        zoom: transform[2],
+      })
+    }
+    const newNodes = produce(nodes, (draft) => {
+      draft[currentNodeIndex].data._runningStatus = NodeRunningStatus.Running
+      draft[currentNodeIndex].data._waitingRun = false
+    })
+    setNodes(newNodes)
+    const newEdges = produce(edges, (draft) => {
+      const incomeEdges = draft.filter((edge) => {
+        return edge.target === data.node_id
+      })
+
+      incomeEdges.forEach((edge) => {
+        const incomeNode = nodes.find(node => node.id === edge.source)!
+        if (
+          (!incomeNode.data._runningBranchId && edge.sourceHandle === 'source')
+          || (incomeNode.data._runningBranchId && edge.sourceHandle === incomeNode.data._runningBranchId)
+        ) {
+          edge.data = {
+            ...edge.data,
+            _sourceRunningStatus: incomeNode.data._runningStatus,
+            _targetRunningStatus: NodeRunningStatus.Running,
+            _waitingRun: false,
+          }
+        }
+      })
+    })
+    setEdges(newEdges)
+  }, [workflowStore, store, reactflow])
+
+  return {
+    handleWorkflowNodeStarted,
+  }
+}
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-run-event.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-run-event.ts
@@ -0,0 +1,44 @@
+import {
+  useWorkflowAgentLog,
+  useWorkflowFailed,
+  useWorkflowFinished,
+  useWorkflowNodeFinished,
+  useWorkflowNodeIterationFinished,
+  useWorkflowNodeIterationNext,
+  useWorkflowNodeIterationStarted,
+  useWorkflowNodeRetry,
+  useWorkflowNodeStarted,
+  useWorkflowStarted,
+  useWorkflowTextChunk,
+  useWorkflowTextReplace,
+} from '.'
+
+export const useWorkflowRunEvent = () => {
+  const { handleWorkflowStarted } = useWorkflowStarted()
+  const { handleWorkflowFinished } = useWorkflowFinished()
+  const { handleWorkflowFailed } = useWorkflowFailed()
+  const { handleWorkflowNodeStarted } = useWorkflowNodeStarted()
+  const { handleWorkflowNodeFinished } = useWorkflowNodeFinished()
+  const { handleWorkflowNodeIterationStarted } = useWorkflowNodeIterationStarted()
+  const { handleWorkflowNodeIterationNext } = useWorkflowNodeIterationNext()
+  const { handleWorkflowNodeIterationFinished } = useWorkflowNodeIterationFinished()
+  const { handleWorkflowNodeRetry } = useWorkflowNodeRetry()
+  const { handleWorkflowTextChunk } = useWorkflowTextChunk()
+  const { handleWorkflowTextReplace } = useWorkflowTextReplace()
+  const { handleWorkflowAgentLog } = useWorkflowAgentLog()
+
+  return {
+    handleWorkflowStarted,
+    handleWorkflowFinished,
+    handleWorkflowFailed,
+    handleWorkflowNodeStarted,
+    handleWorkflowNodeFinished,
+    handleWorkflowNodeIterationStarted,
+    handleWorkflowNodeIterationNext,
+    handleWorkflowNodeIterationFinished,
+    handleWorkflowNodeRetry,
+    handleWorkflowTextChunk,
+    handleWorkflowTextReplace,
+    handleWorkflowAgentLog,
+  }
+}
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-started.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-started.ts
@@ -0,0 +1,58 @@
+import { useCallback } from 'react'
+import { useStoreApi } from 'reactflow'
+import produce from 'immer'
+import type { WorkflowStartedResponse } from '@/types/workflow'
+import { WorkflowRunningStatus } from '@/app/components/workflow/types'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+
+export const useWorkflowStarted = () => {
+  const store = useStoreApi()
+  const workflowStore = useWorkflowStore()
+
+  const handleWorkflowStarted = useCallback((params: WorkflowStartedResponse) => {
+    const { task_id, data } = params
+    const {
+      workflowRunningData,
+      setWorkflowRunningData,
+      setIterParallelLogMap,
+    } = workflowStore.getState()
+    const {
+      getNodes,
+      setNodes,
+      edges,
+      setEdges,
+    } = store.getState()
+    setIterParallelLogMap(new Map())
+    setWorkflowRunningData(produce(workflowRunningData!, (draft) => {
+      draft.task_id = task_id
+      draft.result = {
+        ...draft?.result,
+        ...data,
+        status: WorkflowRunningStatus.Running,
+      }
+    }))
+    const nodes = getNodes()
+    const newNodes = produce(nodes, (draft) => {
+      draft.forEach((node) => {
+        node.data._waitingRun = true
+        node.data._runningBranchId = undefined
+      })
+    })
+    setNodes(newNodes)
+    const newEdges = produce(edges, (draft) => {
+      draft.forEach((edge) => {
+        edge.data = {
+          ...edge.data,
+          _sourceRunningStatus: undefined,
+          _targetRunningStatus: undefined,
+          _waitingRun: true,
+        }
+      })
+    })
+    setEdges(newEdges)
+  }, [workflowStore, store])
+
+  return {
+    handleWorkflowStarted,
+  }
+}
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-text-chunk.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-text-chunk.ts
@@ -0,0 +1,25 @@
+import { useCallback } from 'react'
+import produce from 'immer'
+import type { TextChunkResponse } from '@/types/workflow'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+
+export const useWorkflowTextChunk = () => {
+  const workflowStore = useWorkflowStore()
+
+  const handleWorkflowTextChunk = useCallback((params: TextChunkResponse) => {
+    const { data: { text } } = params
+    const {
+      workflowRunningData,
+      setWorkflowRunningData,
+    } = workflowStore.getState()
+
+    setWorkflowRunningData(produce(workflowRunningData!, (draft) => {
+      draft.resultTabActive = true
+      draft.resultText += text
+    }))
+  }, [workflowStore])
+
+  return {
+    handleWorkflowTextChunk,
+  }
+}
--- a/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-text-replace.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run-event/use-workflow-text-replace.ts
@@ -0,0 +1,23 @@
+import { useCallback } from 'react'
+import produce from 'immer'
+import type { TextReplaceResponse } from '@/types/workflow'
+import { useWorkflowStore } from '@/app/components/workflow/store'
+
+export const useWorkflowTextReplace = () => {
+  const workflowStore = useWorkflowStore()
+
+  const handleWorkflowTextReplace = useCallback((params: TextReplaceResponse) => {
+    const { data: { text } } = params
+    const {
+      workflowRunningData,
+      setWorkflowRunningData,
+    } = workflowStore.getState()
+    setWorkflowRunningData(produce(workflowRunningData!, (draft) => {
+      draft.resultText = text
+    }))
+  }, [workflowStore])
+
+  return {
+    handleWorkflowTextReplace,
+  }
+}