diff --git a/web/app/components/workflow/variable-inspect/listening.tsx b/web/app/components/workflow/variable-inspect/listening.tsx index eb63883c0e..f78e4a17a2 100644 --- a/web/app/components/workflow/variable-inspect/listening.tsx +++ b/web/app/components/workflow/variable-inspect/listening.tsx @@ -1,12 +1,28 @@ import type { FC } from 'react' import { useTranslation } from 'react-i18next' -import { useStoreApi } from 'reactflow' +import { type Node, useStoreApi } from 'reactflow' import Button from '@/app/components/base/button' import BlockIcon from '@/app/components/workflow/block-icon' import { BlockEnum } from '@/app/components/workflow/types' import { StopCircle } from '@/app/components/base/icons/src/vender/line/mediaAndDevices' import { useStore } from '../store' import { useToolIcon } from '@/app/components/workflow/hooks/use-tool-icon' +import type { TFunction } from 'i18next' + +const resolveListeningDescription = ( + message: string | undefined, + triggerNode: Node | undefined, + t: TFunction, +): string => { + if (message) + return message + + const nodeDescription = (triggerNode?.data as { desc?: string })?.desc + if (nodeDescription) + return nodeDescription + + return t('workflow.debug.variableInspect.listening.tip') +} export type ListeningProps = { onStop: () => void @@ -34,13 +50,14 @@ const Listening: FC = ({ // Use the useToolIcon hook to get the icon for plugin/datasource triggers const toolIcon = useToolIcon(triggerNode?.data) + const description = resolveListeningDescription(message, triggerNode, t) return (
{t('workflow.debug.variableInspect.listening.title')}
-
{message ?? t('workflow.debug.variableInspect.listening.tip')}
+
{description}