fix: add text overflow ellipsis and title for iteration and loop log triggers

This commit is contained in:
Younglina 2025-03-17 13:56:00 +08:00
parent 2b4d1cf1db
commit 78e01b9353
2 changed files with 24 additions and 12 deletions

View File

@ -37,18 +37,24 @@ const IterationLogTrigger = ({
e.nativeEvent.stopImmediatePropagation()
onShowIterationResultList(nodeInfo.details || [], nodeInfo?.iterDurationMap || nodeInfo.execution_metadata?.iteration_duration_map || {})
}
const iterationText = 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) })}` :
'')
return (
<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>
<div
className='flex-1 text-left system-sm-medium text-components-button-tertiary-text whitespace-nowrap overflow-hidden text-ellipsis'
title={iterationText}
>
{iterationText}
</div>
<RiArrowRightSLine className='w-4 h-4 text-components-button-tertiary-text shrink-0' />
</Button>
)

View File

@ -37,18 +37,24 @@ const LoopLogTrigger = ({
e.nativeEvent.stopImmediatePropagation()
onShowLoopResultList(nodeInfo.details || [], nodeInfo?.loopDurationMap || nodeInfo.execution_metadata?.loop_duration_map || {})
}
const loopText = t('workflow.nodes.loop.loop', { count: getCount(nodeInfo.details?.length, nodeInfo.metadata?.loop_length) }) +
(getErrorCount(nodeInfo.details) > 0 ?
`${t('workflow.nodes.loop.comma')}${t('workflow.nodes.loop.error', { count: getErrorCount(nodeInfo.details) })}` :
'')
return (
<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={handleOnShowLoopDetail}
>
<Loop 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.loop.loop', { count: getCount(nodeInfo.details?.length, nodeInfo.metadata?.loop_length) })}{getErrorCount(nodeInfo.details) > 0 && (
<>
{t('workflow.nodes.loop.comma')}
{t('workflow.nodes.loop.error', { count: getErrorCount(nodeInfo.details) })}
</>
)}</div>
<div
className='flex-1 text-left system-sm-medium text-components-button-tertiary-text whitespace-nowrap overflow-hidden text-ellipsis'
title={loopText}
>
{loopText}
</div>
<RiArrowRightSLine className='w-4 h-4 text-components-button-tertiary-text shrink-0' />
</Button>
)