import { render } from "@testing-library/react";
import { axe } from "vitest-axe";

import { Pagination } from "../Pagination.tsx";

const getItems = (count = 10, current = Math.ceil(count / 2)) =>
  [
    ...Array(count)
      .fill("")
      .map((_, i) => i + 1),
  ].map((n) => ({
    label: `${n}`,
    ariaLabel: `Strana ${n}`,
    href: `/?page=${n}`,
    ...(current === n ? { isActive: true } : {}),
  }));

const example = (
  <>
    <Pagination label="Pagination 1" items={getItems(10)} />
    <Pagination label="Pagination 2" items={getItems(10, 3)} />
    <Pagination label="Pagination 3" items={getItems(10)} />
    <Pagination label="Pagination 4" items={getItems(10, 9)} />
    <Pagination label="Pagination 5" items={getItems(10, 1)} isCompact />
    <Pagination label="Pagination 6" items={getItems(10, 2)} isCompact />
    <Pagination label="Pagination 7" items={getItems(10)} isCompact />
    <Pagination label="Pagination 8" items={getItems(10, 9)} isCompact />
    <Pagination label="Pagination 9" items={getItems(10, 10)} isCompact />
  </>
);

it("is valid html", () => {
  const { container } = render(example);
  expect(container).toHTMLValidate();
});

it("is accessible", async () => {
  const { container } = render(example);
  expect(await axe(container)).toHaveNoViolations();
});