diff --git a/ui/litellm-dashboard/src/components/organisms/create_key_button.test.tsx b/ui/litellm-dashboard/src/components/organisms/create_key_button.test.tsx index d08d0f3af13..46dca6039a7 100644 --- a/ui/litellm-dashboard/src/components/organisms/create_key_button.test.tsx +++ b/ui/litellm-dashboard/src/components/organisms/create_key_button.test.tsx @@ -72,6 +72,37 @@ describe("CreateKey", () => { expect(screen.getByRole("button", { name: /create new key/i })).toBeInTheDocument(); }); + it("should display 'AI APIs' label for the llm_api key type option", async () => { + renderWithProviders(); + + act(() => { + fireEvent.click(screen.getByRole("button", { name: /create new key/i })); + }); + + await waitFor(() => { + expect(screen.getByText("Key Type")).toBeInTheDocument(); + }); + + // Open the Key Type dropdown + const keyTypeSection = screen.getByText("Key Type").closest(".ant-form-item")!; + const selectElement = keyTypeSection.querySelector(".ant-select-selector")!; + act(() => { + fireEvent.mouseDown(selectElement); + }); + + await waitFor(() => { + // Verify "AI APIs" appears as an option + const options = document.querySelectorAll(".ant-select-item-option"); + const optionTexts = Array.from(options).map((el) => el.textContent); + const hasAIAPIs = optionTexts.some((text) => text?.includes("AI APIs")); + expect(hasAIAPIs).toBe(true); + + // Verify old "LLM API" label does NOT appear + const hasLLMAPI = optionTexts.some((text) => text?.includes("LLM API")); + expect(hasLLMAPI).toBe(false); + }); + }); + it("should include access_group_ids in keyCreateCall payload when access groups are selected", async () => { renderWithProviders(); diff --git a/ui/litellm-dashboard/src/components/organisms/create_key_button.tsx b/ui/litellm-dashboard/src/components/organisms/create_key_button.tsx index 7937ebef666..9a99870c263 100644 --- a/ui/litellm-dashboard/src/components/organisms/create_key_button.tsx +++ b/ui/litellm-dashboard/src/components/organisms/create_key_button.tsx @@ -728,15 +728,15 @@ const CreateKey: React.FC = ({ team, teams, data, addKey }) => {
Default
- Can call LLM API + Management routes + Can call AI APIs + Management routes
- diff --git a/ui/litellm-dashboard/src/components/templates/key_edit_view.test.tsx b/ui/litellm-dashboard/src/components/templates/key_edit_view.test.tsx index bbe3c206cee..49a98b699e8 100644 --- a/ui/litellm-dashboard/src/components/templates/key_edit_view.test.tsx +++ b/ui/litellm-dashboard/src/components/templates/key_edit_view.test.tsx @@ -494,7 +494,50 @@ describe("KeyEditView", () => { }); }); - it("should disable cancel button during submission", async () => { + it("should display 'AI APIs' label for the llm_api key type option", async () => { + const keyDataWithLlmApiRoutes = { + ...MOCK_KEY_DATA, + allowed_routes: ["llm_api_routes"], + }; + + renderWithProviders( + {}} + onSubmit={async () => {}} + accessToken={""} + userID={""} + userRole={""} + premiumUser={false} + />, + ); + + await waitFor(() => { + expect(screen.getByText("Key Type")).toBeInTheDocument(); + }); + + // The selected key type label should show "AI APIs" (not "LLM API") + const keyTypeSection = screen.getByText("Key Type").closest(".ant-form-item")!; + expect(keyTypeSection).toBeInTheDocument(); + + // Open the dropdown to see all options + const selectElement = keyTypeSection.querySelector(".ant-select-selector")!; + await userEvent.click(selectElement); + + await waitFor(() => { + // Verify "AI APIs" appears as an option label + const options = document.querySelectorAll(".ant-select-item-option"); + const optionTexts = Array.from(options).map((el) => el.textContent); + const hasAIAPIs = optionTexts.some((text) => text?.includes("AI APIs")); + expect(hasAIAPIs).toBe(true); + + // Verify old "LLM API" label does NOT appear + const hasLLMAPI = optionTexts.some((text) => text?.includes("LLM API")); + expect(hasLLMAPI).toBe(false); + }); + }); + + it("should display cancel button during submission", async () => { let resolveSubmit: (() => void) | undefined; const submitPromise = new Promise((resolve) => { resolveSubmit = resolve; diff --git a/ui/litellm-dashboard/src/components/templates/key_edit_view.tsx b/ui/litellm-dashboard/src/components/templates/key_edit_view.tsx index 1ba3cc7f7b4..71e00e16542 100644 --- a/ui/litellm-dashboard/src/components/templates/key_edit_view.tsx +++ b/ui/litellm-dashboard/src/components/templates/key_edit_view.tsx @@ -345,15 +345,15 @@ export function KeyEditView({
Default
- Can call LLM API + Management routes + Can call AI APIs + Management routes
- +
-
LLM API
+
AI APIs
- Can call only LLM API routes (chat/completions, embeddings, etc.) + Can call only AI API routes (chat/completions, embeddings, etc.)