refact workflow run log

2024-12-27 18:10:18 +08:00 · 2024-12-27 18:10:18 +08:00 · 6f8e217580
parent 891a76f2fa
commit 6f8e217580
9 changed files with 71 additions and 127 deletions
--- a/web/app/components/workflow/nodes/_base/components/before-run-form/index.tsx
+++ b/web/app/components/workflow/nodes/_base/components/before-run-form/index.tsx
@ -17,10 +17,10 @@ import ResultPanel from '@/app/components/workflow/run/result-panel'
 import Toast from '@/app/components/base/toast'
 import { TransferMethod } from '@/types/app'
 import { getProcessedFiles } from '@/app/components/base/file-uploader/utils'
-import type { NodeTracing } from '@/types/workflow'
-import { RetryResultPanel } from '@/app/components/workflow/run/retry-log'
 import type { BlockEnum } from '@/app/components/workflow/types'
 import type { Emoji } from '@/app/components/tools/types'
+import type { SpecialResultPanelProps } from '@/app/components/workflow/run/special-result-panel'
+import SpecialResultPanel from '@/app/components/workflow/run/special-result-panel'

 const i18nPrefix = 'workflow.singleRun'

@ -34,9 +34,8 @@ type BeforeRunFormProps = {
  runningStatus: NodeRunningStatus
  result?: JSX.Element
  forms: FormProps[]
-  retryDetails?: NodeTracing[]
-  onRetryDetailBack?: any
-}
+  showSpecialResultPanel?: boolean
+} & Partial<SpecialResultPanelProps>

 function formatValue(value: string | any, type: InputVarType) {
  if (type === InputVarType.number)
@ -66,8 +65,8 @@ const BeforeRunForm: FC<BeforeRunFormProps> = ({
  runningStatus,
  result,
  forms,
-  retryDetails,
-  onRetryDetailBack = () => { },
+  showSpecialResultPanel,
+  ...restResultPanelParams
 }) => {
  const { t } = useTranslation()

@ -141,24 +140,14 @@ const BeforeRunForm: FC<BeforeRunFormProps> = ({
          </div>
        </div>
        {
-          retryDetails?.length && (
+          showSpecialResultPanel && (
            <div className='h-0 grow overflow-y-auto pb-4'>
-              <RetryResultPanel
-                list={retryDetails.map((item, index) => ({
-                  ...item,
-                  title: `${t('workflow.nodes.common.retry.retry')} ${index + 1}`,
-                  node_type: nodeType!,
-                  extras: {
-                    icon: toolIcon!,
-                  },
-                }))}
-                onBack={onRetryDetailBack}
-              />
+              <SpecialResultPanel {...restResultPanelParams} />
            </div>
          )
        }
        {
-          !retryDetails?.length && (
+          !showSpecialResultPanel && (
            <div className='h-0 grow overflow-y-auto pb-4'>
              <div className='mt-3 px-4 space-y-4'>
                {forms.map((form, index) => (
--- a/web/app/components/workflow/nodes/http/panel.tsx
+++ b/web/app/components/workflow/nodes/http/panel.tsx
@ -18,7 +18,6 @@ import { FileArrow01 } from '@/app/components/base/icons/src/vender/line/files'
 import type { NodePanelProps } from '@/app/components/workflow/types'
 import BeforeRunForm from '@/app/components/workflow/nodes/_base/components/before-run-form'
 import ResultPanel from '@/app/components/workflow/run/result-panel'
-import { useRetryDetailShowInSingleRun } from '@/app/components/workflow/nodes/_base/components/retry/hooks'

 const i18nPrefix = 'workflow.nodes.http'

@ -61,10 +60,6 @@ const Panel: FC<NodePanelProps<HttpNodeType>> = ({
    hideCurlPanel,
    handleCurlImport,
  } = useConfig(id, data)
-  const {
-    retryDetails,
-    handleRetryDetailsChange,
-  } = useRetryDetailShowInSingleRun()
  // To prevent prompt editor in body not update data.
  if (!isDataReady)
    return null
@ -198,9 +193,7 @@ const Panel: FC<NodePanelProps<HttpNodeType>> = ({
          runningStatus={runningStatus}
          onRun={handleRun}
          onStop={handleStop}
-          retryDetails={retryDetails}
-          onRetryDetailBack={handleRetryDetailsChange}
-          result={<ResultPanel {...runResult} showSteps={false} onShowRetryDetail={handleRetryDetailsChange} />}
+          result={<ResultPanel {...runResult} showSteps={false} />}
        />
      )}
      {(isShowCurlPanel && !readOnly) && (
--- a/web/app/components/workflow/nodes/iteration/panel.tsx
+++ b/web/app/components/workflow/nodes/iteration/panel.tsx
@ -15,10 +15,7 @@ import Select from '@/app/components/base/select'
 import Slider from '@/app/components/base/slider'
 import Input from '@/app/components/base/input'
 import formatTracing from '@/app/components/workflow/run/utils/format-log'
-import {
-  IterationLogTrigger,
-  IterationResultPanel,
-} from '@/app/components/workflow/run/iteration-log'
+
 import { useLogs } from '@/app/components/workflow/run/hooks'

 const i18nPrefix = 'workflow.nodes.iteration'
@ -69,12 +66,7 @@ const Panel: FC<NodePanelProps<IterationNodeType>> = ({
  } = useConfig(id, data)

  const nodeInfo = formatTracing(iterationRunResult, t)[0]
-  const {
-    showIteratingDetail,
-    iterationResultList,
-    setShowIteratingDetailFalse,
-    handleShowIterationResultList,
-  } = useLogs()
+  const logsParams = useLogs()

  return (
    <div className='pt-2 pb-2'>
@ -170,35 +162,9 @@ const Panel: FC<NodePanelProps<IterationNodeType>> = ({
          runningStatus={runningStatus}
          onRun={handleRun}
          onStop={handleStop}
+          {...logsParams}
          result={
-            <div className='mt-3'>
-              {
-                !showIteratingDetail && (
-                  <>
-                    {
-                      nodeInfo && (
-                        <div className='px-4'>
-                          <IterationLogTrigger
-                            nodeInfo={nodeInfo}
-                            onShowIterationResultList={handleShowIterationResultList}
-                          />
-                          <Split className='mt-3' />
-                        </div>
-                      )
-                    }
-                    <ResultPanel {...runResult} showSteps={false} />
-                  </>
-                )
-              }
-              {
-                showIteratingDetail && (
-                  <IterationResultPanel
-                    list={iterationResultList}
-                    onBack={setShowIteratingDetailFalse}
-                  />
-                )
-              }
-            </div>
+            <ResultPanel {...runResult} showSteps={false} nodeInfo={nodeInfo} {...logsParams} />
          }
        />
      )}
--- a/web/app/components/workflow/nodes/llm/panel.tsx
+++ b/web/app/components/workflow/nodes/llm/panel.tsx
@ -19,7 +19,6 @@ import type { Props as FormProps } from '@/app/components/workflow/nodes/_base/c
 import ResultPanel from '@/app/components/workflow/run/result-panel'
 import Tooltip from '@/app/components/base/tooltip'
 import Editor from '@/app/components/workflow/nodes/_base/components/prompt/editor'
-import { useRetryDetailShowInSingleRun } from '@/app/components/workflow/nodes/_base/components/retry/hooks'

 const i18nPrefix = 'workflow.nodes.llm'

@ -70,10 +69,6 @@ const Panel: FC<NodePanelProps<LLMNodeType>> = ({
    runResult,
    filterJinjia2InputVar,
  } = useConfig(id, data)
-  const {
-    retryDetails,
-    handleRetryDetailsChange,
-  } = useRetryDetailShowInSingleRun()

  const model = inputs.model

@ -293,9 +288,7 @@ const Panel: FC<NodePanelProps<LLMNodeType>> = ({
          runningStatus={runningStatus}
          onRun={handleRun}
          onStop={handleStop}
-          retryDetails={retryDetails}
-          onRetryDetailBack={handleRetryDetailsChange}
-          result={<ResultPanel {...runResult} showSteps={false} onShowRetryDetail={handleRetryDetailsChange} />}
+          result={<ResultPanel {...runResult} showSteps={false} />}
        />
      )}
    </div>
--- a/web/app/components/workflow/nodes/tool/panel.tsx
+++ b/web/app/components/workflow/nodes/tool/panel.tsx
@ -14,7 +14,6 @@ import Loading from '@/app/components/base/loading'
 import BeforeRunForm from '@/app/components/workflow/nodes/_base/components/before-run-form'
 import OutputVars, { VarItem } from '@/app/components/workflow/nodes/_base/components/output-vars'
 import ResultPanel from '@/app/components/workflow/run/result-panel'
-import { useRetryDetailShowInSingleRun } from '@/app/components/workflow/nodes/_base/components/retry/hooks'
 import { useToolIcon } from '@/app/components/workflow/hooks'

 const i18nPrefix = 'workflow.nodes.tool'
@ -52,10 +51,6 @@ const Panel: FC<NodePanelProps<ToolNodeType>> = ({
    outputSchema,
  } = useConfig(id, data)
  const toolIcon = useToolIcon(data)
-  const {
-    retryDetails,
-    handleRetryDetailsChange,
-  } = useRetryDetailShowInSingleRun()

  if (isLoading) {
    return <div className='flex h-[200px] items-center justify-center'>
@ -166,9 +161,7 @@ const Panel: FC<NodePanelProps<ToolNodeType>> = ({
          runningStatus={runningStatus}
          onRun={handleRun}
          onStop={handleStop}
-          retryDetails={retryDetails}
-          onRetryDetailBack={handleRetryDetailsChange}
-          result={<ResultPanel {...runResult} showSteps={false} onShowRetryDetail={handleRetryDetailsChange} />}
+          result={<ResultPanel {...runResult} showSteps={false} />}
        />
      )}
    </div>
--- a/web/app/components/workflow/run/node.tsx
+++ b/web/app/components/workflow/run/node.tsx
@ -36,8 +36,6 @@ type Props = {
  onShowRetryDetail?: (detail: NodeTracing[]) => void
  onShowAgentResultList?: (detail: AgentLogItemWithChildren[]) => void
  notShowIterationNav?: boolean
-  justShowIterationNavArrow?: boolean
-  justShowRetryNavArrow?: boolean
 }

 const NodePanel: FC<Props> = ({
@ -50,7 +48,6 @@ const NodePanel: FC<Props> = ({
  onShowRetryDetail,
  onShowAgentResultList,
  notShowIterationNav,
-  justShowIterationNavArrow,
 }) => {
  const [collapseState, doSetCollapseState] = useState<boolean>(true)
  const setCollapseState = useCallback((state: boolean) => {
@ -138,7 +135,6 @@ const NodePanel: FC<Props> = ({
              <IterationLogTrigger
                nodeInfo={nodeInfo}
                onShowIterationResultList={onShowIterationDetail}
-                justShowIterationNavArrow={justShowIterationNavArrow}
              />
            )}
            {isRetryNode && onShowRetryDetail && (
--- a/web/app/components/workflow/run/result-panel.tsx
+++ b/web/app/components/workflow/run/result-panel.tsx
@ -1,19 +1,20 @@
 'use client'
 import type { FC } from 'react'
 import { useTranslation } from 'react-i18next'
-import {
-  RiArrowRightSLine,
-  RiRestartFill,
-} from '@remixicon/react'
 import StatusPanel from './status'
 import MetaData from './meta'
 import CodeEditor from '@/app/components/workflow/nodes/_base/components/editor/code-editor'
 import { CodeLanguage } from '@/app/components/workflow/nodes/code/types'
 import ErrorHandleTip from '@/app/components/workflow/nodes/_base/components/error-handle/error-handle-tip'
 import type { NodeTracing } from '@/types/workflow'
-import Button from '@/app/components/base/button'
+import { BlockEnum } from '@/app/components/workflow/types'
+import { hasRetryNode } from '@/app/components/workflow/utils'
+import { IterationLogTrigger } from '@/app/components/workflow/run/iteration-log'
+import { RetryLogTrigger } from '@/app/components/workflow/run/retry-log'
+import { AgentLogTrigger } from '@/app/components/workflow/run/agent-log'

-interface ResultPanelProps {
+type ResultPanelProps = {
+  nodeInfo?: NodeTracing
  inputs?: string
  process_data?: string
  outputs?: string
@ -28,11 +29,13 @@ interface ResultPanelProps {
  showSteps?: boolean
  exceptionCounts?: number
  execution_metadata?: any
-  retry_events?: NodeTracing[]
-  onShowRetryDetail?: (retries: NodeTracing[]) => void
+  handleShowIterationResultList?: (detail: NodeTracing[][], iterDurationMap: any) => void
+  onShowRetryDetail?: (detail: NodeTracing[]) => void
+  onShowAgentResultList?: () => void
 }

 const ResultPanel: FC<ResultPanelProps> = ({
+  nodeInfo,
  inputs,
  process_data,
  outputs,
@ -46,10 +49,14 @@ const ResultPanel: FC<ResultPanelProps> = ({
  showSteps,
  exceptionCounts,
  execution_metadata,
-  retry_events,
+  handleShowIterationResultList,
  onShowRetryDetail,
+  onShowAgentResultList,
 }) => {
  const { t } = useTranslation()
+  const isIterationNode = nodeInfo?.node_type === BlockEnum.Iteration
+  const isRetryNode = hasRetryNode(nodeInfo?.node_type) && nodeInfo?.retryDetail
+  const isAgentNode = nodeInfo?.node_type === BlockEnum.Agent

  return (
    <div className='bg-components-panel-bg py-2'>
@ -62,23 +69,32 @@ const ResultPanel: FC<ResultPanelProps> = ({
          exceptionCounts={exceptionCounts}
        />
      </div>
-      {
-        retry_events?.length && onShowRetryDetail && (
-          <div className='px-4'>
-            <Button
-              className='flex items-center justify-between w-full'
-              variant='tertiary'
-              onClick={() => onShowRetryDetail(retry_events)}
-            >
-              <div className='flex items-center'>
-                <RiRestartFill className='mr-0.5 w-4 h-4 text-components-button-tertiary-text flex-shrink-0' />
-                {t('workflow.nodes.common.retry.retries', { num: retry_events?.length })}
-              </div>
-              <RiArrowRightSLine className='w-4 h-4 text-components-button-tertiary-text flex-shrink-0' />
-            </Button>
-          </div>
-        )
-      }
+      <div className='px-4'>
+        {
+          isIterationNode && handleShowIterationResultList && (
+            <IterationLogTrigger
+              nodeInfo={nodeInfo}
+              onShowIterationResultList={handleShowIterationResultList}
+            />
+          )
+        }
+        {
+          isRetryNode && onShowRetryDetail && (
+            <RetryLogTrigger
+              nodeInfo={nodeInfo}
+              onShowRetryResultList={onShowRetryDetail}
+            />
+          )
+        }
+        {
+          isAgentNode && onShowAgentResultList && (
+            <AgentLogTrigger
+              nodeInfo={nodeInfo}
+              onShowAgentResultList={onShowAgentResultList}
+            />
+          )
+        }
+      </div>
      <div className='px-4 py-2 flex flex-col gap-2'>
        <CodeEditor
          readOnly
--- a/web/app/components/workflow/run/special-result-panel.tsx
+++ b/web/app/components/workflow/run/special-result-panel.tsx
@ -7,18 +7,18 @@ import type {
  NodeTracing,
 } from '@/types/workflow'

-type SpecialResultPanelProps = {
-  showRetryDetail: boolean
-  setShowRetryDetailFalse: () => void
-  retryResultList: NodeTracing[]
+export type SpecialResultPanelProps = {
+  showRetryDetail?: boolean
+  setShowRetryDetailFalse?: () => void
+  retryResultList?: NodeTracing[]

-  showIteratingDetail: boolean
-  setShowIteratingDetailFalse: () => void
-  iterationResultList: NodeTracing[][]
-  iterationResultDurationMap: IterationDurationMap
+  showIteratingDetail?: boolean
+  setShowIteratingDetailFalse?: () => void
+  iterationResultList?: NodeTracing[][]
+  iterationResultDurationMap?: IterationDurationMap

-  agentResultList: AgentLogItemWithChildren[]
-  setAgentResultList: (list: AgentLogItemWithChildren[]) => void
+  agentResultList?: AgentLogItemWithChildren[]
+  setAgentResultList?: (list: AgentLogItemWithChildren[]) => void
 }
 const SpecialResultPanel = ({
  showRetryDetail,
@ -36,7 +36,7 @@ const SpecialResultPanel = ({
  return (
    <>
      {
-        showRetryDetail && (
+        !!showRetryDetail && !!retryResultList?.length && setShowRetryDetailFalse && (
          <RetryResultPanel
            list={retryResultList}
            onBack={setShowRetryDetailFalse}
@ -44,7 +44,7 @@ const SpecialResultPanel = ({
        )
      }
      {
-        showIteratingDetail && (
+        showIteratingDetail && !!iterationResultList?.length && setShowIteratingDetailFalse && (
          <IterationResultPanel
            list={iterationResultList}
            onBack={setShowIteratingDetailFalse}
@ -53,7 +53,7 @@ const SpecialResultPanel = ({
        )
      }
      {
-        !!agentResultList.length && (
+        !!agentResultList?.length && setAgentResultList && (
          <AgentResultPanel
            list={agentResultList}
            setAgentResultList={setAgentResultList}
--- a/web/app/components/workflow/run/tracing-panel.tsx
+++ b/web/app/components/workflow/run/tracing-panel.tsx
@ -137,8 +137,6 @@ const TracingPanel: FC<TracingPanelProps> = ({
            onShowIterationDetail={handleShowIterationResultList}
            onShowRetryDetail={handleShowRetryResultList}
            onShowAgentResultList={setAgentResultList}
-            justShowIterationNavArrow={true}
-            justShowRetryNavArrow={true}
            hideInfo={hideNodeInfo}
            hideProcessDetail={hideNodeProcessDetail}
          />