From bdf47eb0f0a608e31e93df2fa5e546838821ab55 Mon Sep 17 00:00:00 2001 From: yuneng-jiang Date: Wed, 4 Feb 2026 17:01:48 -0800 Subject: [PATCH] Adding tests --- .../hooks/uiSettings/useUISettings.test.ts | 72 +------------------ .../hooks/uiSettings/useUISettings.ts | 1 - .../components/AIHub/ModelHubTable.test.tsx | 14 +++- 3 files changed, 14 insertions(+), 73 deletions(-) diff --git a/ui/litellm-dashboard/src/app/(dashboard)/hooks/uiSettings/useUISettings.test.ts b/ui/litellm-dashboard/src/app/(dashboard)/hooks/uiSettings/useUISettings.test.ts index 785f003d2f..0fc3bda27f 100644 --- a/ui/litellm-dashboard/src/app/(dashboard)/hooks/uiSettings/useUISettings.test.ts +++ b/ui/litellm-dashboard/src/app/(dashboard)/hooks/uiSettings/useUISettings.test.ts @@ -10,12 +10,6 @@ vi.mock("@/components/networking", () => ({ getUiSettings: vi.fn(), })); -// Mock useAuthorized hook - we can override this in individual tests -const mockUseAuthorized = vi.fn(); -vi.mock("../useAuthorized", () => ({ - default: () => mockUseAuthorized(), -})); - // Mock data const mockUISettings: Record = { theme: "dark", @@ -39,18 +33,6 @@ describe("useUISettings", () => { // Reset all mocks vi.clearAllMocks(); - - // Set default mock for useAuthorized (enabled state) - mockUseAuthorized.mockReturnValue({ - accessToken: "test-access-token", - userRole: "Admin", - userId: "test-user-id", - token: "test-token", - userEmail: "test@example.com", - premiumUser: false, - disabledPersonalKeyCreation: null, - showSSOBanner: false, - }); }); const wrapper = ({ children }: { children: ReactNode }) => @@ -74,7 +56,7 @@ describe("useUISettings", () => { expect(result.current.data).toEqual(mockUISettings); expect(result.current.error).toBeNull(); - expect(getUiSettings).toHaveBeenCalledWith("test-access-token"); + expect(getUiSettings).toHaveBeenCalledWith(); expect(getUiSettings).toHaveBeenCalledTimes(1); }); @@ -98,58 +80,10 @@ describe("useUISettings", () => { expect(result.current.error).toEqual(testError); expect(result.current.data).toBeUndefined(); - expect(getUiSettings).toHaveBeenCalledWith("test-access-token"); + expect(getUiSettings).toHaveBeenCalledWith(); expect(getUiSettings).toHaveBeenCalledTimes(1); }); - it("should not execute query when accessToken is missing", async () => { - // Mock missing accessToken - mockUseAuthorized.mockReturnValue({ - accessToken: null, - userRole: "Admin", - userId: "test-user-id", - token: null, - userEmail: "test@example.com", - premiumUser: false, - disabledPersonalKeyCreation: null, - showSSOBanner: false, - }); - - const { result } = renderHook(() => useUISettings(), { wrapper }); - - // Query should not execute - expect(result.current.isLoading).toBe(false); - expect(result.current.data).toBeUndefined(); - expect(result.current.isFetched).toBe(false); - - // API should not be called - expect(getUiSettings).not.toHaveBeenCalled(); - }); - - it("should not execute query when accessToken is empty string", async () => { - // Mock empty accessToken - mockUseAuthorized.mockReturnValue({ - accessToken: "", - userRole: "Admin", - userId: "test-user-id", - token: "", - userEmail: "test@example.com", - premiumUser: false, - disabledPersonalKeyCreation: null, - showSSOBanner: false, - }); - - const { result } = renderHook(() => useUISettings(), { wrapper }); - - // Query should not execute - expect(result.current.isLoading).toBe(false); - expect(result.current.data).toBeUndefined(); - expect(result.current.isFetched).toBe(false); - - // API should not be called - expect(getUiSettings).not.toHaveBeenCalled(); - }); - it("should return empty object when API returns empty settings", async () => { // Mock API returning empty object (getUiSettings as any).mockResolvedValue({}); @@ -163,7 +97,7 @@ describe("useUISettings", () => { }); expect(result.current.data).toEqual({}); - expect(getUiSettings).toHaveBeenCalledWith("test-access-token"); + expect(getUiSettings).toHaveBeenCalledWith(); }); it("should handle network timeout error", async () => { diff --git a/ui/litellm-dashboard/src/app/(dashboard)/hooks/uiSettings/useUISettings.ts b/ui/litellm-dashboard/src/app/(dashboard)/hooks/uiSettings/useUISettings.ts index f6d5035018..14c6c5e388 100644 --- a/ui/litellm-dashboard/src/app/(dashboard)/hooks/uiSettings/useUISettings.ts +++ b/ui/litellm-dashboard/src/app/(dashboard)/hooks/uiSettings/useUISettings.ts @@ -1,7 +1,6 @@ import { getUiSettings } from "@/components/networking"; import { useQuery } from "@tanstack/react-query"; import { createQueryKeys } from "../common/queryKeysFactory"; -import useAuthorized from "../useAuthorized"; const uiSettingsKeys = createQueryKeys("uiSettings"); diff --git a/ui/litellm-dashboard/src/components/AIHub/ModelHubTable.test.tsx b/ui/litellm-dashboard/src/components/AIHub/ModelHubTable.test.tsx index a88ce0d793..048fc9195a 100644 --- a/ui/litellm-dashboard/src/components/AIHub/ModelHubTable.test.tsx +++ b/ui/litellm-dashboard/src/components/AIHub/ModelHubTable.test.tsx @@ -1,6 +1,6 @@ import * as networking from "@/components/networking"; -import { render, screen, waitFor } from "@testing-library/react"; import { afterEach, describe, expect, it, vi } from "vitest"; +import { renderWithProviders, screen, waitFor } from "../../../tests/test-utils"; import ModelHubTable from "./ModelHubTable"; vi.mock("@/components/networking", () => ({ @@ -11,6 +11,8 @@ vi.mock("@/components/networking", () => ({ getProxyBaseUrl: vi.fn(() => "http://localhost:4000"), getAgentsList: vi.fn(), fetchMCPServers: vi.fn(), + getUiSettings: vi.fn(), + getClaudeCodeMarketplace: vi.fn(), })); vi.mock("next/navigation", () => ({ @@ -39,8 +41,11 @@ describe("ModelHubTable", () => { agents: [], }); vi.mocked(networking.fetchMCPServers).mockResolvedValue([]); + vi.mocked(networking.getUiSettings).mockResolvedValue({ + values: {}, + }); - render(); + renderWithProviders(); await waitFor(() => { expect(screen.getByText("AI Hub")).toBeInTheDocument(); @@ -58,8 +63,11 @@ describe("ModelHubTable", () => { admin_ui_disabled: false, }); modelHubPublicModelsCallMock.mockResolvedValue([]); + vi.mocked(networking.getUiSettings).mockResolvedValue({ + values: {}, + }); - render(); + renderWithProviders(); await waitFor(() => { expect(getUiConfigMock).toHaveBeenCalled();