outman/dify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refact workflow run log

Browse Source
This commit is contained in:
zxhlyh 2024-12-25 16:56:55 +08:00
parent 8503099d65
commit 08515957f1
12 changed files with 146 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/app/components/workflow/nodes/_base/components/before-run-form/index.tsx
View File

@ -18,7 +18,7 @@ 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-result-panel'
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'

4
web/app/components/workflow/nodes/iteration/panel.tsx
View File

@ -7,7 +7,7 @@ import {
import VarReferencePicker from '../_base/components/variable/var-reference-picker'
import Split from '../_base/components/split'
import ResultPanel from '../../run/result-panel'
import IterationResultPanel from '../../run/iteration-result-panel'
import { IterationResultPanel } from '../../run/iteration-log'
import { MAX_ITERATION_PARALLEL_NUM, MIN_ITERATION_PARALLEL_NUM } from '../../constants'
import type { IterationNodeType } from './types'
import useConfig from './use-config'
@ -123,7 +123,7 @@ const Panel: FC<NodePanelProps<IterationNodeType>> = ({
onChange={changeParallelNums}
max={MAX_ITERATION_PARALLEL_NUM}
min={MIN_ITERATION_PARALLEL_NUM}
className=' flex-shrink-0 flex-1 mt-4'
className=' shrink-0 flex-1 mt-4'
/>
</div>

4
web/app/components/workflow/panel/workflow-preview.tsx
View File

@ -24,8 +24,8 @@ import {
} from '../types'
import { SimpleBtn } from '../../app/text-generate/item'
import Toast from '../../base/toast'
import IterationResultPanel from '../run/iteration-result-panel'
import RetryResultPanel from '../run/retry-result-panel'
import { IterationResultPanel } from '../run/iteration-log'
import { RetryResultPanel } from '../run/retry-log'
import InputsPanel from './inputs-panel'
import cn from '@/utils/classnames'
import Loading from '@/app/components/base/loading'

3
web/app/components/workflow/run/agent-log/index.tsx Normal file
View File

@ -0,0 +1,3 @@
export { default as AgentLogTrigger } from './agent-log-trigger'
export { default as AgentResultPanel } from './agent-result-panel'
export { default as AgentToolCallResultPanel } from './tool-call-result-panel'

2
web/app/components/workflow/run/iteration-log/index.tsx Normal file
View File

@ -0,0 +1,2 @@
export { default as IterationLogTrigger } from './iteration-log-trigger'
export { default as IterationResultPanel } from './iteration-result-panel'

72
web/app/components/workflow/run/iteration-log/iteration-log-trigger.tsx Normal file
View File

@ -0,0 +1,72 @@
import { useTranslation } from 'react-i18next'
import { RiArrowRightSLine } from '@remixicon/react'
import Button from '@/app/components/base/button'
import type {
IterationDurationMap,
NodeTracing,
} from '@/types/workflow'
import { Iteration } from '@/app/components/base/icons/src/vender/workflow'
import Split from '@/app/components/workflow/nodes/_base/components/split'
type IterationLogTriggerProps = {
nodeInfo: NodeTracing
onShowIterationResultList: (iterationResultList: NodeTracing[][], iterationResultDurationMap: IterationDurationMap) => void
justShowIterationNavArrow?: boolean
}
const IterationLogTrigger = ({
nodeInfo,
onShowIterationResultList,
justShowIterationNavArrow,
}: IterationLogTriggerProps) => {
const { t } = useTranslation()
const getErrorCount = (details: NodeTracing[][] | undefined) => {
if (!details || details.length === 0)
return 0
return details.reduce((acc, iteration) => {
if (iteration.some(item => item.status === 'failed'))
acc++
return acc
}, 0)
}
const getCount = (iteration_curr_length: number | undefined, iteration_length: number) => {
if ((iteration_curr_length && iteration_curr_length < iteration_length) || !iteration_length)
return iteration_curr_length
return iteration_length
}
const handleOnShowIterationDetail = (e: React.MouseEvent<HTMLButtonElement>) => {
e.stopPropagation()
e.nativeEvent.stopImmediatePropagation()
onShowIterationResultList(nodeInfo.details || [], nodeInfo?.iterDurationMap || nodeInfo.execution_metadata?.iteration_duration_map || {})
}
return (
<div className='mt-2 mb-1 !px-2'>
<Button
className='flex items-center w-full self-stretch gap-2 px-3 py-2 bg-components-button-tertiary-bg-hover hover:bg-components-button-tertiary-bg-hover rounded-lg cursor-pointer border-none'
onClick={handleOnShowIterationDetail}
>
<Iteration className='w-4 h-4 text-components-button-tertiary-text shrink-0' />
<div className='flex-1 text-left system-sm-medium text-components-button-tertiary-text'>{t('workflow.nodes.iteration.iteration', { count: getCount(nodeInfo.details?.length, nodeInfo.metadata?.iterator_length) })}{getErrorCount(nodeInfo.details) > 0 && (
<>
{t('workflow.nodes.iteration.comma')}
{t('workflow.nodes.iteration.error', { count: getErrorCount(nodeInfo.details) })}
</>
)}</div>
{justShowIterationNavArrow
? (
<RiArrowRightSLine className='w-4 h-4 text-components-button-tertiary-text shrink-0' />
)
: (
<div className='flex items-center space-x-1 text-[#155EEF]'>
<div className='text-[13px] font-normal '>{t('workflow.common.viewDetailInTracingPanel')}</div>
<RiArrowRightSLine className='w-4 h-4 text-components-button-tertiary-text shrink-0' />
</div>
)}
</Button>
<Split className='mt-2' />
</div>
)
}
export default IterationLogTrigger

8
web/app/components/workflow/run/iteration-result-panel.tsx → web/app/components/workflow/run/iteration-log/iteration-result-panel.tsx
View File

@ -8,10 +8,10 @@ import {
RiErrorWarningLine,
RiLoader2Line,
} from '@remixicon/react'
import { ArrowNarrowLeft } from '../../base/icons/src/vender/line/arrows'
import { NodeRunningStatus } from '../types'
import TracingPanel from './tracing-panel'
import RetryResultPanel from './retry-result-panel'
import { ArrowNarrowLeft } from '@/app/components/base/icons/src/vender/line/arrows'
import { NodeRunningStatus } from '@/app/components/workflow/types'
import TracingPanel from '@/app/components/workflow/run/tracing-panel'
import { RetryResultPanel } from '@/app/components/workflow/run/retry-log'
import { Iteration } from '@/app/components/base/icons/src/vender/workflow'
import cn from '@/utils/classnames'
import type { IterationDurationMap, NodeTracing } from '@/types/workflow'

82
web/app/components/workflow/run/node.tsx
View File

@ -8,16 +8,14 @@ import {
RiCheckboxCircleFill,
RiErrorWarningLine,
RiLoader2Line,
RiRestartFill,
} from '@remixicon/react'
import BlockIcon from '../block-icon'
import { BlockEnum } from '../types'
import Split from '../nodes/_base/components/split'
import { Iteration } from '@/app/components/base/icons/src/vender/workflow'
import { RetryLogTrigger } from './retry-log'
import { IterationLogTrigger } from './iteration-log'
import cn from '@/utils/classnames'
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 { IterationDurationMap, NodeTracing } from '@/types/workflow'
import ErrorHandleTip from '@/app/components/workflow/nodes/_base/components/error-handle/error-handle-tip'
@ -72,38 +70,13 @@ const NodePanel: FC<Props> = ({
return `${Number.parseFloat((tokens / 1000000).toFixed(3))}M`
}
const getCount = (iteration_curr_length: number | undefined, iteration_length: number) => {
if ((iteration_curr_length && iteration_curr_length < iteration_length) || !iteration_length)
return iteration_curr_length
return iteration_length
}
const getErrorCount = (details: NodeTracing[][] | undefined) => {
if (!details || details.length === 0)
return 0
return details.reduce((acc, iteration) => {
if (iteration.some(item => item.status === 'failed'))
acc++
return acc
}, 0)
}
useEffect(() => {
setCollapseState(!nodeInfo.expand)
}, [nodeInfo.expand, setCollapseState])
const isIterationNode = nodeInfo.node_type === BlockEnum.Iteration
const isRetryNode = hasRetryNode(nodeInfo.node_type) && nodeInfo.retryDetail
const handleOnShowIterationDetail = (e: React.MouseEvent<HTMLButtonElement>) => {
e.stopPropagation()
e.nativeEvent.stopImmediatePropagation()
onShowIterationDetail?.(nodeInfo.details || [], nodeInfo?.iterDurationMap || nodeInfo.execution_metadata?.iteration_duration_map || {})
}
const handleOnShowRetryDetail = (e: React.MouseEvent<HTMLButtonElement>) => {
e.stopPropagation()
e.nativeEvent.stopImmediatePropagation()
onShowRetryDetail?.(nodeInfo.retryDetail || [])
}
return (
<div className={cn('px-2 py-1', className)}>
<div className='group transition-all bg-background-default border border-components-panel-border rounded-[10px] shadow-xs hover:shadow-md'>
@ -153,45 +126,18 @@ const NodePanel: FC<Props> = ({
{!collapseState && !hideProcessDetail && (
<div className='px-1 pb-1'>
{/* The nav to the iteration detail */}
{isIterationNode && !notShowIterationNav && (
<div className='mt-2 mb-1 !px-2'>
<Button
className='flex items-center w-full self-stretch gap-2 px-3 py-2 bg-components-button-tertiary-bg-hover hover:bg-components-button-tertiary-bg-hover rounded-lg cursor-pointer border-none'
onClick={handleOnShowIterationDetail}
>
<Iteration className='w-4 h-4 text-components-button-tertiary-text shrink-0' />
<div className='flex-1 text-left system-sm-medium text-components-button-tertiary-text'>{t('workflow.nodes.iteration.iteration', { count: getCount(nodeInfo.details?.length, nodeInfo.metadata?.iterator_length) })}{getErrorCount(nodeInfo.details) > 0 && (
<>
{t('workflow.nodes.iteration.comma')}
{t('workflow.nodes.iteration.error', { count: getErrorCount(nodeInfo.details) })}
</>
)}</div>
{justShowIterationNavArrow
? (
<RiArrowRightSLine className='w-4 h-4 text-components-button-tertiary-text shrink-0' />
)
: (
<div className='flex items-center space-x-1 text-[#155EEF]'>
<div className='text-[13px] font-normal '>{t('workflow.common.viewDetailInTracingPanel')}</div>
<RiArrowRightSLine className='w-4 h-4 text-components-button-tertiary-text shrink-0' />
</div>
)}
</Button>
<Split className='mt-2' />
</div>
{isIterationNode && !notShowIterationNav && onShowIterationDetail && (
<IterationLogTrigger
nodeInfo={nodeInfo}
onShowIterationResultList={onShowIterationDetail}
justShowIterationNavArrow={justShowIterationNavArrow}
/>
)}
{isRetryNode && (
<Button
className='flex items-center justify-between mb-1 w-full'
variant='tertiary'
onClick={handleOnShowRetryDetail}
>
<div className='flex items-center'>
<RiRestartFill className='mr-0.5 w-4 h-4 text-components-button-tertiary-text shrink-0' />
{t('workflow.nodes.common.retry.retries', { num: nodeInfo.retryDetail?.length })}
</div>
<RiArrowRightSLine className='w-4 h-4 text-components-button-tertiary-text shrink-0' />
</Button>
{isRetryNode && onShowRetryDetail && (
<RetryLogTrigger
nodeInfo={nodeInfo}
onShowRetryResultList={onShowRetryDetail}
/>
)}
<div className={cn('mb-1', hideInfo && '!px-2 !py-0.5')}>
{(nodeInfo.status === 'stopped') && (

2
web/app/components/workflow/run/retry-log/index.tsx Normal file
View File

@ -0,0 +1,2 @@
export { default as RetryLogTrigger } from './retry-log-trigger'
export { default as RetryResultPanel } from './retry-result-panel'

41
web/app/components/workflow/run/retry-log/retry-log-trigger.tsx Normal file
View File

@ -0,0 +1,41 @@
import { useTranslation } from 'react-i18next'
import {
RiArrowRightSLine,
RiRestartFill,
} from '@remixicon/react'
import Button from '@/app/components/base/button'
import type { NodeTracing } from '@/types/workflow'
type RetryLogTriggerProps = {
nodeInfo: NodeTracing
onShowRetryResultList: (detail: NodeTracing[]) => void
}
const RetryLogTrigger = ({
nodeInfo,
onShowRetryResultList,
}: RetryLogTriggerProps) => {
const { t } = useTranslation()
const { retryDetail } = nodeInfo
const handleShowRetryResultList = (e: React.MouseEvent<HTMLButtonElement>) => {
e.stopPropagation()
e.nativeEvent.stopImmediatePropagation()
onShowRetryResultList(retryDetail || [])
}
return (
<Button
className='flex items-center justify-between mb-1 w-full'
variant='tertiary'
onClick={handleShowRetryResultList}
>
<div className='flex items-center'>
<RiRestartFill className='mr-0.5 w-4 h-4 text-components-button-tertiary-text shrink-0' />
{t('workflow.nodes.common.retry.retries', { num: retryDetail?.length })}
</div>
<RiArrowRightSLine className='w-4 h-4 text-components-button-tertiary-text shrink-0' />
</Button>
)
}
export default RetryLogTrigger

2
web/app/components/workflow/run/retry-result-panel.tsx → web/app/components/workflow/run/retry-log/retry-result-panel.tsx
View File

@ -6,7 +6,7 @@ import { useTranslation } from 'react-i18next'
import {
RiArrowLeftLine,
} from '@remixicon/react'
import TracingPanel from './tracing-panel'
import TracingPanel from '../tracing-panel'
import type { NodeTracing } from '@/types/workflow'
type Props = {

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

@ -1,5 +1,5 @@
import RetryResultPanel from './retry-result-panel'
import IterationResultPanel from './iteration-result-panel'
import { RetryResultPanel } from './retry-log'
import { IterationResultPanel } from './iteration-log'
import type { IterationDurationMap, NodeTracing } from '@/types/workflow'
type SpecialResultPanelProps = {