José Almeida
9c16d337a2
* feat(web): add app status bar * feat(web): add app status bar visibility toggle * feat(web): persist status bar item order * fix(web): refine app status bar behavior * fix(web): polish app status bar presentation * test(web): split plugin slot coverage groups * fix(web): address status surface review feedback * fix(web): stabilize status bar overlay tests
86 lines
2.8 KiB
TypeScript
86 lines
2.8 KiB
TypeScript
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<typeof import("@/lib/api").listAgentSubscriptionUsage>(),
|
|
);
|
|
|
|
vi.mock("@/lib/api", () => ({
|
|
listAgentSubscriptionUsage,
|
|
}));
|
|
|
|
vi.mock("@/components/agent-logo", () => ({
|
|
AgentLogo: ({ agentName, className }: { agentName: string; className?: string }) => (
|
|
<span data-testid={`logo-${agentName}`} className={className} />
|
|
),
|
|
}));
|
|
|
|
afterEach(() => {
|
|
cleanup();
|
|
listAgentSubscriptionUsage.mockReset();
|
|
});
|
|
|
|
describe("AgentUsageSection", () => {
|
|
it("renders nothing when no subscription agents are present", async () => {
|
|
listAgentSubscriptionUsage.mockResolvedValue({ agents: [] });
|
|
|
|
const { container } = render(<AgentUsageSection />);
|
|
|
|
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(
|
|
<TooltipProvider>
|
|
<AgentUsageSection />
|
|
</TooltipProvider>,
|
|
);
|
|
|
|
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();
|
|
});
|
|
});
|