diff --git a/src/renderer/src/pages/settings/MCPSettings/NpxSearch.tsx b/src/renderer/src/pages/settings/MCPSettings/NpxSearch.tsx index c751ebc8..4eb8895b 100644 --- a/src/renderer/src/pages/settings/MCPSettings/NpxSearch.tsx +++ b/src/renderer/src/pages/settings/MCPSettings/NpxSearch.tsx @@ -1,9 +1,9 @@ import { SearchOutlined } from '@ant-design/icons' import { useTheme } from '@renderer/context/ThemeProvider' -import { MCPServer } from '@renderer/types' +import type { MCPServer } from '@renderer/types' import { Button, Input, Space, Spin, Table, Typography } from 'antd' import { npxFinder } from 'npx-scope-finder' -import { FC, useState } from 'react' +import { type FC, useState } from 'react' import { useTranslation } from 'react-i18next' import { SettingDivider, SettingGroup, SettingTitle } from '..' @@ -21,7 +21,7 @@ interface SearchResult { const NpxSearch: FC = () => { const { theme } = useTheme() const { t } = useTranslation() - const { Paragraph, Text } = Typography + const { Paragraph, Text, Link } = Typography // Add new state variables for npm scope search const [npmScope, setNpmScope] = useState('@modelcontextprotocol') @@ -59,8 +59,12 @@ const NpxSearch: FC = () => { if (formattedResults.length === 0) { window.message.info(t('settings.mcp.npx_list.no_packages')) } - } catch (error: any) { - window.message.error(`${t('settings.mcp.npx_list.search_error')}: ${error.message}`) + } catch (error: unknown) { + if (error instanceof Error) { + window.message.error(`${t('settings.mcp.npx_list.search_error')}: ${error.message}`) + } else { + window.message.error(t('settings.mcp.npx_list.search_error')) + } } finally { setSearchLoading(false) } @@ -92,7 +96,7 @@ const NpxSearch: FC = () => { ) : searchResults.length > 0 ? ( - + { { title: t('settings.mcp.npx_list.description'), key: 'description', + ellipsis: true, render: (_, record: SearchResult) => ( - - {record.description} - + + {record.description} + {t('settings.mcp.npx_list.usage')}: {record.usage} - - {record.npmLink} - + + + {record.npmLink} + + ) }, @@ -125,7 +132,7 @@ const NpxSearch: FC = () => { { title: t('settings.mcp.npx_list.actions'), key: 'actions', - width: '100px', + width: '120px', render: (_, record: SearchResult) => (