diff --git a/web/app/components/workflow/nodes/_base/components/prompt/editor.tsx b/web/app/components/workflow/nodes/_base/components/prompt/editor.tsx index 2f198d8338..1f28355183 100644 --- a/web/app/components/workflow/nodes/_base/components/prompt/editor.tsx +++ b/web/app/components/workflow/nodes/_base/components/prompt/editor.tsx @@ -1,6 +1,6 @@ 'use client' import type { FC } from 'react' -import React, { useCallback, useRef } from 'react' +import React, { useCallback, useEffect, useRef, useState } from 'react' import cn from 'classnames' import copy from 'copy-to-clipboard' import { useTranslation } from 'react-i18next' @@ -76,21 +76,24 @@ const Editor: FC = ({ const [isFocus, { setTrue: setFocus, - setFalse: doSetBlur, + setFalse: setBlur, }] = useBoolean(false) - const notBlur = useRef(false) + const hideTooltipRunId = useRef(0) - const setBlur = () => { - // delay to avoid to not handle click event(handleInsertVariable) - setTimeout(() => { - if (!notBlur.current) - doSetBlur() - notBlur.current = false - }, 500) - } + const [isShowInsertToolTip, setIsShowInsertTooltip] = useState(false) + useEffect(() => { + if (isFocus) { + clearTimeout(hideTooltipRunId.current) + setIsShowInsertTooltip(true) + } + else { + hideTooltipRunId.current = setTimeout(() => { + setIsShowInsertTooltip(false) + }, 100) as any + } + }, [isFocus]) const handleInsertVariable = () => { - notBlur.current = true setFocus() eventEmitter?.emit({ type: PROMPT_EDITOR_INSERT_QUICKLY, instanceId } as any) } @@ -129,7 +132,7 @@ const Editor: FC = ({ onHeightChange={setEditorHeight} footer={(
- {isFocus + {(isFocus || isShowInsertToolTip) ? (