diff --git a/ui/litellm-dashboard/src/components/mcp_tools/mcp_server_columns.tsx b/ui/litellm-dashboard/src/components/mcp_tools/mcp_server_columns.tsx index 73bdfc612c2..be3aa4a9143 100644 --- a/ui/litellm-dashboard/src/components/mcp_tools/mcp_server_columns.tsx +++ b/ui/litellm-dashboard/src/components/mcp_tools/mcp_server_columns.tsx @@ -3,6 +3,7 @@ import { MCPServer } from "./types"; import { Icon } from "@tremor/react"; import { PencilAltIcon, TrashIcon } from "@heroicons/react/outline"; import { getMaskedAndFullUrl } from "./utils"; +import { Tooltip } from "antd"; export const mcpServerColumns = ( userRole: string, @@ -64,7 +65,12 @@ export const mcpServerColumns = ( if (Array.isArray(groups) && groups.length > 0) { // If string array if (typeof groups[0] === "string") { - return {groups.join(", ")}; + const joined = groups.join(", "); + return ( + + {joined.length > 30 ? `${joined.slice(0, 30)}...` : joined} + + ); } } return None; diff --git a/ui/litellm-dashboard/src/components/mcp_tools/mcp_servers.tsx b/ui/litellm-dashboard/src/components/mcp_tools/mcp_servers.tsx index 5b89c8fc445..669d97b2306 100644 --- a/ui/litellm-dashboard/src/components/mcp_tools/mcp_servers.tsx +++ b/ui/litellm-dashboard/src/components/mcp_tools/mcp_servers.tsx @@ -4,6 +4,7 @@ import { Modal, message, Select, + Tooltip, } from "antd"; import { TabPanel, @@ -33,6 +34,7 @@ import { isAdminRole } from "@/utils/roles"; import { MCPServerView } from "./mcp_server_view"; import CreateMCPServer from "./create_mcp_server"; import MCPConnect from "./mcp_connect"; +import { QuestionCircleOutlined } from '@ant-design/icons'; const { Option } = Select; @@ -291,7 +293,12 @@ const MCPServers: React.FC = ({ ))} - Access Group: + + Access Group: + + + +