test(ui): fix guardrails.test.tsx after antd Tabs migration

The test was hitting "No QueryClient set" because TeamGuardrailsTab
(which pulls in useRegisterGuardrail) was not mocked alongside the
other tab children. Added a mock.

Also: the "+ Add New Guardrail" assertion was silently relying on
Tremor Tabs rendering all panels at once. antd Tabs only renders
the active tab's content, and defaultActiveKey is "submitted", so
the button in the "Guardrails" tab wasn't in the DOM. Clicking the
Guardrails tab first before asserting.

ui/litellm-dashboard/src/components/guardrails.test.tsx

@@ -1,4 +1,4 @@
-import { render, screen } from "@testing-library/react";
+import { render, screen, fireEvent } from "@testing-library/react";
 import { beforeAll, beforeEach, describe, expect, it, vi } from "vitest";
 import GuardrailsPanel from "./guardrails";
 import { getGuardrailsList } from "./networking";
@@ -40,6 +40,10 @@ vi.mock("./guardrails/GuardrailTestPlayground", () => ({
   default: () => <div>Mock Guardrail Test Playground</div>,
 }));
 
+vi.mock("./guardrails/TeamGuardrailsTab", () => ({
+  TeamGuardrailsTab: () => <div>Mock Team Guardrails Tab</div>,
+}));
+
 vi.mock("@/utils/roles", () => ({
   isAdminRole: vi.fn((role: string) => role === "admin"),
 }));
@@ -99,6 +103,8 @@ describe("GuardrailsPanel", () => {
   it("should render the component", async () => {
     render(<GuardrailsPanel {...defaultProps} />);
     expect(screen.getByText("Guardrails")).toBeInTheDocument();
+    // Activate the Guardrails tab so its content (including the Add button) is rendered
+    fireEvent.click(screen.getByText("Guardrails"));
     expect(screen.getByText("+ Add New Guardrail")).toBeInTheDocument();
   });
 });