Feat/iteration single run time (#10512)

2025-12-09 19:06:51 +08:00 · 2024-11-11 14:47:52 +08:00
parent 0c1307b083
commit f414d241c1
16 changed files with 101 additions and 29 deletions
--- a/web/app/components/workflow/hooks/use-workflow-run.ts
+++ b/web/app/components/workflow/hooks/use-workflow-run.ts
@@ -445,6 +445,7 @@ export const useWorkflowRun = () => {
              ...data,
              status: NodeRunningStatus.Running,
              details: [],
+              iterDurationMap: {},
            } as any)
          }))

@@ -496,6 +497,8 @@ export const useWorkflowRun = () => {
          setWorkflowRunningData(produce(workflowRunningData!, (draft) => {
            const iteration = draft.tracing!.find(trace => trace.node_id === data.node_id)
            if (iteration) {
+              if (iteration.iterDurationMap && data.duration)
+                iteration.iterDurationMap[data.parallel_mode_run_id ?? `${data.index - 1}`] = data.duration
              if (iteration.details!.length >= iteration.metadata.iterator_length!)
                return
            }
--- a/web/app/components/workflow/nodes/_base/node.tsx
+++ b/web/app/components/workflow/nodes/_base/node.tsx
@@ -193,7 +193,7 @@ const BaseNode: FC<BaseNodeProps> = ({
          {
            data._iterationLength && data._iterationIndex && data._runningStatus === NodeRunningStatus.Running && (
              <div className='mr-1.5 text-xs font-medium text-primary-600'>
-                {data._iterationIndex}/{data._iterationLength}
+                {data._iterationIndex > data._iterationLength ? data._iterationLength : data._iterationIndex}/{data._iterationLength}
              </div>
            )
          }
--- a/web/app/components/workflow/panel/workflow-preview.tsx
+++ b/web/app/components/workflow/panel/workflow-preview.tsx
@@ -28,7 +28,7 @@ import IterationResultPanel from '../run/iteration-result-panel'
 import InputsPanel from './inputs-panel'
 import cn from '@/utils/classnames'
 import Loading from '@/app/components/base/loading'
-import type { NodeTracing } from '@/types/workflow'
+import type { IterationDurationMap, NodeTracing } from '@/types/workflow'

 const WorkflowPreview = () => {
  const { t } = useTranslation()
@@ -53,12 +53,14 @@ const WorkflowPreview = () => {
  }, [workflowRunningData])

  const [iterationRunResult, setIterationRunResult] = useState<NodeTracing[][]>([])
+  const [iterDurationMap, setIterDurationMap] = useState<IterationDurationMap>({})
  const [isShowIterationDetail, {
    setTrue: doShowIterationDetail,
    setFalse: doHideIterationDetail,
  }] = useBoolean(false)

-  const handleShowIterationDetail = useCallback((detail: NodeTracing[][]) => {
+  const handleShowIterationDetail = useCallback((detail: NodeTracing[][], iterationDurationMap: IterationDurationMap) => {
+    setIterDurationMap(iterationDurationMap)
    setIterationRunResult(detail)
    doShowIterationDetail()
  }, [doShowIterationDetail])
@@ -72,6 +74,7 @@ const WorkflowPreview = () => {
          list={iterationRunResult}
          onHide={doHideIterationDetail}
          onBack={doHideIterationDetail}
+          iterDurationMap={iterDurationMap}
        />
      </div>
    )
@@ -94,6 +97,7 @@ const WorkflowPreview = () => {
              list={iterationRunResult}
              onHide={doHideIterationDetail}
              onBack={doHideIterationDetail}
+              iterDurationMap={iterDurationMap}
            />
          )
          : (
--- a/web/app/components/workflow/run/index.tsx
+++ b/web/app/components/workflow/run/index.tsx
@@ -13,7 +13,7 @@ import cn from '@/utils/classnames'
 import { ToastContext } from '@/app/components/base/toast'
 import Loading from '@/app/components/base/loading'
 import { fetchRunDetail, fetchTracingList } from '@/service/log'
-import type { NodeTracing } from '@/types/workflow'
+import type { IterationDurationMap, NodeTracing } from '@/types/workflow'
 import type { WorkflowRunDetailResponse } from '@/models/log'
 import { useStore as useAppStore } from '@/app/components/app/store'

@@ -172,15 +172,17 @@ const RunPanel: FC<RunProps> = ({ hideResult, activeTab = 'RESULT', runID, getRe
  }, [loading])

  const [iterationRunResult, setIterationRunResult] = useState<NodeTracing[][]>([])
+  const [iterDurationMap, setIterDurationMap] = useState<IterationDurationMap>({})
  const [isShowIterationDetail, {
    setTrue: doShowIterationDetail,
    setFalse: doHideIterationDetail,
  }] = useBoolean(false)

-  const handleShowIterationDetail = useCallback((detail: NodeTracing[][]) => {
+  const handleShowIterationDetail = useCallback((detail: NodeTracing[][], iterDurationMap: IterationDurationMap) => {
    setIterationRunResult(detail)
    doShowIterationDetail()
-  }, [doShowIterationDetail])
+    setIterDurationMap(iterDurationMap)
+  }, [doShowIterationDetail, setIterationRunResult, setIterDurationMap])

  if (isShowIterationDetail) {
    return (
@@ -189,6 +191,7 @@ const RunPanel: FC<RunProps> = ({ hideResult, activeTab = 'RESULT', runID, getRe
          list={iterationRunResult}
          onHide={doHideIterationDetail}
          onBack={doHideIterationDetail}
+          iterDurationMap={iterDurationMap}
        />
      </div>
    )
--- a/web/app/components/workflow/run/iteration-result-panel.tsx
+++ b/web/app/components/workflow/run/iteration-result-panel.tsx
@@ -6,12 +6,14 @@ import {
  RiArrowRightSLine,
  RiCloseLine,
  RiErrorWarningLine,
+  RiLoader2Line,
 } from '@remixicon/react'
 import { ArrowNarrowLeft } from '../../base/icons/src/vender/line/arrows'
+import { NodeRunningStatus } from '../types'
 import TracingPanel from './tracing-panel'
 import { Iteration } from '@/app/components/base/icons/src/vender/workflow'
 import cn from '@/utils/classnames'
-import type { NodeTracing } from '@/types/workflow'
+import type { IterationDurationMap, NodeTracing } from '@/types/workflow'
 const i18nPrefix = 'workflow.singleRun'

 type Props = {
@@ -19,6 +21,7 @@ type Props = {
  onHide: () => void
  onBack: () => void
  noWrap?: boolean
+  iterDurationMap?: IterationDurationMap
 }

 const IterationResultPanel: FC<Props> = ({
@@ -26,6 +29,7 @@ const IterationResultPanel: FC<Props> = ({
  onHide,
  onBack,
  noWrap,
+  iterDurationMap,
 }) => {
  const { t } = useTranslation()
  const [expandedIterations, setExpandedIterations] = useState<Record<number, boolean>>({})
@@ -36,6 +40,40 @@ const IterationResultPanel: FC<Props> = ({
      [index]: !prev[index],
    }))
  }, [])
+  const countIterDuration = (iteration: NodeTracing[], iterDurationMap: IterationDurationMap): string => {
+    const IterRunIndex = iteration[0].execution_metadata.iteration_index as number
+    const iterRunId = iteration[0].execution_metadata.parallel_mode_run_id
+    const iterItem = iterDurationMap[iterRunId || IterRunIndex]
+    const duration = iterItem
+    return `${(duration && duration > 0.01) ? duration.toFixed(2) : 0.01}s`
+  }
+  const iterationStatusShow = (index: number, iteration: NodeTracing[], iterDurationMap?: IterationDurationMap) => {
+    const hasFailed = iteration.some(item => item.status === NodeRunningStatus.Failed)
+    const isRunning = iteration.some(item => item.status === NodeRunningStatus.Running)
+    const hasDurationMap = iterDurationMap && Object.keys(iterDurationMap).length !== 0
+
+    if (hasFailed)
+      return <RiErrorWarningLine className='w-4 h-4 text-text-destructive' />
+
+    if (isRunning)
+      return <RiLoader2Line className='w-3.5 h-3.5 text-primary-600 animate-spin' />
+
+    return (
+      <>
+        {hasDurationMap && (
+          <div className='system-xs-regular text-text-tertiary'>
+            {countIterDuration(iteration, iterDurationMap)}
+          </div>
+        )}
+        <RiArrowRightSLine
+          className={cn(
+            'w-4 h-4 text-text-tertiary transition-transform duration-200 flex-shrink-0',
+            expandedIterations[index] && 'transform rotate-90',
+          )}
+        />
+      </>
+    )
+  }

  const main = (
    <>
@@ -72,19 +110,7 @@ const IterationResultPanel: FC<Props> = ({
                <span className='system-sm-semibold-uppercase text-text-primary flex-grow'>
                  {t(`${i18nPrefix}.iteration`)} {index + 1}
                </span>
-                {
-                  iteration.some(item => item.status === 'failed')
-                    ? (
-                      <RiErrorWarningLine className='w-4 h-4 text-text-destructive' />
-                    )
-                    : (< RiArrowRightSLine className={
-                      cn(
-                        'w-4 h-4 text-text-tertiary transition-transform duration-200 flex-shrink-0',
-                        expandedIterations[index] && 'transform rotate-90',
-                      )} />
-                    )
-                }
-
+                {iterationStatusShow(index, iteration, iterDurationMap)}
              </div>
            </div>
            {expandedIterations[index] && <div
--- a/web/app/components/workflow/run/node.tsx
+++ b/web/app/components/workflow/run/node.tsx
@@ -18,7 +18,7 @@ import StatusContainer from '@/app/components/workflow/run/status-container'
 import CodeEditor from '@/app/components/workflow/nodes/_base/components/editor/code-editor'
 import Button from '@/app/components/base/button'
 import { CodeLanguage } from '@/app/components/workflow/nodes/code/types'
-import type { NodeTracing } from '@/types/workflow'
+import type { IterationDurationMap, NodeTracing } from '@/types/workflow'

 type Props = {
  className?: string
@@ -26,7 +26,7 @@ type Props = {
  inMessage?: boolean
  hideInfo?: boolean
  hideProcessDetail?: boolean
-  onShowIterationDetail?: (detail: NodeTracing[][]) => void
+  onShowIterationDetail?: (detail: NodeTracing[][], iterDurationMap: IterationDurationMap) => void
  notShowIterationNav?: boolean
  justShowIterationNavArrow?: boolean
 }
@@ -90,7 +90,7 @@ const NodePanel: FC<Props> = ({
  const handleOnShowIterationDetail = (e: React.MouseEvent<HTMLButtonElement>) => {
    e.stopPropagation()
    e.nativeEvent.stopImmediatePropagation()
-    onShowIterationDetail?.(nodeInfo.details || [])
+    onShowIterationDetail?.(nodeInfo.details || [], nodeInfo?.iterDurationMap || nodeInfo.execution_metadata?.iteration_duration_map || {})
  }
  return (
    <div className={cn('px-2 py-1', className)}>
--- a/web/app/components/workflow/run/tracing-panel.tsx
+++ b/web/app/components/workflow/run/tracing-panel.tsx
@@ -16,11 +16,11 @@ import NodePanel from './node'
 import {
  BlockEnum,
 } from '@/app/components/workflow/types'
-import type { NodeTracing } from '@/types/workflow'
+import type { IterationDurationMap, NodeTracing } from '@/types/workflow'

 type TracingPanelProps = {
  list: NodeTracing[]
-  onShowIterationDetail?: (detail: NodeTracing[][]) => void
+  onShowIterationDetail?: (detail: NodeTracing[][], iterDurationMap: IterationDurationMap) => void
  className?: string
  hideNodeInfo?: boolean
  hideNodeProcessDetail?: boolean
--- a/web/i18n/en-US/workflow.ts
+++ b/web/i18n/en-US/workflow.ts
@@ -569,9 +569,9 @@ const translation = {
      MaxParallelismDesc: 'The maximum parallelism is used to control the number of tasks executed simultaneously in a single iteration.',
      errorResponseMethod: 'Error response method',
      ErrorMethod: {
-        operationTerminated: 'terminated',
-        continueOnError: 'continue on error',
-        removeAbnormalOutput: 'remove abnormal output',
+        operationTerminated: 'Terminated',
+        continueOnError: 'Continue on Error',
+        removeAbnormalOutput: 'Remove Abnormal Output',
      },
      answerNodeWarningDesc: 'Parallel mode warning: Answer nodes, conversation variable assignments, and persistent read/write operations within iterations may cause exceptions.',
    },
--- a/web/types/workflow.ts
+++ b/web/types/workflow.ts
@@ -33,6 +33,7 @@ export type NodeTracing = {
    parent_parallel_id?: string
    parent_parallel_start_node_id?: string
    parallel_mode_run_id?: string
+    iteration_duration_map?: IterationDurationMap
  }
  metadata: {
    iterator_length: number
@@ -44,6 +45,7 @@ export type NodeTracing = {
    name: string
    email: string
  }
+  iterDurationMap?: IterationDurationMap
  finished_at: number
  extras?: any
  expand?: boolean // for UI
@@ -207,7 +209,10 @@ export type IterationNextResponse = {
    parallel_mode_run_id: string
    execution_metadata: {
      parallel_id?: string
+      iteration_index: number
+      parallel_mode_run_id?: string
    }
+    duration?: number
  }
 }

@@ -323,3 +328,5 @@ export type ConversationVariableResponse = {
  total: number
  page: number
 }
+
+export type IterationDurationMap = Record<string, number>