From bcfa665e822d4d1d62553979597dbdf29ff5ee47 Mon Sep 17 00:00:00 2001
From: Ryan Crabbe <rcrabbe@berkeley.edu>
Date: Sat, 21 Mar 2026 12:39:34 -0700
Subject: [PATCH] fix(ui): stale closure in executeSave, type mismatch, modal
 dismiss during save

- Use functional state updater in executeSave to avoid stale settings closure
- Widen handleTextInputChange key param to string (schema keys are dynamic)
- Block Esc/backdrop dismiss on confirmation modal during confirmLoading
---
 ui/litellm-dashboard/src/components/DefaultUserSettings.tsx   | 4 ++--
 .../common_components/ConfirmSettingsChangeModal.tsx          | 4 +++-
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/ui/litellm-dashboard/src/components/DefaultUserSettings.tsx b/ui/litellm-dashboard/src/components/DefaultUserSettings.tsx
index 0e07eae174a..bab56fc1095 100644
--- a/ui/litellm-dashboard/src/components/DefaultUserSettings.tsx
+++ b/ui/litellm-dashboard/src/components/DefaultUserSettings.tsx
@@ -174,7 +174,7 @@ const DefaultUserSettings: React.FC<DefaultUserSettingsProps> = ({
     setSaving(true);
     try {
       const updatedSettings = await updateInternalUserSettings(accessToken, processedValues);
-      setSettings({ ...settings, values: updatedSettings.settings });
+      setSettings((prev) => prev ? { ...prev, values: updatedSettings.settings } : null);
       setIsEditing(false);
       return true;
     } catch (error) {
@@ -222,7 +222,7 @@ const DefaultUserSettings: React.FC<DefaultUserSettingsProps> = ({
     }
   };
 
-  const handleTextInputChange = (key: keyof DefaultUserSettingsValues, value: DefaultUserSettingsValues[typeof key]) => {
+  const handleTextInputChange = (key: string, value: any) => {
     setEditedValues((prev) => ({ ...prev, [key]: value }));
   };
 
diff --git a/ui/litellm-dashboard/src/components/common_components/ConfirmSettingsChangeModal.tsx b/ui/litellm-dashboard/src/components/common_components/ConfirmSettingsChangeModal.tsx
index 3fd73126161..82e0f3f9c2e 100644
--- a/ui/litellm-dashboard/src/components/common_components/ConfirmSettingsChangeModal.tsx
+++ b/ui/litellm-dashboard/src/components/common_components/ConfirmSettingsChangeModal.tsx
@@ -55,12 +55,14 @@ export default function ConfirmSettingsChangeModal({
       title="Review Changes"
       open={isOpen}
       onOk={onConfirm}
-      onCancel={onCancel}
+      onCancel={() => { if (!confirmLoading) onCancel(); }}
       confirmLoading={confirmLoading}
       okText={confirmLoading ? "Saving..." : "Confirm Changes"}
       cancelText="Cancel"
       okButtonProps={{ disabled: confirmLoading }}
       cancelButtonProps={{ disabled: confirmLoading }}
+      keyboard={!confirmLoading}
+      maskClosable={!confirmLoading}
     >
       <div className="space-y-4">
         <div className="space-y-2">