refactor(Inputbar): make button tooltips disappear faster (#8011)

This commit is contained in:
one 2025-07-10 17:26:38 +08:00 committed by GitHub
parent dff44f2721
commit ffbd6445df
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
12 changed files with 38 additions and 12 deletions

View File

@ -77,6 +77,7 @@ const TranslateButton: FC<Props> = ({ text, onTranslated, disabled, style, isLoa
<Tooltip
placement="top"
title={t('chat.input.translate', { target_language: getLanguageByLangcode(targetLanguage).label() })}
mouseLeaveDelay={0}
arrow>
<ToolbarButton onClick={handleTranslate} disabled={disabled || isTranslating} style={style} type="text">
{isTranslating ? <LoadingOutlined spin /> : <Languages size={18} />}

View File

@ -54,7 +54,11 @@ const AttachmentButton: FC<Props> = ({
}))
return (
<Tooltip placement="top" title={couldAddImageFile ? t('chat.input.upload') : t('chat.input.upload.document')} arrow>
<Tooltip
placement="top"
title={couldAddImageFile ? t('chat.input.upload') : t('chat.input.upload.document')}
mouseLeaveDelay={0}
arrow>
<ToolbarButton type="text" onClick={onSelectFile} disabled={disabled}>
<Paperclip size={18} style={{ color: files.length ? 'var(--color-primary)' : 'var(--color-icon)' }} />
</ToolbarButton>

View File

@ -21,6 +21,7 @@ const GenerateImageButton: FC<Props> = ({ model, ToolbarButton, assistant, onEna
title={
isGenerateImageModel(model) ? t('chat.input.generate_image') : t('chat.input.generate_image_not_supported')
}
mouseLeaveDelay={0}
arrow>
<ToolbarButton type="text" disabled={!isGenerateImageModel(model)} onClick={onEnableGenerateImage}>
<Image size={18} color={assistant.enableGenerateImage ? 'var(--color-link)' : 'var(--color-icon)'} />

View File

@ -909,7 +909,7 @@ const Inputbar: FC<Props> = ({ assistant: _assistant, setActiveTopic, topic }) =
/>
<TranslateButton text={text} onTranslated={onTranslated} isLoading={isTranslating} />
{loading && (
<Tooltip placement="top" title={t('chat.input.pause')} arrow>
<Tooltip placement="top" title={t('chat.input.pause')} mouseLeaveDelay={0} arrow>
<ToolbarButton type="text" onClick={onPause} style={{ marginRight: -2, marginTop: 1 }}>
<CirclePause style={{ color: 'var(--color-error)', fontSize: 20 }} />
</ToolbarButton>

View File

@ -290,7 +290,11 @@ const InputbarTools = ({
key: 'new_topic',
label: t('chat.input.new_topic', { Command: '' }),
component: (
<Tooltip placement="top" title={t('chat.input.new_topic', { Command: newTopicShortcut })} arrow>
<Tooltip
placement="top"
title={t('chat.input.new_topic', { Command: newTopicShortcut })}
mouseLeaveDelay={0}
arrow>
<ToolbarButton type="text" onClick={addNewTopic}>
<MessageSquareDiff size={19} />
</ToolbarButton>
@ -395,7 +399,11 @@ const InputbarTools = ({
key: 'clear_topic',
label: t('chat.input.clear', { Command: '' }),
component: (
<Tooltip placement="top" title={t('chat.input.clear', { Command: cleanTopicShortcut })} arrow>
<Tooltip
placement="top"
title={t('chat.input.clear', { Command: cleanTopicShortcut })}
mouseLeaveDelay={0}
arrow>
<ToolbarButton type="text" onClick={clearTopic}>
<PaintbrushVertical size={18} />
</ToolbarButton>
@ -406,7 +414,11 @@ const InputbarTools = ({
key: 'toggle_expand',
label: isExpended ? t('chat.input.collapse') : t('chat.input.expand'),
component: (
<Tooltip placement="top" title={isExpended ? t('chat.input.collapse') : t('chat.input.expand')} arrow>
<Tooltip
placement="top"
title={isExpended ? t('chat.input.collapse') : t('chat.input.expand')}
mouseLeaveDelay={0}
arrow>
<ToolbarButton type="text" onClick={onToggleExpended}>
{isExpended ? <Minimize size={18} /> : <Maximize size={18} />}
</ToolbarButton>

View File

@ -85,7 +85,7 @@ const KnowledgeBaseButton: FC<Props> = ({ ref, selectedBases, onSelect, disabled
}))
return (
<Tooltip placement="top" title={t('chat.input.knowledge_base')} arrow>
<Tooltip placement="top" title={t('chat.input.knowledge_base')} mouseLeaveDelay={0} arrow>
<ToolbarButton type="text" onClick={handleOpenQuickPanel} disabled={disabled}>
<FileSearch size={18} />
</ToolbarButton>

View File

@ -454,7 +454,7 @@ const MCPToolsButton: FC<Props> = ({ ref, setInputValue, resizeTextArea, Toolbar
}))
return (
<Tooltip placement="top" title={t('settings.mcp.title')} arrow>
<Tooltip placement="top" title={t('settings.mcp.title')} mouseLeaveDelay={0} arrow>
<ToolbarButton type="text" onClick={handleOpenQuickPanel}>
<SquareTerminal
size={18}

View File

@ -162,7 +162,7 @@ const MentionModelsButton: FC<Props> = ({
}))
return (
<Tooltip placement="top" title={t('agents.edit.model.select.title')} arrow>
<Tooltip placement="top" title={t('agents.edit.model.select.title')} mouseLeaveDelay={0} arrow>
<ToolbarButton type="text" onClick={handleOpenQuickPanel}>
<AtSign size={18} />
</ToolbarButton>

View File

@ -16,7 +16,11 @@ const NewContextButton: FC<Props> = ({ onNewContext, ToolbarButton }) => {
useShortcut('toggle_new_context', onNewContext)
return (
<Tooltip placement="top" title={t('chat.input.new.context', { Command: newContextShortcut })} arrow>
<Tooltip
placement="top"
title={t('chat.input.new.context', { Command: newContextShortcut })}
mouseLeaveDelay={0}
arrow>
<ToolbarButton type="text" onClick={onNewContext}>
<Eraser size={18} />
</ToolbarButton>

View File

@ -148,7 +148,7 @@ const QuickPhrasesButton = ({ ref, setInputValue, resizeTextArea, ToolbarButton,
return (
<>
<Tooltip placement="top" title={t('settings.quickPhrase.title')} arrow>
<Tooltip placement="top" title={t('settings.quickPhrase.title')} mouseLeaveDelay={0} arrow>
<ToolbarButton type="text" onClick={handleOpenQuickPanel}>
<Zap size={18} />
</ToolbarButton>

View File

@ -190,7 +190,7 @@ const ThinkingButton: FC<Props> = ({ ref, model, assistant, ToolbarButton }): Re
}))
return (
<Tooltip placement="top" title={t('assistants.settings.reasoning_effort')} arrow>
<Tooltip placement="top" title={t('assistants.settings.reasoning_effort')} mouseLeaveDelay={0} arrow>
<ToolbarButton type="text" onClick={handleOpenQuickPanel}>
{getThinkingIcon()}
</ToolbarButton>

View File

@ -127,7 +127,11 @@ const WebSearchButton: FC<Props> = ({ ref, assistant, ToolbarButton }) => {
}))
return (
<Tooltip placement="top" title={enableWebSearch ? t('common.close') : t('chat.input.web_search')} arrow>
<Tooltip
placement="top"
title={enableWebSearch ? t('common.close') : t('chat.input.web_search')}
mouseLeaveDelay={0}
arrow>
<ToolbarButton type="text" onClick={handleOpenQuickPanel}>
<Globe
size={18}