From b5956e0595ee7a1eafeec61ce6139e74b7ee9fa8 Mon Sep 17 00:00:00 2001
From: yuneng-jiang <yuneng.jiang@gmail.com>
Date: Thu, 6 Nov 2025 09:52:39 -0800
Subject: [PATCH] Add Azure AD Token field to Add Model Azure and make API Key
 not required (#16331)

---
 .../provider_specific_fields.test.tsx         | 35 +++++++++++++++++++
 .../add_model/provider_specific_fields.tsx    | 10 +++++-
 .../src/components/admins.tsx                 |  7 +---
 3 files changed, 45 insertions(+), 7 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 26df1711ee6..454caf9e601 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
@@ -62,4 +62,39 @@ describe("ProviderSpecificFields", () => {
       expect(apiKeyLabel).toBeInTheDocument();
     });
   });
+
+  it("should render the provider specific fields for Azure", async () => {
+    const { getByLabelText, getByPlaceholderText } = render(
+      <Form>
+        <ProviderSpecificFields selectedProvider={Providers.Azure} />
+      </Form>,
+    );
+
+    await waitFor(() => {
+      // Check for API Base field
+      const apiBaseInput = getByPlaceholderText("https://...");
+      expect(apiBaseInput).toBeInTheDocument();
+      expect(apiBaseInput).toHaveAttribute("type", "text");
+
+      // Check for API Version field
+      const apiVersionInput = getByPlaceholderText("2023-07-01-preview");
+      expect(apiVersionInput).toBeInTheDocument();
+
+      // Check for Base Model field
+      const baseModelInput = getByPlaceholderText("azure/gpt-3.5-turbo");
+      expect(baseModelInput).toBeInTheDocument();
+
+      // Check for API Key field
+      const apiKeyInput = getByLabelText("Azure API Key");
+      expect(apiKeyInput).toBeInTheDocument();
+      expect(apiKeyInput).toHaveAttribute("type", "password");
+      expect(apiKeyInput).toHaveAttribute("placeholder", "Enter your Azure API Key");
+
+      // Check for Azure AD Token field
+      const azureAdTokenInput = getByLabelText("Azure AD Token");
+      expect(azureAdTokenInput).toBeInTheDocument();
+      expect(azureAdTokenInput).toHaveAttribute("type", "password");
+      expect(azureAdTokenInput).toHaveAttribute("placeholder", "Enter your Azure AD Token");
+    });
+  });
 });
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 61500dd8978..2f294611408 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
@@ -164,7 +164,15 @@ const PROVIDER_CREDENTIAL_FIELDS: Record<Providers, ProviderCredentialField[]> =
       key: "api_key",
       label: "Azure API Key",
       type: "password",
-      required: true,
+      placeholder: "Enter your Azure API Key",
+      required: false,
+    },
+    {
+      key: "azure_ad_token",
+      label: "Azure AD Token",
+      type: "password",
+      placeholder: "Enter your Azure AD Token",
+      required: false,
     },
   ],
   [Providers.Azure_AI_Studio]: [
diff --git a/ui/litellm-dashboard/src/components/admins.tsx b/ui/litellm-dashboard/src/components/admins.tsx
index 84d3d791ec8..67c9cd26e1d 100644
--- a/ui/litellm-dashboard/src/components/admins.tsx
+++ b/ui/litellm-dashboard/src/components/admins.tsx
@@ -512,12 +512,7 @@ const AdminPanel: React.FC<AdminPanelProps> = ({
                 }}
               >
                 <div>
-                  <Button
-                    style={{ width: "150px" }}
-                    onClick={() =>
-                      setIsAddSSOModalVisible(true)
-                    }
-                  >
+                  <Button style={{ width: "150px" }} onClick={() => setIsAddSSOModalVisible(true)}>
                     {ssoConfigured ? "Edit SSO Settings" : "Add SSO"}
                   </Button>
                 </div>