diff --git a/ui/litellm-dashboard/eslint-suppressions.json b/ui/litellm-dashboard/eslint-suppressions.json
index 7dac21708e9..e467ddc5ec4 100644
--- a/ui/litellm-dashboard/eslint-suppressions.json
+++ b/ui/litellm-dashboard/eslint-suppressions.json
@@ -161,9 +161,6 @@
     "local/filename-pascal-case": {
       "count": 1
     },
-    "no-restricted-imports": {
-      "count": 2
-    },
     "react-hooks/set-state-in-effect": {
       "count": 1
     }
@@ -959,7 +956,7 @@
   },
   "src/app/(dashboard)/playground/components/compareUI/components/ModelSelector.tsx": {
     "no-restricted-imports": {
-      "count": 2
+      "count": 1
     }
   },
   "src/app/(dashboard)/playground/components/complianceUI/ComplianceUI.tsx": {
diff --git a/ui/litellm-dashboard/src/app/(dashboard)/caching/_components/cache_settings/index.integration.test.tsx b/ui/litellm-dashboard/src/app/(dashboard)/caching/_components/cache_settings/index.integration.test.tsx
index bcbc3acc7d8..8029dff0c9e 100644
--- a/ui/litellm-dashboard/src/app/(dashboard)/caching/_components/cache_settings/index.integration.test.tsx
+++ b/ui/litellm-dashboard/src/app/(dashboard)/caching/_components/cache_settings/index.integration.test.tsx
@@ -63,6 +63,19 @@ describe("CacheSettings advanced settings round-trip", () => {
     });
   });
 
