diff --git a/ui/litellm-dashboard/src/components/key_team_helpers/BudgetFallbacksEditor.test.tsx b/ui/litellm-dashboard/src/components/key_team_helpers/BudgetFallbacksEditor.test.tsx index 194f717a92f..1b5603045e0 100644 --- a/ui/litellm-dashboard/src/components/key_team_helpers/BudgetFallbacksEditor.test.tsx +++ b/ui/litellm-dashboard/src/components/key_team_helpers/BudgetFallbacksEditor.test.tsx @@ -68,6 +68,23 @@ describe("BudgetFallbacksEditor", () => { expect(labels.length).toBe(2); }); + it("resets internal state when remounted with empty value via key prop", () => { + const onChange = vi.fn(); + const { rerender } = render( + , + ); + expect(screen.getAllByText("Primary Model").length).toBe(1); + + rerender(); + expect(screen.queryByText("Primary Model")).toBeNull(); + expect(screen.getByText("Add Budget Fallback")).toBeTruthy(); + }); + it("shows ordering hint when multiple fallback models are configured", () => { const onChange = vi.fn(); render( 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 443cbd34e32..479673d6057 100644 --- a/ui/litellm-dashboard/src/components/organisms/create_key_button.tsx +++ b/ui/litellm-dashboard/src/components/organisms/create_key_button.tsx @@ -204,6 +204,7 @@ const CreateKey: React.FC = ({ team, teams, data, addKey, autoOp const [routerSettings, setRouterSettings] = useState(null); const [budgetLimits, setBudgetLimits] = useState([]); const [budgetFallbacks, setBudgetFallbacks] = useState>({}); + const [budgetFallbacksKey, setBudgetFallbacksKey] = useState(0); const [routerSettingsKey, setRouterSettingsKey] = useState(0); const [agentsList, setAgentsList] = useState<{ agent_id: string; agent_name: string }[]>([]); const [selectedAgentId, setSelectedAgentId] = useState(null); @@ -223,6 +224,7 @@ const CreateKey: React.FC = ({ team, teams, data, addKey, autoOp setSelectedProjectId(null); setBudgetLimits([]); setBudgetFallbacks({}); + setBudgetFallbacksKey((k) => k + 1); }; const handleCancel = () => { @@ -243,6 +245,7 @@ const CreateKey: React.FC = ({ team, teams, data, addKey, autoOp setSelectedProjectId(null); setBudgetLimits([]); setBudgetFallbacks({}); + setBudgetFallbacksKey((k) => k + 1); }; useEffect(() => { @@ -567,6 +570,7 @@ const CreateKey: React.FC = ({ team, teams, data, addKey, autoOp form.resetFields(); setBudgetLimits([]); setBudgetFallbacks({}); + setBudgetFallbacksKey((k) => k + 1); localStorage.removeItem("userData" + userID); } catch (error) { console.log("error in create key:", error); @@ -1097,6 +1101,7 @@ const CreateKey: React.FC = ({ team, teams, data, addKey, autoOp } > 0) { + values.budget_fallbacks = budgetFallbacks; + } await onSubmit(values); } finally {