test(ui): cover the flag-off wording on the palette, page visibility and garden search tests

ui/litellm-dashboard/src/app/(dashboard)/guardrails/_components/guardrail_garden.test.tsx

@@ -1,5 +1,5 @@
 import { describe, it, expect, vi, beforeEach } from "vitest";
-import { render, screen, within } from "@testing-library/react";
+import { fireEvent, render, screen, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { TerminologyProvider } from "@/contexts/TerminologyContext";
 import GuardrailGarden from "./guardrail_garden";
@@ -28,6 +28,7 @@ const DECISION_MODEL_CARDS = ALL_CARDS.filter((c) => c.category === "decision_mo
 describe("GuardrailGarden", () => {
   beforeEach(() => {
     vi.clearAllMocks();
+    uiConfig.data = undefined;
   });
 
   const renderGarden = () => render(<GuardrailGarden accessToken="test-token" onGuardrailCreated={vi.fn()} />);
@@ -121,18 +122,22 @@ describe("GuardrailGarden", () => {
     }
   });
 
-  it("should match the SI wording a card shows when SI terminology is on", async () => {
-    uiConfig.data = { use_si_terminology: true };
+  it.each([
+    [true, "SI"],
+    [false, "AI"],
+  ])("should match the wording a card shows when SI terminology is %s", (useSi, shownTerm) => {
+    uiConfig.data = { use_si_terminology: useSi };
     const card = ALL_CARDS.find((c) => c.description.startsWith("AI security platform protecting"));
     expect(card).toBeDefined();
-    const user = userEvent.setup();
     render(
       <TerminologyProvider>
         <GuardrailGarden accessToken="test-token" onGuardrailCreated={vi.fn()} />
       </TerminologyProvider>,
     );
 
-    await user.type(screen.getByPlaceholderText("Search guardrails"), "SI security platform protecting");
+    fireEvent.change(screen.getByPlaceholderText("Search guardrails"), {
+      target: { value: `${shownTerm} security platform protecting` },
+    });
 
     expect(screen.getByText(card!.name)).toBeInTheDocument();
   });

ui/litellm-dashboard/src/components/CommandPalette/CommandPalette.integration.test.tsx

@@ -414,26 +414,32 @@ describe("CommandPalette integration", () => {
     expect(mocks.push).toHaveBeenCalledWith(uiHref("logs"));
   });
 
-  it("lists and matches nav pages in SI terminology when the proxy enables it", async () => {
-    const user = userEvent.setup();
-    mocks.pathname = "/teams";
-    vi.stubGlobal(
-      "fetch",
-      vi.fn(async () => Response.json({ ...UI_SETTINGS_RESPONSE, use_si_terminology: true })),
-    );
-    renderWithProviders(
-      <TerminologyProvider>
-        <CommandPaletteProvider>
-          <CommandPaletteTrigger />
-        </CommandPaletteProvider>
-      </TerminologyProvider>,
-    );
+  it.each([
+    [true, "si hub", /^SI Hub/],
+    [false, "ai hub", /^AI Hub/],
+  ])(
+    "lists and matches nav pages in the configured terminology when SI terminology is %s",
+    async (useSi, query, option) => {
+      const user = userEvent.setup();
+      mocks.pathname = "/teams";
+      vi.stubGlobal(
+        "fetch",
+        vi.fn(async () => Response.json({ ...UI_SETTINGS_RESPONSE, use_si_terminology: useSi })),
+      );
+      renderWithProviders(
+        <TerminologyProvider>
+          <CommandPaletteProvider>
+            <CommandPaletteTrigger />
+          </CommandPaletteProvider>
+        </TerminologyProvider>,
+      );
 
-    fireEvent.keyDown(document, { key: "k", ctrlKey: true });
-    await user.type(await screen.findByRole("combobox", { name: "Search" }), "si hub");
+      fireEvent.keyDown(document, { key: "k", ctrlKey: true });
+      await user.type(await screen.findByRole("combobox", { name: "Search" }), query);
 
-    expect(await screen.findByRole("option", { name: /^SI Hub/ })).toBeVisible();
-  });
+      expect(await screen.findByRole("option", { name: option })).toBeVisible();
+    },
+  );
 
   it("clears the global query when switching to key search", async () => {
     const user = userEvent.setup();

ui/litellm-dashboard/src/components/Settings/AdminSettings/UISettings/PageVisibilitySettings.test.tsx

@@ -1,4 +1,4 @@
-import { describe, it, expect, vi } from "vitest";
+import { beforeEach, describe, it, expect, vi } from "vitest";
 import userEvent from "@testing-library/user-event";
 
 import { renderWithProviders, screen } from "@/../tests/test-utils";
@@ -22,6 +22,10 @@ vi.mock("@/components/page_utils", () => ({
 }));
 
 describe("PageVisibilitySettings", () => {
+  beforeEach(() => {
+    uiConfig.data = undefined;
+  });
+
   it("should render the not-set tag when enabledPagesInternalUsers is null", () => {
     renderWithProviders(
       <PageVisibilitySettings enabledPagesInternalUsers={null} isUpdating={false} onUpdate={vi.fn()} />,
@@ -83,8 +87,11 @@ describe("PageVisibilitySettings", () => {
     }
   });
 
-  it("should show group names in SI terminology when the proxy enables it", async () => {
-    uiConfig.data = { use_si_terminology: true };
+  it.each([
+    [true, "SI GATEWAY", "AI GATEWAY"],
+    [false, "AI GATEWAY", "SI GATEWAY"],
+  ])("should name groups in the configured terminology when SI terminology is %s", async (useSi, shown, hidden) => {
+    uiConfig.data = { use_si_terminology: useSi };
     const user = userEvent.setup();
     renderWithProviders(
       <TerminologyProvider>
@@ -94,8 +101,8 @@ describe("PageVisibilitySettings", () => {
 
     await user.click(screen.getByRole("button", { name: /configure page visibility/i }));
 
-    expect(screen.getByRole("group", { name: "SI GATEWAY" })).toBeInTheDocument();
-    expect(screen.queryByRole("group", { name: "AI GATEWAY" })).not.toBeInTheDocument();
+    expect(screen.getByRole("group", { name: shown })).toBeInTheDocument();
+    expect(screen.queryByRole("group", { name: hidden })).not.toBeInTheDocument();
   });
 
   it("should display the property description when provided", () => {