fix(mcp): let non-creator users OAuth into OBO-mode MCP servers from the Tools page

ui/litellm-dashboard/src/components/mcp_tools/mcp_server_view.tsx

@@ -21,6 +21,7 @@
   userRole: string | null;
   userID: string | null;
   availableAccessGroups: string[];
+  initialTabIndex?: number;
 }
 
 export const MCPServerView: React.FC<MCPServerViewProps> = ({
@@ -32,11 +33,12 @@
   userRole,
   userID,
   availableAccessGroups,
+  initialTabIndex = 0,
 }) => {
   const [editing, setEditing] = useState(isEditing);
   const [showFullUrl, setShowFullUrl] = useState(false);
   const [copiedStates, setCopiedStates] = useState<Record<string, boolean>>({});
-  const [selectedTabIndex, setSelectedTabIndex] = useState(0);
+  const [selectedTabIndex, setSelectedTabIndex] = useState(initialTabIndex);
 
   const handleSuccess = (updated: MCPServer) => {
     setEditing(false);
@@ -342,7 +344,7 @@
                     <div className="col-span-2">
                       {mcpServer.mcp_access_groups && mcpServer.mcp_access_groups.length > 0 ? (
                         <div className="flex flex-wrap gap-1.5">
                           {mcpServer.mcp_access_groups.map((group: any, index: number) => (
                             <span
                               key={index}
                               className="inline-flex items-center text-xs font-medium px-2 py-0.5 rounded bg-gray-100 text-gray-700 border border-gray-200"

ui/litellm-dashboard/src/components/mcp_tools/mcp_servers.tsx

@@ -21,6 +21,7 @@
 import MCPDiscovery from "./mcp_discovery";
 import { ByokCredentialModal } from "./ByokCredentialModal";
 import { getSecureItem } from "@/utils/secureStorage";
+import { TOOLS_OAUTH_UI_STATE_KEY } from "@/hooks/mcpOAuthUtils";
 import UserEnvVarsModal from "./UserEnvVarsModal";
 import { listMCPUserEnvVarStatus } from "../networking";
 
@@ -71,9 +72,26 @@
 const { Text: AntdText, Title: AntdTitle } = Typography;
 const EDIT_OAUTH_UI_STATE_KEY = "litellm-mcp-oauth-edit-state";
 
+// Server id stashed by the Tools tab before an OBO OAuth redirect, read once at
+// mount so the redirect returns straight to that server's Tools tab.
+const readToolsOAuthServerId = (): string | null => {
+  if (typeof window === "undefined") {
+    return null;
+  }
+  try {
+    const stored = getSecureItem(TOOLS_OAUTH_UI_STATE_KEY);
+    if (!stored) {
+      return null;
+    }
+    return JSON.parse(stored)?.serverId ?? null;
+  } catch {
+    return null;
+  }
+};
+
 const { Option } = Select;
 
 const MCPServers: React.FC<MCPServerProps> = ({ accessToken, userRole, userID }) => {
   const { data: mcpServers, isLoading: isLoadingServers, refetch } = useMCPServers();
 
   // Fetch health status for all servers
@@ -103,7 +121,12 @@
   // state
   const [serverIdToDelete, setServerToDelete] = useState<string | null>(null);
   const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
-  const [selectedServerId, setSelectedServerId] = useState<string | null>(null);
+  // Server whose Tools tab should be reopened after an OBO OAuth redirect; read
+  // once from sessionStorage so the restored server selection is correct on the
+  // first render. Cleared when the user navigates back to the list (handleBack)
+  // so a later visit to the same server defaults to Overview, not the Tools tab.
+  const [toolsTabServerId, setToolsTabServerId] = useState<string | null>(readToolsOAuthServerId);
+  const [selectedServerId, setSelectedServerId] = useState<string | null>(toolsTabServerId);
   const [editServer, setEditServer] = useState(false);
   const [selectedTeam, setSelectedTeam] = useState<string>("all");
   const [selectedMcpAccessGroup, setSelectedMcpAccessGroup] = useState<string>("all");
@@ -178,6 +201,19 @@
     }
   }, []);
 
+  // The restored server id was consumed by the initializer above; remove the
+  // one-shot sessionStorage key so a full page reload doesn't reopen the Tools
+  // tab (removeItem only, no setState).
+  useEffect(() => {
+    if (typeof window !== "undefined") {
+      try {
+        window.sessionStorage.removeItem(TOOLS_OAUTH_UI_STATE_KEY);
+      } catch {
+        // ignore storage errors
+      }
+    }
+  }, []);
+
   // Get unique teams from all servers
   const uniqueTeams = React.useMemo(() => {
     if (!serversWithHealth) return [];
@@ -223,7 +259,7 @@
       }
       if (group !== "all") {
         filtered = filtered.filter((server) =>
           server.mcp_access_groups?.some((g: any) => (typeof g === "string" ? g === group : g && g.name === group)),
         );
       }
       const sorted = [...filtered].sort((a, b) => {
@@ -338,6 +374,8 @@
   const handleBack = React.useCallback(() => {
     setEditServer(false);
     setSelectedServerId(null);
+    // Drop the post-redirect one-shot so re-selecting that server opens Overview.
+    setToolsTabServerId(null);
     refetch();
   }, [refetch]);
 
@@ -483,6 +521,7 @@
                 userID={userID}
                 userRole={userRole}
                 availableAccessGroups={uniqueMcpAccessGroups}
+                initialTabIndex={selectedServerId === toolsTabServerId ? 1 : 0}
               />
             ) : (
               <div className="w-full h-full">

ui/litellm-dashboard/src/components/mcp_tools/mcp_tools.test.tsx

@@ -2,12 +2,13 @@
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { describe, expect, it, vi, beforeEach } from "vitest";
 import MCPToolsViewer from "./mcp_tools";
-import { listMCPTools } from "../networking";
+import { listMCPTools, getMCPOAuthUserCredentialStatus } from "../networking";
 import { isTokenValid, getToken } from "@/utils/mcpTokenStore";
 
 vi.mock("../networking", () => ({
   listMCPTools: vi.fn(),
   callMCPTool: vi.fn(),
+  getMCPOAuthUserCredentialStatus: vi.fn(),
 }));
 
 vi.mock("@/utils/mcpTokenStore", () => ({
@@ -20,6 +21,10 @@
   useToolsOAuthFlow: () => ({ startOAuthFlow: vi.fn(), status: "idle", error: null }),
 }));
 
+vi.mock("@/hooks/useUserMcpOAuthFlow", () => ({
+  useUserMcpOAuthFlow: () => ({ startOAuthFlow: vi.fn(), status: "idle", error: null }),
+}));
+
 const GATE_TEXT = "Authentication required";
 // Realistic interactive servers carry a token endpoint; the old heuristic
 // (`oauth2 && !tokenUrl`) mislabeled exactly these as M2M. Setting it here is
@@ -42,13 +47,22 @@
     </QueryClientProvider>,
   );
 
+const credStatus = (overrides: Record<string, unknown> = {}) => ({
+  server_id: "srv-1",
+  has_credential: true,
+  is_expired: false,
+  ...overrides,
+});
+
 describe("MCPToolsViewer auth gate routing", () => {
   beforeEach(() => {
     vi.mocked(listMCPTools).mockReset().mockResolvedValue({ tools: [], error: null });
     vi.mocked(isTokenValid).mockReset().mockReturnValue(false);
     vi.mocked(getToken)
       .mockReset()
       .mockReturnValue(undefined as any);
+    // Default: the OBO credential exists and is valid, so OBO servers list tools.
+    vi.mocked(getMCPOAuthUserCredentialStatus).mockReset().mockResolvedValue(credStatus());
   });
 
   it("shows the Authorize gate for a passthrough server with a token endpoint and does not list tools", async () => {
@@ -57,11 +71,13 @@
     expect(await screen.findByText(GATE_TEXT)).toBeInTheDocument();
     expect(screen.getByRole("button", { name: "Authorize" })).toBeInTheDocument();
     expect(vi.mocked(listMCPTools)).not.toHaveBeenCalled();
+    // Passthrough must not consult the per-user DB credential.
+    expect(vi.mocked(getMCPOAuthUserCredentialStatus)).not.toHaveBeenCalled();
   });
 
   it("forwards the session token via the x-mcp header for a passthrough server that has one", async () => {
     vi.mocked(isTokenValid).mockReturnValue(true);
     vi.mocked(getToken).mockReturnValue({ access_token: "slack-tok" } as any);
 
     renderViewer({ oauth2_flow: null, delegate_auth_to_upstream: true });
 
@@ -75,7 +91,40 @@
     expect(screen.queryByText(GATE_TEXT)).not.toBeInTheDocument();
   });
 
-  it("does not gate an OBO server with a token endpoint; lists with the LiteLLM key and no x-mcp header", async () => {
+  it("lists tools for an OBO server when the user has a DB credential, with no x-mcp header", async () => {
+    renderViewer({ oauth2_flow: null, delegate_auth_to_upstream: false });
+
+    await waitFor(() => expect(vi.mocked(listMCPTools)).toHaveBeenCalledWith("litellm-key", "srv-1", undefined));
+    expect(screen.queryByText(GATE_TEXT)).not.toBeInTheDocument();
+  });
+
+  it("shows the Authorize gate for an OBO server when the user has no DB credential and does not list tools", async () => {
+    vi.mocked(getMCPOAuthUserCredentialStatus).mockResolvedValue(credStatus({ has_credential: false }));
+
+    renderViewer({ oauth2_flow: null, delegate_auth_to_upstream: false });
+
+    expect(await screen.findByText(GATE_TEXT)).toBeInTheDocument();
+    expect(screen.getByRole("button", { name: "Authorize" })).toBeInTheDocument();
+    expect(vi.mocked(listMCPTools)).not.toHaveBeenCalled();
+  });
+
+  it("shows the Authorize gate for an OBO server when the credential-status check fails", async () => {
+    vi.mocked(getMCPOAuthUserCredentialStatus).mockRejectedValue(new Error("network down"));
+
+    renderViewer({ oauth2_flow: null, delegate_auth_to_upstream: false });
+
+    expect(await screen.findByText(GATE_TEXT)).toBeInTheDocument();
+    expect(screen.getByRole("button", { name: "Authorize" })).toBeInTheDocument();
+    expect(vi.mocked(listMCPTools)).not.toHaveBeenCalled();
+  });
+
+  it("does not gate an OBO server whose stored token is expired; the list call refreshes it server-side", async () => {
+    // has_credential=true with is_expired=true must NOT gate: resolve_valid_user_oauth_token
+    // refreshes from the stored refresh_token on the list call, so the user never reauthorizes.
+    vi.mocked(getMCPOAuthUserCredentialStatus).mockResolvedValue(
+      credStatus({ has_credential: true, is_expired: true }),
+    );
+
     renderViewer({ oauth2_flow: null, delegate_auth_to_upstream: false });
 
     await waitFor(() => expect(vi.mocked(listMCPTools)).toHaveBeenCalledWith("litellm-key", "srv-1", undefined));
@@ -87,5 +136,7 @@
 
     await waitFor(() => expect(vi.mocked(listMCPTools)).toHaveBeenCalledWith("litellm-key", "srv-1", undefined));
     expect(screen.queryByText(GATE_TEXT)).not.toBeInTheDocument();
+    // M2M uses the backend service token, not a per-user DB credential.
+    expect(vi.mocked(getMCPOAuthUserCredentialStatus)).not.toHaveBeenCalled();
   });
 });