whai/cherry-studio
1
1
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

refactor: improved code readability for filtering agents

Browse Source
This commit is contained in:
kangfenmao 2024-10-26 22:38:31 +08:00
parent ac21c90b6f
commit ab1c597e1c
1 changed files with 17 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/renderer/src/pages/agents/AgentsPage.tsx
View File

@ -6,8 +6,8 @@ import { createAssistantFromAgent } from '@renderer/services/assistant'
import { Agent } from '@renderer/types' import { Agent } from '@renderer/types'
import { uuid } from '@renderer/utils' import { uuid } from '@renderer/utils'
import { Col, Input, Row, Tabs as TabsAntd, Typography } from 'antd' import { Col, Input, Row, Tabs as TabsAntd, Typography } from 'antd'
import { debounce, groupBy, omit } from 'lodash' import { groupBy, omit } from 'lodash'
import { FC, useEffect, useMemo, useState } from 'react' import { FC, useMemo, useState } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
import ReactMarkdown from 'react-markdown' import ReactMarkdown from 'react-markdown'
import styled from 'styled-components' import styled from 'styled-components'
@ -30,33 +30,25 @@ const getAgentsFromSystemAgents = () => {
const AgentsPage: FC = () => { const AgentsPage: FC = () => {
const [search, setSearch] = useState('') const [search, setSearch] = useState('')
const [filteredAgentGroups, setFilteredAgentGroups] = useState({})
const agentGroups = useMemo(() => groupBy(getAgentsFromSystemAgents(), 'group'), []) const agentGroups = useMemo(() => groupBy(getAgentsFromSystemAgents(), 'group'), [])
const { t } = useTranslation() const { t } = useTranslation()
const debouncedSearch = useMemo( const filteredAgentGroups = useMemo(() => {
() => if (!search.trim()) return agentGroups
debounce((searchTerm: string) => {
if (!searchTerm.trim()) {
setFilteredAgentGroups(agentGroups)
return
}
const filtered = {} const filtered = {}
Object.entries(agentGroups).forEach(([group, agents]) => { Object.entries(agentGroups).forEach(([group, agents]) => {
const filteredAgents = agents.filter( const filteredAgents = agents.filter(
(agent) => (agent) =>
agent.name.toLowerCase().includes(searchTerm.toLowerCase()) || agent.name.toLowerCase().includes(search.toLowerCase()) ||
agent.prompt?.toLowerCase().includes(searchTerm.toLowerCase()) agent.prompt?.toLowerCase().includes(search.toLowerCase())
) )
if (filteredAgents.length > 0) { if (filteredAgents.length > 0) {
filtered[group] = filteredAgents filtered[group] = filteredAgents
} }
}) })
setFilteredAgentGroups(filtered) return filtered
}, 500), }, [agentGroups, search])
[agentGroups]
)
const getAgentName = (agent: Agent) => { const getAgentName = (agent: Agent) => {
return agent.emoji ? agent.emoji + ' ' + agent.name : agent.name return agent.emoji ? agent.emoji + ' ' + agent.name : agent.name
@ -91,10 +83,6 @@ const AgentsPage: FC = () => {
} }
} }
useEffect(() => {
debouncedSearch(search)
}, [search, debouncedSearch])
return ( return (
<Container> <Container>
<Navbar> <Navbar>