feat: Add useSidebarIconShow hook to conditionally render sidebar icons

This commit is contained in:
kangfenmao 2025-02-13 13:38:46 +08:00
parent 22d2121dcc
commit 40958ffb2c
4 changed files with 31 additions and 16 deletions

View File

@ -0,0 +1,8 @@
import { SidebarIcon } from '@renderer/types'
import { useSettings } from './useSettings'
export function useSidebarIconShow(icon: SidebarIcon) {
const { sidebarIcons } = useSettings()
return sidebarIcons.visible.includes(icon)
}

View File

@ -5,6 +5,7 @@ import EmojiPicker from '@renderer/components/EmojiPicker'
import { TopView } from '@renderer/components/TopView' import { TopView } from '@renderer/components/TopView'
import { AGENT_PROMPT } from '@renderer/config/prompts' import { AGENT_PROMPT } from '@renderer/config/prompts'
import { useAgents } from '@renderer/hooks/useAgents' import { useAgents } from '@renderer/hooks/useAgents'
import { useSidebarIconShow } from '@renderer/hooks/useSidebarIcon'
import { fetchGenerate } from '@renderer/services/ApiService' import { fetchGenerate } from '@renderer/services/ApiService'
import { getDefaultModel } from '@renderer/services/AssistantService' import { getDefaultModel } from '@renderer/services/AssistantService'
import { useAppSelector } from '@renderer/store' import { useAppSelector } from '@renderer/store'
@ -37,6 +38,7 @@ const PopupContainer: React.FC<Props> = ({ resolve }) => {
const [loading, setLoading] = useState(false) const [loading, setLoading] = useState(false)
const knowledgeState = useAppSelector((state) => state.knowledge) const knowledgeState = useAppSelector((state) => state.knowledge)
const knowledgeOptions: SelectProps['options'] = [] const knowledgeOptions: SelectProps['options'] = []
const showKnowledgeIcon = useSidebarIconShow('knowledge')
knowledgeState.bases.forEach((base) => { knowledgeState.bases.forEach((base) => {
knowledgeOptions.push({ knowledgeOptions.push({
@ -151,14 +153,16 @@ const PopupContainer: React.FC<Props> = ({ resolve }) => {
disabled={loading} disabled={loading}
/> />
</div> </div>
<Form.Item name="knowledge_base_id" label={t('agents.add.knowledge_base')} rules={[{ required: false }]}> {showKnowledgeIcon && (
<Select <Form.Item name="knowledge_base_id" label={t('agents.add.knowledge_base')} rules={[{ required: false }]}>
allowClear <Select
placeholder={t('agents.add.knowledge_base.placeholder')} allowClear
menuItemSelectedIcon={<CheckOutlined />} placeholder={t('agents.add.knowledge_base.placeholder')}
options={knowledgeOptions} menuItemSelectedIcon={<CheckOutlined />}
/> options={knowledgeOptions}
</Form.Item> />
</Form.Item>
)}
</Form> </Form>
</Modal> </Modal>
) )

View File

@ -16,6 +16,7 @@ import { useAssistant } from '@renderer/hooks/useAssistant'
import { modelGenerating, useRuntime } from '@renderer/hooks/useRuntime' import { modelGenerating, useRuntime } from '@renderer/hooks/useRuntime'
import { useMessageStyle, useSettings } from '@renderer/hooks/useSettings' import { useMessageStyle, useSettings } from '@renderer/hooks/useSettings'
import { useShortcut, useShortcutDisplay } from '@renderer/hooks/useShortcuts' import { useShortcut, useShortcutDisplay } from '@renderer/hooks/useShortcuts'
import { useSidebarIconShow } from '@renderer/hooks/useSidebarIcon'
import { useShowTopics } from '@renderer/hooks/useStore' import { useShowTopics } from '@renderer/hooks/useStore'
import { addAssistantMessagesToTopic, getDefaultTopic } from '@renderer/services/AssistantService' import { addAssistantMessagesToTopic, getDefaultTopic } from '@renderer/services/AssistantService'
import { EVENT_NAMES, EventEmitter } from '@renderer/services/EventService' import { EVENT_NAMES, EventEmitter } from '@renderer/services/EventService'
@ -65,8 +66,7 @@ const Inputbar: FC<Props> = ({ assistant: _assistant, setActiveTopic }) => {
pasteLongTextThreshold, pasteLongTextThreshold,
showInputEstimatedTokens, showInputEstimatedTokens,
clickAssistantToShowTopic, clickAssistantToShowTopic,
autoTranslateWithSpace, autoTranslateWithSpace
sidebarIcons
} = useSettings() } = useSettings()
const [expended, setExpend] = useState(false) const [expended, setExpend] = useState(false)
const [estimateTokenCount, setEstimateTokenCount] = useState(0) const [estimateTokenCount, setEstimateTokenCount] = useState(0)
@ -90,7 +90,7 @@ const Inputbar: FC<Props> = ({ assistant: _assistant, setActiveTopic }) => {
const isVision = useMemo(() => isVisionModel(model), [model]) const isVision = useMemo(() => isVisionModel(model), [model])
const supportExts = useMemo(() => [...textExts, ...documentExts, ...(isVision ? imageExts : [])], [isVision]) const supportExts = useMemo(() => [...textExts, ...documentExts, ...(isVision ? imageExts : [])], [isVision])
const showKnowledgeIcon = sidebarIcons.visible.includes('knowledge') const showKnowledgeIcon = useSidebarIconShow('knowledge')
const estimateTextTokens = useCallback(debounce(estimateTxtTokens, 1000), []) const estimateTextTokens = useCallback(debounce(estimateTxtTokens, 1000), [])
const inputTokenCount = useMemo( const inputTokenCount = useMemo(
@ -453,8 +453,8 @@ const Inputbar: FC<Props> = ({ assistant: _assistant, setActiveTopic }) => {
}, []) }, [])
useEffect(() => { useEffect(() => {
setSelectedKnowledgeBase(assistant.knowledge_base) setSelectedKnowledgeBase(showKnowledgeIcon ? assistant.knowledge_base : undefined)
}, [assistant.id, assistant.knowledge_base]) }, [assistant.id, assistant.knowledge_base, showKnowledgeIcon])
const textareaRows = window.innerHeight >= 1000 || isBubbleStyle ? 2 : 1 const textareaRows = window.innerHeight >= 1000 || isBubbleStyle ? 2 : 1

View File

@ -2,6 +2,7 @@ import { HStack } from '@renderer/components/Layout'
import { TopView } from '@renderer/components/TopView' import { TopView } from '@renderer/components/TopView'
import { useAgent } from '@renderer/hooks/useAgents' import { useAgent } from '@renderer/hooks/useAgents'
import { useAssistant } from '@renderer/hooks/useAssistant' import { useAssistant } from '@renderer/hooks/useAssistant'
import { useSidebarIconShow } from '@renderer/hooks/useSidebarIcon'
import { Assistant } from '@renderer/types' import { Assistant } from '@renderer/types'
import { Menu, Modal } from 'antd' import { Menu, Modal } from 'antd'
import { useState } from 'react' import { useState } from 'react'
@ -34,6 +35,8 @@ const AssistantSettingPopupContainer: React.FC<Props> = ({ resolve, ...props })
const updateAssistant = isAgent ? _useAgent.updateAgent : _useAssistant.updateAssistant const updateAssistant = isAgent ? _useAgent.updateAgent : _useAssistant.updateAssistant
const updateAssistantSettings = isAgent ? _useAgent.updateAgentSettings : _useAssistant.updateAssistantSettings const updateAssistantSettings = isAgent ? _useAgent.updateAgentSettings : _useAssistant.updateAssistantSettings
const showKnowledgeIcon = useSidebarIconShow('knowledge')
const onOk = () => { const onOk = () => {
setOpen(false) setOpen(false)
} }
@ -59,11 +62,11 @@ const AssistantSettingPopupContainer: React.FC<Props> = ({ resolve, ...props })
key: 'messages', key: 'messages',
label: t('assistants.settings.preset_messages') label: t('assistants.settings.preset_messages')
}, },
{ showKnowledgeIcon && {
key: 'knowledge_base', key: 'knowledge_base',
label: t('assistants.settings.knowledge_base') label: t('assistants.settings.knowledge_base')
} }
] ].filter(Boolean) as { key: string; label: string }[]
return ( return (
<StyledModal <StyledModal
@ -120,7 +123,7 @@ const AssistantSettingPopupContainer: React.FC<Props> = ({ resolve, ...props })
updateAssistantSettings={updateAssistantSettings} updateAssistantSettings={updateAssistantSettings}
/> />
)} )}
{menu === 'knowledge_base' && ( {menu === 'knowledge_base' && showKnowledgeIcon && (
<AssistantKnowledgeBaseSettings <AssistantKnowledgeBaseSettings
assistant={assistant} assistant={assistant}
updateAssistant={updateAssistant} updateAssistant={updateAssistant}