import { fireEvent } from "@testing-library/react";
import { describe, it, expect } from "vitest";
import { renderWithProviders, screen } from "@/test/render";
import { JournalEntriesView, type JournalViewEntry } from "./journal-entries-view";

const ENTRIES: JournalViewEntry[] = [
  {
    id: "je-1",
    entryDate: "2026-01-15",
    status: "POSTED",
    heading: "AP Booking",
    lines: [
      {
        id: "l1",
        accountLabel: "1300 — Inventory Asset",
        description: "Receipt",
        debit: "70",
        credit: null,
      },
      {
        id: "l2",
        accountLabel: "2100 — GR/IR Clearing",
        description: "Receipt",
        debit: null,
        credit: "70",
      },
    ],
  },
];

describe("JournalEntriesView", () => {
  it("renders account labels and amounts in List mode (default)", async () => {
    await renderWithProviders(<JournalEntriesView entries={ENTRIES} />, {
      waitForButton: false,
    });
    // Use findBy* to wait for AppShell's data router to paint the component
    expect(await screen.findByText("1300 — Inventory Asset")).toBeInTheDocument();
    expect(await screen.findByText("2100 — GR/IR Clearing")).toBeInTheDocument();
    // Amounts (formatCurrency renders $70.00)
    const amounts = await screen.findAllByText("$70.00");
    expect(amounts.length).toBeGreaterThanOrEqual(2);
  });

  it("shows the entry heading", async () => {
    await renderWithProviders(<JournalEntriesView entries={ENTRIES} />, {
      waitForButton: false,
    });
    expect(await screen.findByText("AP Booking")).toBeInTheDocument();
  });

  it("toggles to Voucher mode and still shows account labels", async () => {
    await renderWithProviders(<JournalEntriesView entries={ENTRIES} />, {
      waitForButton: false,
    });
    // Wait for initial render
    await screen.findByText("AP Booking");
    // Click the Voucher tab
    const voucherTab = screen.getByRole("tab", { name: /voucher/i });
    fireEvent.click(voucherTab);
    // In Voucher mode the debit account still appears
    expect(screen.getAllByText("1300 — Inventory Asset").length).toBeGreaterThan(0);
    expect(screen.getAllByText("2100 — GR/IR Clearing").length).toBeGreaterThan(0);
  });
});