import React from "react";
import "@testing-library/jest-dom";
import { render, screen } from "@testing-library/react";
import AiUsageCard from "./components/AiUsageCard";
import { api } from "./api";

jest.mock("./api", () => ({ api: { get: jest.fn(), post: jest.fn() } }));
jest.mock("./i18n/I18nProvider", () => ({ useI18n: () => ({ t: (key: string, params?: Record<string, unknown>) => {
  const messages: Record<string, string> = {
    settingsUsageTitle: "Account usage",
    settingsUsageUnavailable: "Account usage is temporarily unavailable.",
    settingsUsagePlan: "{plan} plan",
    settingsUsageGenerations: "{used} of {limit} generations this month",
    settingsUsageTokens: "{used} of {limit} estimated tokens",
    settingsUsageStorage: "{used} of {limit} attachment storage",
    settingsUsageReset: "AI limits reset at the start of each calendar month.",
    settingsBillingUpgrade: "Upgrade to Premium",
  };
  return Object.entries(params ?? {}).reduce((text, [name, value]) => text.replace(`{${name}}`, String(value)), messages[key] ?? key);
} }) }));

test("shows monthly AI call and token limits", async () => {
  (api.get as jest.Mock).mockImplementation((url: string) => Promise.resolve({
    data: url === "/billing/status" ? { enabled: true, canCheckout: true, canManage: false } : {
      currentMonth: { calls: 4, estimatedTokens: 12000 },
      plan: "free",
      monthlyCallLimit: 25,
      monthlyTokenLimit: 100000,
      storageUsedBytes: 50000000,
      storageLimitBytes: 250000000,
    },
  }));

  render(<AiUsageCard />);

  expect(await screen.findByText("4 of 25 generations this month")).toBeInTheDocument();
  expect(screen.getByText("12,000 of 100,000 estimated tokens")).toBeInTheDocument();
  expect(screen.getByText("50.0 MB of 250.0 MB attachment storage")).toBeInTheDocument();
  expect(screen.getByLabelText("Monthly AI generations used")).toHaveAttribute("aria-valuenow", "16");
  expect(screen.getByRole("button", { name: "Upgrade to Premium" })).toBeInTheDocument();
});