diff --git a/src/renderer/src/pages/settings/MCPSettings/McpSettingsNavbar.tsx b/src/renderer/src/pages/settings/MCPSettings/McpSettingsNavbar.tsx index a40700c3ac..afe9d62a4a 100644 --- a/src/renderer/src/pages/settings/MCPSettings/McpSettingsNavbar.tsx +++ b/src/renderer/src/pages/settings/MCPSettings/McpSettingsNavbar.tsx @@ -1,17 +1,77 @@ import { NavbarRight } from '@renderer/components/app/Navbar' import { HStack } from '@renderer/components/Layout' import { isWindows } from '@renderer/config/constant' -import { Button } from 'antd' -import { Search, SquareArrowOutUpRight } from 'lucide-react' +import { Button, Dropdown, Menu, type MenuProps } from 'antd' +import { ChevronDown, Search } from 'lucide-react' import { useTranslation } from 'react-i18next' import { useNavigate } from 'react-router' import InstallNpxUv from './InstallNpxUv' +const mcpResources = [ + { + name: 'Model Context Protocol Servers', + url: 'https://github.com/modelcontextprotocol/servers', + logo: 'https://avatars.githubusercontent.com/u/182288589' + }, + { + name: 'Awesome MCP Servers', + url: 'https://github.com/punkpeye/awesome-mcp-servers', + logo: 'https://github.githubassets.com/assets/github-logo-55c5b9a1fe52.png' + }, + { + name: 'mcp.so', + url: 'https://mcp.so/', + logo: 'https://mcp.so/favicon.ico' + }, + { + name: 'modelscope.cn', + url: 'https://www.modelscope.cn/mcp', + logo: 'https://g.alicdn.com/sail-web/maas/2.7.35/favicon/128.ico' + }, + { + name: 'mcp.higress.ai', + url: 'https://mcp.higress.ai/', + logo: 'https://framerusercontent.com/images/FD5yBobiBj4Evn0qf11X7iQ9csk.png' + }, + { + name: 'smithery.ai', + url: 'https://smithery.ai/', + logo: 'https://smithery.ai/logo.svg' + }, + { + name: 'glama.ai', + url: 'https://glama.ai/mcp/servers', + logo: 'https://glama.ai/favicon.ico' + }, + { + name: 'pulsemcp.com', + url: 'https://www.pulsemcp.com', + logo: 'https://www.pulsemcp.com/favicon.svg' + }, + { + name: 'mcp.composio.dev', + url: 'https://mcp.composio.dev/', + logo: 'https://composio.dev/wp-content/uploads/2025/02/Fevicon-composio.png' + } +] + export const McpSettingsNavbar = () => { const { t } = useTranslation() const navigate = useNavigate() - const onClick = () => window.open('https://mcp.so/', '_blank') + + const resourceMenuItems: MenuProps['items'] = mcpResources.map(({ name, url, logo }) => ({ + key: name, + label: ( +