import { render, screen } from "@testing-library/react";
import { caseStudies } from "@/lib/site-content";
import { ServiceRelatedCases } from "./ServiceRelatedCases";

const caseStudy = caseStudies[0];
const note = "Desde 2022 trabalho com isso, em sistemas internos.";

it("renders nothing without cases and without an experience note", () => {
  const { container } = render(
    <ServiceRelatedCases cases={[]} relevance={{}} />,
  );
  expect(container).toBeEmptyDOMElement();
});

it("shows only the experience note, without the 'open the case' sentence, when there are no cases", () => {
  const { container } = render(
    <ServiceRelatedCases cases={[]} relevance={{}} experienceNote={note} />,
  );

  expect(
    screen.getByRole("heading", { level: 2, name: "Como eu trabalho nisso" }),
  ).toBeVisible();
  expect(screen.getByText(note)).toBeVisible();
  expect(screen.queryByText(/Abra o case/)).toBeNull();
  expect(screen.queryByRole("link")).toBeNull();
  expect(container.querySelector(".ds-grid-2")).toBeNull();
});

it("invites to open the case and lists each case when there are some", () => {
  render(
    <ServiceRelatedCases
      cases={[caseStudy]}
      relevance={{ [caseStudy.id]: "Frase própria sobre a relação." }}
    />,
  );

  expect(screen.getByText(/Abra o case/)).toBeVisible();
  expect(screen.getByText("Frase própria sobre a relação.")).toBeVisible();
  expect(
    screen.getByRole("link", { name: `Ver case ${caseStudy.title}` }),
  ).toHaveAttribute("href", `/cases/${caseStudy.id}`);
});

it("falls back to the case summary when no relevance sentence is given", () => {
  render(<ServiceRelatedCases cases={[caseStudy]} relevance={{}} />);

  expect(screen.getByText(caseStudy.summary)).toBeVisible();
});