From f1191578aeca66f9a06aa21d342ab26ec365ff85 Mon Sep 17 00:00:00 2001
From: yuneng-jiang <yuneng.jiang@gmail.com>
Date: Wed, 5 Nov 2025 16:03:01 -0800
Subject: [PATCH] [Fix] UI - Fixed Label for vLLM in Model Create Flow (#16285)

* Fixed Label for vLLM

* Make vLLM api key not required
---
 .../provider_specific_fields.test.tsx          | 18 ++++++++++++++++++
 .../add_model/provider_specific_fields.tsx     |  6 +++---
 .../src/components/chat_ui/CodeSnippets.tsx    |  2 +-
 3 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/add_model/provider_specific_fields.test.tsx b/ui/litellm-dashboard/src/components/add_model/provider_specific_fields.test.tsx
index 4475cd4ca3f..26df1711ee6 100644
--- a/ui/litellm-dashboard/src/components/add_model/provider_specific_fields.test.tsx
+++ b/ui/litellm-dashboard/src/components/add_model/provider_specific_fields.test.tsx
@@ -44,4 +44,22 @@ describe("ProviderSpecificFields", () => {
       expect(apiKeyLabel).toBeInTheDocument();
     });
   });
+
+  it("should render the provider specific fields for vLLM", async () => {
+    const { getByLabelText, getByPlaceholderText } = render(
+      <Form>
+        <ProviderSpecificFields selectedProvider={"Hosted_Vllm" as Providers} />
+      </Form>,
+    );
+
+    await waitFor(() => {
+      const apiBaseInput = getByPlaceholderText("https://...");
+      expect(apiBaseInput).toBeInTheDocument();
+      expect(apiBaseInput).toHaveAttribute("type", "text");
+
+      // Check for API Key field
+      const apiKeyLabel = getByLabelText("vLLM API Key");
+      expect(apiKeyLabel).toBeInTheDocument();
+    });
+  });
 });
diff --git a/ui/litellm-dashboard/src/components/add_model/provider_specific_fields.tsx b/ui/litellm-dashboard/src/components/add_model/provider_specific_fields.tsx
index c7686fb0b0c..61500dd8978 100644
--- a/ui/litellm-dashboard/src/components/add_model/provider_specific_fields.tsx
+++ b/ui/litellm-dashboard/src/components/add_model/provider_specific_fields.tsx
@@ -507,9 +507,9 @@ const PROVIDER_CREDENTIAL_FIELDS: Record<Providers, ProviderCredentialField[]> =
     },
     {
       key: "api_key",
-      label: "OpenAI API Key",
+      label: "vLLM API Key",
       type: "password",
-      required: true,
+      required: false,
     },
   ],
   [Providers.Voyage]: [
@@ -581,7 +581,7 @@ const PROVIDER_CREDENTIAL_FIELDS: Record<Providers, ProviderCredentialField[]> =
       label: "API Key",
       type: "password",
       required: true,
-    }
+    },
   ],
 };
 
diff --git a/ui/litellm-dashboard/src/components/chat_ui/CodeSnippets.tsx b/ui/litellm-dashboard/src/components/chat_ui/CodeSnippets.tsx
index 91e372841f4..f9d5c84fade 100644
--- a/ui/litellm-dashboard/src/components/chat_ui/CodeSnippets.tsx
+++ b/ui/litellm-dashboard/src/components/chat_ui/CodeSnippets.tsx
@@ -17,7 +17,7 @@ interface GenerateCodeParams {
   selectedVectorStores: string[];
   selectedGuardrails: string[];
   selectedMCPTools: string[];
-  selectedVoice: string;
+  selectedVoice?: string;
   endpointType: string;
   selectedModel: string | undefined;
   selectedSdk: "openai" | "azure";