import { describe, it, expect, vi } from "vitest";
import { render, screen } from "@testing-library/react";
import { MemoryRouter } from "react-router-dom";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";

vi.mock("@/api/driver", () => ({
  getBalance: vi.fn(async () => ({
    accounts: [
      { bucket: "Долг аренда", balance: -3200 },
      { bucket: "Депозит", balance: 5000 },
    ],
  })),
}));

import { BalancePage } from "./BalancePage";

function wrap() {
  const qc = new QueryClient();
  return render(
    <QueryClientProvider client={qc}>
      <MemoryRouter><BalancePage /></MemoryRouter>
    </QueryClientProvider>
  );
}

describe("BalancePage", () => {
  it("shows hero total (sum of negatives) and account rows", async () => {
    wrap();
    expect(await screen.findByText("Долг аренда")).toBeInTheDocument();
    expect(screen.getByText("Депозит")).toBeInTheDocument();
    // Appears in both the hero total and the single debt account row.
    expect(screen.getAllByText("−3 200 ₽").length).toBeGreaterThan(0);
    expect(screen.getByRole("button", { name: /Пополнить/i })).toBeInTheDocument();
  });
});
