From 3a73e82f649336fbb0c1717da6790ad4e119388b Mon Sep 17 00:00:00 2001
From: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Date: Sat, 29 Aug 2026 22:38:50 +0000
Subject: [PATCH] fix(ui): bound the key settings card so the edit form scrolls
 like the team form

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
---
 .../src/components/templates/key_info_view.test.tsx        | 7 +++++++
 .../src/components/templates/key_info_view.tsx             | 2 +-
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/ui/litellm-dashboard/src/components/templates/key_info_view.test.tsx b/ui/litellm-dashboard/src/components/templates/key_info_view.test.tsx
index 7817d4e7cea..2181079e9ce 100644
--- a/ui/litellm-dashboard/src/components/templates/key_info_view.test.tsx
+++ b/ui/litellm-dashboard/src/components/templates/key_info_view.test.tsx
@@ -638,6 +638,13 @@ describe("KeyInfoView", () => {
       await userEvent.click(screen.getByRole("tab", { name: /settings/i }));
     };
 
+    it("should render the settings panel as a bounded scroll container", async () => {
+      await renderAndOpenSettingsTab();
+
+      const settingsCard = screen.getByRole("heading", { name: /key settings/i }).closest("[data-slot='card']");
+      expect(settingsCard).toHaveClass("overflow-y-auto", "max-h-[65vh]");
+    });
+
     it("should show the Edit Settings button when the user is a proxy admin for a key they do not own", async () => {
       vi.mocked(useAuthorized).mockReturnValue({
         ...baseUseAuthorizedMock,
diff --git a/ui/litellm-dashboard/src/components/templates/key_info_view.tsx b/ui/litellm-dashboard/src/components/templates/key_info_view.tsx
index 0be80c3e173..4a571f0ca5d 100644
--- a/ui/litellm-dashboard/src/components/templates/key_info_view.tsx
+++ b/ui/litellm-dashboard/src/components/templates/key_info_view.tsx
@@ -766,7 +766,7 @@ export default function KeyInfoView({
 
           {/* Settings Panel */}
           <TabsContent value="settings" keepMounted>
-            <Card className="block p-6">
+            <Card className="block p-6 overflow-y-auto max-h-[65vh]">
               <div className="flex justify-between items-center mb-4">
                 <h3 className="text-lg font-medium">Key Settings</h3>
                 {!isEditing && canModifyKey && (