From 0ab13927354eebc1bdc167c1afb702eea93799cc Mon Sep 17 00:00:00 2001
From: Ishaan Jaffer <ishaanjaffer0324@gmail.com>
Date: Fri, 27 Feb 2026 19:59:09 -0800
Subject: [PATCH] ui(mcp): reframe network access as 'Internal network only'
 restriction
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Replace scary 'Available on Public Internet' toggle with 'Internal network only'
opt-in restriction. Toggle OFF (default) = all networks allowed. Toggle ON =
restricted to internal network only. Auth is always required either way.

- MCPPermissionManagement: new label/tooltip/description, invert display via
  getValueProps/getValueFromEvent so underlying available_on_public_internet
  value is unchanged
- mcp_server_view: 'Public' → 'All networks', 'Internal' → 'Internal only' (orange)
- mcp_server_columns: same badge updates
---
 .../components/mcp_tools/MCPPermissionManagement.tsx | 10 ++++++----
 .../src/components/mcp_tools/mcp_server_columns.tsx  |  4 ++--
 .../src/components/mcp_tools/mcp_server_view.tsx     | 12 ++++++------
 3 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/mcp_tools/MCPPermissionManagement.tsx b/ui/litellm-dashboard/src/components/mcp_tools/MCPPermissionManagement.tsx
index 7eda67a8e0a..89aa756cb27 100644
--- a/ui/litellm-dashboard/src/components/mcp_tools/MCPPermissionManagement.tsx
+++ b/ui/litellm-dashboard/src/components/mcp_tools/MCPPermissionManagement.tsx
@@ -90,17 +90,19 @@ const MCPPermissionManagement: React.FC<MCPPermissionManagementProps> = ({
           <div className="flex items-start justify-between gap-4">
             <div>
               <span className="text-sm font-medium text-gray-700 flex items-center">
-                Available on Public Internet
-                <Tooltip title="When enabled, this MCP server is accessible from external/public IPs (e.g., ChatGPT). When disabled, only callers from internal/private networks can access it.">
+                Internal network only
+                <Tooltip title="When on, only requests from within your internal network are accepted. Turn off to allow external clients (other clusters, ChatGPT, etc). API key authentication is always required regardless of this setting.">
                   <InfoCircleOutlined className="ml-2 text-blue-400 hover:text-blue-600 cursor-help" />
                 </Tooltip>
               </span>
-              <p className="text-sm text-gray-600 mt-1">Enable if this server should be reachable from the public internet.</p>
+              <p className="text-sm text-gray-600 mt-1">Turn on to restrict access to callers within your internal network only.</p>
             </div>
             <Form.Item
               name="available_on_public_internet"
               valuePropName="checked"
-              initialValue={mcpServer?.available_on_public_internet ?? true}
+              getValueProps={(value) => ({ checked: !value })}
+              getValueFromEvent={(checked: boolean) => !checked}
+              initialValue={true}
               className="mb-0"
             >
               <Switch />
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 d49949e7e04..c42a8593cf1 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
@@ -157,9 +157,9 @@ export const mcpServerColumns = (
     cell: ({ row }) => {
       const isPublic = row.original.available_on_public_internet;
       return isPublic ? (
-        <span className="px-2 py-0.5 bg-green-50 text-green-700 rounded text-xs font-medium">Public</span>
+        <span className="px-2 py-0.5 bg-green-50 text-green-700 rounded text-xs font-medium">All networks</span>
       ) : (
-        <span className="px-2 py-0.5 bg-gray-100 text-gray-600 rounded text-xs font-medium">Internal</span>
+        <span className="px-2 py-0.5 bg-orange-50 text-orange-700 rounded text-xs font-medium">Internal only</span>
       );
     },
   },
diff --git a/ui/litellm-dashboard/src/components/mcp_tools/mcp_server_view.tsx b/ui/litellm-dashboard/src/components/mcp_tools/mcp_server_view.tsx
index cb7768ab21a..4f8ba4e1307 100644
--- a/ui/litellm-dashboard/src/components/mcp_tools/mcp_server_view.tsx
+++ b/ui/litellm-dashboard/src/components/mcp_tools/mcp_server_view.tsx
@@ -251,20 +251,20 @@ export const MCPServerView: React.FC<MCPServerViewProps> = ({
                     </div>
                   </div>
                   <div>
-                    <Text className="font-medium">Available on Public Internet</Text>
+                    <Text className="font-medium">Network Access</Text>
                     <div className="flex items-center gap-2">
                       {mcpServer.available_on_public_internet ? (
                         <span className="px-2 py-1 bg-green-50 text-green-700 rounded-md text-sm">
-                          Public
+                          All networks
                         </span>
                       ) : (
-                        <span className="px-2 py-1 bg-gray-100 text-gray-600 rounded-md text-sm">
-                          Internal
+                        <span className="px-2 py-1 bg-orange-50 text-orange-700 rounded-md text-sm">
+                          Internal only
                         </span>
                       )}
-                      {mcpServer.available_on_public_internet && (
+                      {!mcpServer.available_on_public_internet && (
                         <Text className="text-xs text-gray-500">
-                          Accessible from external/public IPs
+                          Restricted to internal network
                         </Text>
                       )}
                     </div>