import { cleanup, render, screen, waitFor } from "@testing-library/react"; import { afterEach, describe, expect, it, vi } from "vitest"; import { TooltipProvider } from "@kandev/ui/tooltip"; import { AgentUsageSection } from "@/components/settings/agent-usage-section"; const listAgentSubscriptionUsage = vi.hoisted(() => vi.fn(), ); vi.mock("@/lib/api", () => ({ listAgentSubscriptionUsage, })); vi.mock("@/components/agent-logo", () => ({ AgentLogo: ({ agentName, className }: { agentName: string; className?: string }) => ( ), })); afterEach(() => { cleanup(); listAgentSubscriptionUsage.mockReset(); }); describe("AgentUsageSection", () => { it("renders nothing when no subscription agents are present", async () => { listAgentSubscriptionUsage.mockResolvedValue({ agents: [] }); const { container } = render(); await waitFor(() => expect(listAgentSubscriptionUsage).toHaveBeenCalled()); expect(container.querySelector('[data-testid="agent-usage-section"]')).toBeNull(); }); it("renders utilization windows, plan badge, and per-agent errors", async () => { listAgentSubscriptionUsage.mockResolvedValue({ agents: [ { agent_id: "claude-acp", display_name: "Claude Code", usage: { provider: "anthropic", plan: "max", windows: [ { label: "5-hour", utilization_pct: 62, reset_at: new Date(Date.now() + 3600_000).toISOString(), }, { label: "7-day", utilization_pct: 15, reset_at: new Date(Date.now() + 86400_000).toISOString(), }, ], fetched_at: new Date().toISOString(), }, }, { agent_id: "codex-acp", display_name: "Codex", error: "codex usage: unexpected status 500", }, ], }); render( , ); await screen.findByTestId("agent-usage-section"); expect(screen.getByText("Claude Code")).toBeDefined(); expect(screen.getByText("max")).toBeDefined(); expect(screen.getByText("Good")).toBeDefined(); // worst window 62% → Good expect(screen.getByText("5h")).toBeDefined(); expect(screen.getByText("62%")).toBeDefined(); expect(screen.getByText("7d")).toBeDefined(); expect(screen.getByText("Codex")).toBeDefined(); expect(screen.getByTestId("logo-codex-acp").className).toContain("!opacity-100"); expect(screen.getByTestId("logo-codex-acp").className).toContain("brightness-100"); expect(screen.getByText("Could not fetch usage data.")).toBeDefined(); }); });