// @vitest-environment jsdom

import { cleanup, fireEvent, render, screen } from "@testing-library/react";
import { beforeEach, describe, expect, it, vi } from "vitest";
import { makeSummaryPayload, makeSummaryRegion } from "../test-helpers";
import { SummarySection } from "./summary-section";

describe("SummarySection", () => {
  beforeEach(() => {
    cleanup();
  });

  it("renders coverage and triggers refresh callback", () => {
    const onRefresh = vi.fn();
    const summary = makeSummaryPayload({
      coverage: { selected: 2, ready: 1, missingDatasource: 1, queryError: 0 },
      regions: [
        makeSummaryRegion({
          region: { regionName: "us-west-2-ng" },
          status: "ready",
        }),
        makeSummaryRegion({
          region: {
            id: "nextgen:aws:prod:prod-aws-us-east-1-ng",
            regionName: "us-east-1-ng",
          },
          status: "missing-datasource",
        }),
      ],
    });

    render(<SummarySection summary={summary} loading={false} onRefresh={onRefresh} />);

    expect(screen.getByTestId("coverage-summary")).toHaveTextContent(
      "2 selected · 1 ready · 1 datasource missing"
    );
    expect(screen.getByText("us-west-2-ng")).toBeInTheDocument();
    expect(screen.getByText("us-east-1-ng")).toBeInTheDocument();

    fireEvent.click(screen.getByRole("button", { name: "Refresh Summary" }));
    expect(onRefresh).toHaveBeenCalledTimes(1);
  });

  it("renders agent status special config after abnormal", () => {
    const summary = makeSummaryPayload({
      regions: [
        makeSummaryRegion({
          agentCrStatus: {
            normal: 2,
            hibernated: 0,
            paused: 1,
            abnormal: 0,
            specialConfig: 1,
          },
        }),
      ],
    });

    render(<SummarySection summary={summary} loading={false} onRefresh={() => {}} />);

    const row = screen.getByRole("row", { name: /us-west-2-ng/ });
    expect(row).toHaveTextContent("N:2");
    expect(row).toHaveTextContent("H:0");
    expect(row).toHaveTextContent("P:1");
    expect(row).toHaveTextContent("A:0");
    expect(row).toHaveTextContent("S:1");
    expect(row.textContent?.indexOf("A:0")).toBeLessThan(row.textContent?.indexOf("S:1") ?? -1);

    const specialValue = screen.getByText("S:").nextElementSibling as HTMLElement | null;
    expect(specialValue).not.toBeNull();
    expect(specialValue).toHaveClass("text-danger");

    fireEvent.mouseEnter(screen.getByText("N:").closest("div") as Element);
    expect(screen.getByRole("tooltip")).toHaveTextContent("SpecialConfig: 1");
  });

  it("shows query-error details only in the status dot tooltip", () => {
    const summary = makeSummaryPayload({
      regions: [
        makeSummaryRegion({
          status: "query-error",
          errorMessage: "VictoriaMetrics query failed",
        }),
      ],
    });

    render(<SummarySection summary={summary} loading={false} onRefresh={() => {}} />);

    expect(screen.queryByText("VictoriaMetrics query failed")).not.toBeInTheDocument();

    fireEvent.mouseEnter(screen.getByRole("img", { name: "Query error" }));
    expect(screen.getByRole("tooltip")).toHaveTextContent("Query error");
    expect(screen.getByRole("tooltip")).toHaveTextContent("VictoriaMetrics query failed");
  });
});