refactor: mcp server list

This commit is contained in:
one 2025-08-17 19:23:36 +08:00
parent b53a5aa3af
commit e1abc1849f
2 changed files with 34 additions and 29 deletions

View File

@ -1,6 +1,6 @@
import { createSelector } from '@reduxjs/toolkit'
import NavigationService from '@renderer/services/NavigationService'
import store, { useAppDispatch, useAppSelector } from '@renderer/store'
import store, { RootState, useAppDispatch, useAppSelector } from '@renderer/store'
import { addMCPServer, deleteMCPServer, setMCPServers, updateMCPServer } from '@renderer/store/mcp'
import { MCPServer } from '@renderer/types'
import { IpcChannel } from '@shared/IpcChannel'
@ -16,9 +16,9 @@ window.electron.ipcRenderer.on(IpcChannel.Mcp_AddServer, (_event, server: MCPSer
NavigationService.navigate?.(`/settings/mcp/settings/${encodeURIComponent(server.id)}`)
})
const selectMcpServers = (state) => state.mcp.servers
const selectMcpServers = (state: RootState) => state.mcp.servers as MCPServer[]
const selectActiveMcpServers = createSelector([selectMcpServers], (servers) =>
servers.filter((server) => server.isActive)
servers.filter((server: MCPServer) => server.isActive)
)
export const useMCPServers = () => {

View File

@ -8,7 +8,7 @@ import { MCPServer } from '@renderer/types'
import { formatMcpError } from '@renderer/utils/error'
import { Badge, Button, Dropdown, Empty, Switch, Tag } from 'antd'
import { MonitorCheck, Plus, Settings2, SquareArrowOutUpRight } from 'lucide-react'
import { FC, useCallback, useEffect, useRef, useState } from 'react'
import { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { useNavigate } from 'react-router'
import styled from 'styled-components'
@ -134,6 +134,35 @@ const McpServersList: FC = () => {
}
}
const menuItems = useMemo(
() => [
{
key: 'manual',
label: t('settings.mcp.addServer.create'),
onClick: () => {
onAddMcpServer()
}
},
{
key: 'json',
label: t('settings.mcp.addServer.importFrom.json'),
onClick: () => {
setModalType('json')
setIsAddModalVisible(true)
}
},
{
key: 'dxt',
label: t('settings.mcp.addServer.importFrom.dxt'),
onClick: () => {
setModalType('dxt')
setIsAddModalVisible(true)
}
}
],
[onAddMcpServer, t]
)
return (
<Container ref={scrollRef}>
<ListHeader>
@ -145,31 +174,7 @@ const McpServersList: FC = () => {
<InstallNpxUv mini />
<Dropdown
menu={{
items: [
{
key: 'manual',
label: t('settings.mcp.addServer.create'),
onClick: () => {
onAddMcpServer()
}
},
{
key: 'json',
label: t('settings.mcp.addServer.importFrom.json'),
onClick: () => {
setModalType('json')
setIsAddModalVisible(true)
}
},
{
key: 'dxt',
label: t('settings.mcp.addServer.importFrom.dxt'),
onClick: () => {
setModalType('dxt')
setIsAddModalVisible(true)
}
}
]
items: menuItems
}}
trigger={['click']}>
<Button icon={<Plus size={16} />} type="default" shape="round">