refact workflow run log

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[]
+  showSpecialResultPanel?: boolean
-  onRetryDetailBack?: any
+} & 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,
+  showSpecialResultPanel,
-  onRetryDetailBack = () => { },
+  ...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
+              <SpecialResultPanel {...restResultPanelParams} />
-                list={retryDetails.map((item, index) => ({
-                  ...item,
-                  title: `${t('workflow.nodes.common.retry.retry')} ${index + 1}`,
-                  node_type: nodeType!,
-                  extras: {
-                    icon: toolIcon!,
-                  },
-                }))}
-                onBack={onRetryDetailBack}
-              />
             </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) => (

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}
+          result={<ResultPanel {...runResult} showSteps={false} />}
-          onRetryDetailBack={handleRetryDetailsChange}
-          result={<ResultPanel {...runResult} showSteps={false} onShowRetryDetail={handleRetryDetailsChange} />}
         />
       )}
       {(isShowCurlPanel && !readOnly) && (

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 {
+  const logsParams = useLogs()
-    showIteratingDetail,
-    iterationResultList,
-    setShowIteratingDetailFalse,
-    handleShowIterationResultList,
-  } = 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'>
+            <ResultPanel {...runResult} showSteps={false} nodeInfo={nodeInfo} {...logsParams} />
-              {
-                !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>
           }
         />
       )}

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}
+          result={<ResultPanel {...runResult} showSteps={false} />}
-          onRetryDetailBack={handleRetryDetailsChange}
-          result={<ResultPanel {...runResult} showSteps={false} onShowRetryDetail={handleRetryDetailsChange} />}
         />
       )}
     </div>

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}
+          result={<ResultPanel {...runResult} showSteps={false} />}
-          onRetryDetailBack={handleRetryDetailsChange}
-          result={<ResultPanel {...runResult} showSteps={false} onShowRetryDetail={handleRetryDetailsChange} />}
         />
       )}
     </div>

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 && (

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[]
+  handleShowIterationResultList?: (detail: NodeTracing[][], iterDurationMap: any) => void
-  onShowRetryDetail?: (retries: NodeTracing[]) => 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>
-      {
+      <div className='px-4'>
-        retry_events?.length && onShowRetryDetail && (
+        {
-          <div className='px-4'>
+          isIterationNode && handleShowIterationResultList && (
-            <Button
+            <IterationLogTrigger
-              className='flex items-center justify-between w-full'
+              nodeInfo={nodeInfo}
-              variant='tertiary'
+              onShowIterationResultList={handleShowIterationResultList}
-              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 })}
+          isRetryNode && onShowRetryDetail && (
-              </div>
+            <RetryLogTrigger
-              <RiArrowRightSLine className='w-4 h-4 text-components-button-tertiary-text flex-shrink-0' />
+              nodeInfo={nodeInfo}
-            </Button>
+              onShowRetryResultList={onShowRetryDetail}
-          </div>
+            />
-        )
+          )
-      }
+        }
+        {
+          isAgentNode && onShowAgentResultList && (
+            <AgentLogTrigger
+              nodeInfo={nodeInfo}
+              onShowAgentResultList={onShowAgentResultList}
+            />
+          )
+        }
+      </div>
       <div className='px-4 py-2 flex flex-col gap-2'>
         <CodeEditor
           readOnly

web/app/components/workflow/run/special-result-panel.tsx

@@ -7,18 +7,18 @@ import type {
   NodeTracing,
 } from '@/types/workflow'
 
-type SpecialResultPanelProps = {
+export type SpecialResultPanelProps = {
-  showRetryDetail: boolean
+  showRetryDetail?: boolean
-  setShowRetryDetailFalse: () => void
+  setShowRetryDetailFalse?: () => void
-  retryResultList: NodeTracing[]
+  retryResultList?: NodeTracing[]
 
-  showIteratingDetail: boolean
+  showIteratingDetail?: boolean
-  setShowIteratingDetailFalse: () => void
+  setShowIteratingDetailFalse?: () => void
-  iterationResultList: NodeTracing[][]
+  iterationResultList?: NodeTracing[][]
-  iterationResultDurationMap: IterationDurationMap
+  iterationResultDurationMap?: IterationDurationMap
 
-  agentResultList: AgentLogItemWithChildren[]
+  agentResultList?: AgentLogItemWithChildren[]
-  setAgentResultList: (list: AgentLogItemWithChildren[]) => void
+  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}

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}
           />