+  it("reveals the advanced field sections only after the user expands them", async () => {
+    const user = userEvent.setup();
+    renderSettings();
+    await screen.findByText("Connection Settings");
+    expect(screen.queryByText("SSL Settings")).not.toBeInTheDocument();
+
+    await user.click(screen.getByRole("button", { name: "Advanced Settings" }));
+
+    expect(await screen.findByText("SSL Settings")).toBeInTheDocument();
+    expect(screen.getByText("Cache Management")).toBeInTheDocument();
+    expect(screen.getByText("GCP Authentication")).toBeInTheDocument();
+  });
+
   it("sends the same payload whether or not the advanced section was expanded", async () => {
     const user = userEvent.setup();
     renderSettings();
diff --git a/ui/litellm-dashboard/src/app/(dashboard)/caching/_components/cache_settings/index.tsx b/ui/litellm-dashboard/src/app/(dashboard)/caching/_components/cache_settings/index.tsx
index 76ec1b2c4cc..d26cc1b40f8 100644
--- a/ui/litellm-dashboard/src/app/(dashboard)/caching/_components/cache_settings/index.tsx
+++ b/ui/litellm-dashboard/src/app/(dashboard)/caching/_components/cache_settings/index.tsx
@@ -1,7 +1,7 @@
 import React, { useState, useEffect, useCallback } from "react";
 import { ChevronRight } from "lucide-react";
 import { FormProvider, useForm } from "react-hook-form";
-import { Button } from "@tremor/react";
+import { Button } from "@/components/ui/button";
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@/components/ui/collapsible";
 import { getCacheSettingsCall, testCacheConnectionCall, updateCacheSettingsCall } from "@/components/networking";
 import { fetchAvailableModels, ModelGroup } from "@/components/llm_calls/fetch_models";
diff --git a/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/add_margin_form.test.tsx b/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/add_margin_form.test.tsx
index dc2e79d3199..69115346451 100644
--- a/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/add_margin_form.test.tsx
+++ b/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/add_margin_form.test.tsx
@@ -95,6 +95,33 @@ describe("AddMarginForm", () => {
     expect(onAddProvider).toHaveBeenCalledTimes(1);
   });
 
+  it("should report the edited percentage as the user types", async () => {
+    const onPercentageChange = vi.fn();
+    const user = userEvent.setup();
+    renderWithProviders(
+      <AddMarginForm {...DEFAULT_PROPS} percentageValue="1" onPercentageChange={onPercentageChange} />,
+    );
+
+    await user.type(screen.getByPlaceholderText("10"), "0");
+    expect(onPercentageChange).toHaveBeenCalledWith("10");
+  });
+
+  it("should report the edited fixed amount as the user types", async () => {
+    const onFixedAmountChange = vi.fn();
+    const user = userEvent.setup();
+    renderWithProviders(
+      <AddMarginForm
+        {...DEFAULT_PROPS}
+        marginType="fixed"
+        fixedAmountValue="0.00"
+        onFixedAmountChange={onFixedAmountChange}
+      />,
+    );
+
+    await user.type(screen.getByPlaceholderText("0.001"), "1");
+    expect(onFixedAmountChange).toHaveBeenCalledWith("0.001");
+  });
+
   it("should call onMarginTypeChange when the Fixed Amount radio is clicked", async () => {
     const onMarginTypeChange = vi.fn();
     const user = userEvent.setup();
diff --git a/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/add_margin_form.tsx b/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/add_margin_form.tsx
index 7fc1559d683..c307c176122 100644
--- a/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/add_margin_form.tsx
+++ b/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/add_margin_form.tsx
@@ -172,7 +172,7 @@ const AddMarginForm: React.FC<AddMarginFormProps> = ({
 
         <div className="flex items-center justify-end space-x-3 pt-6 border-t border-border">
           <Button
-            type="button"
+            type="submit"
             onClick={onAddProvider}
             disabled={
               !selectedProvider ||
diff --git a/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/add_provider_form.test.tsx b/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/add_provider_form.test.tsx
index 084233b3670..94213f923c9 100644
--- a/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/add_provider_form.test.tsx
+++ b/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/add_provider_form.test.tsx
@@ -62,6 +62,15 @@ describe("AddProviderForm", () => {
     expect(onAddProvider).toHaveBeenCalledTimes(1);
   });
 
+  it("should report the edited discount as the user types", async () => {
+    const onDiscountChange = vi.fn();
+    const user = userEvent.setup();
+    renderWithProviders(<AddProviderForm {...DEFAULT_PROPS} newDiscount="1" onDiscountChange={onDiscountChange} />);
+
+    await user.type(screen.getByPlaceholderText("5"), "5");
+    expect(onDiscountChange).toHaveBeenCalledWith("15");
+  });
+
   it("should show the percent sign next to the discount input", () => {
     renderWithProviders(<AddProviderForm {...DEFAULT_PROPS} />);
     expect(screen.getByText("%")).toBeInTheDocument();
diff --git a/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/cost_tracking_settings.integration.test.tsx b/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/cost_tracking_settings.integration.test.tsx
index b32eeff975e..ddcd4cf2993 100644
--- a/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/cost_tracking_settings.integration.test.tsx
+++ b/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/cost_tracking_settings.integration.test.tsx
@@ -130,7 +130,7 @@ describe("CostTrackingSettings submit paths", () => {
     expect(stableDiscountCallbacks.handleAddProvider).toHaveBeenCalledWith("OpenAI", "5");
   });
 
-  it("leaves Enter inert in the margin field while the button still submits", async () => {
+  it("requests the margin exactly once when Enter is pressed in the percentage field", async () => {
     const user = userEvent.setup();
     renderWithProviders(<CostTrackingSettings {...ADMIN_PROPS} />);
     const header = screen.getByText("Fee/Price Margin").closest("button");
@@ -142,14 +142,7 @@ describe("CostTrackingSettings submit paths", () => {
     await user.click((await screen.findAllByRole("option"))[0]);
     await user.type(screen.getByLabelText(/Margin Percentage/i), "10{Enter}");
 
-    expect(stableMarginCallbacks.handleAddMargin).not.toHaveBeenCalled();
-
-    const submit = screen
-      .getAllByRole("button")
-      .filter((button) => (button.textContent || "").trim() === "Add Provider Margin")
-      .pop()!;
-    await user.click(submit);
-
-    await waitFor(() => expect(stableMarginCallbacks.handleAddMargin).toHaveBeenCalledTimes(1));
+    await waitFor(() => expect(stableMarginCallbacks.handleAddMargin).toHaveBeenCalled());
+    expect(stableMarginCallbacks.handleAddMargin).toHaveBeenCalledTimes(1);
   });
 });
diff --git a/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/cost_tracking_settings.tsx b/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/cost_tracking_settings.tsx
index 32121e90a77..029f8aa424c 100644
--- a/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/cost_tracking_settings.tsx
+++ b/ui/litellm-dashboard/src/app/(dashboard)/cost-tracking/_components/cost_tracking_settings.tsx
@@ -382,7 +382,7 @@ const CostTrackingSettings: React.FC<CostTrackingSettingsProps> = ({ userID, use
             Select a provider (or &quot;Global&quot; for all providers) and configure the margin. You can use
             percentage-based or fixed amount.
           </p>
-          <div className="space-y-6">
+          <form onSubmit={(event) => event.preventDefault()} className="space-y-6">
             <AddMarginForm
               marginConfig={marginConfig}
               selectedProvider={selectedMarginProvider}
@@ -395,7 +395,7 @@ const CostTrackingSettings: React.FC<CostTrackingSettingsProps> = ({ userID, use
               onFixedAmountChange={setFixedAmountValue}
               onAddProvider={handleAddMargin}
             />
-          </div>
+          </form>
         </div>
       </Modal>
     </div>
diff --git a/ui/litellm-dashboard/src/app/(dashboard)/playground/components/compareUI/components/ModelSelector.test.tsx b/ui/litellm-dashboard/src/app/(dashboard)/playground/components/compareUI/components/ModelSelector.test.tsx
index b6965da60fe..9c01521e77a 100644
--- a/ui/litellm-dashboard/src/app/(dashboard)/playground/components/compareUI/components/ModelSelector.test.tsx
+++ b/ui/litellm-dashboard/src/app/(dashboard)/playground/components/compareUI/components/ModelSelector.test.tsx
@@ -1,4 +1,4 @@
-import { render, screen } from "@testing-library/react";
+import { fireEvent, render, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { describe, expect, it, vi } from "vitest";
 import { ModelSelector } from "./ModelSelector";
@@ -28,6 +28,18 @@ describe("ModelSelector", () => {
     expect(screen.getByTitle("custom-model-123")).toHaveTextContent("custom-model-123");
   });
 
+  it("reports a custom model typed into the custom name field", async () => {
+    const user = userEvent.setup();
+    const onChange = vi.fn();
+    render(<ModelSelector value="" onChange={onChange} models={MODELS} />);
+
+    await user.click(screen.getByRole("combobox"));
+    fireEvent.click(await screen.findByTitle("+ Add custom model"));
+    await user.type(await screen.findByPlaceholderText("Custom Model Name (Enter to add)"), "my-custom-model{Enter}");
+
+    expect(onChange).toHaveBeenCalledWith("my-custom-model");
+  });
+
   it("disables the control when disabled is set", () => {
     const { rerender } = render(<ModelSelector value="custom-model-123" onChange={vi.fn()} models={MODELS} />);
     expect(screen.getByRole("combobox")).toBeEnabled();
diff --git a/ui/litellm-dashboard/src/app/(dashboard)/playground/components/compareUI/components/ModelSelector.tsx b/ui/litellm-dashboard/src/app/(dashboard)/playground/components/compareUI/components/ModelSelector.tsx
index ff7fe18ade2..c88560ab4f5 100644
--- a/ui/litellm-dashboard/src/app/(dashboard)/playground/components/compareUI/components/ModelSelector.tsx
+++ b/ui/litellm-dashboard/src/app/(dashboard)/playground/components/compareUI/components/ModelSelector.tsx
@@ -1,6 +1,6 @@
 import React, { useMemo, useState } from "react";
 import { Select } from "antd";
-import { TextInput } from "@tremor/react";
+import { Input } from "@/components/ui/input";
 interface ModelSelectorProps {
   value: string;
   onChange: (value: string) => void;
@@ -68,11 +68,11 @@ export function ModelSelector({ value, onChange, models, loading, disabled }: Mo
         <Select.Option value="__custom__">+ Add custom model</Select.Option>
       </Select>
       {isAddingCustom && (
-        <TextInput
+        <Input
           className="mt-2"
           placeholder="Custom Model Name (Enter to add)"
           value={customValue}
-          onValueChange={setCustomValue}
+          onChange={(e) => setCustomValue(e.target.value)}
           onKeyDown={(event) => {
             if (event.key === "Enter") {
               event.preventDefault();