import { Button } from "./button";

interface PaginationProps {
  page: number;
  lastPage: number;
  total: number;
  perPage: number;
  onPageChange: (page: number) => void;
}

/** Simple prev/next pagination with a result-count summary. */
export function Pagination({ page, lastPage, total, perPage, onPageChange }: PaginationProps) {
  const from = total === 0 ? 0 : (page - 1) * perPage + 1;
  const to = Math.min(page * perPage, total);

  return (
    <div className="flex flex-col gap-3 border-t border-(--color-border) px-4 py-3 sm:flex-row sm:items-center sm:justify-between sm:px-5">
      <p className="text-center text-sm text-(--color-ink-faint) sm:text-left">
        Showing {from}–{to} of {total}
      </p>
      <div className="flex w-full items-center justify-between gap-2 sm:w-auto sm:justify-start">
        <Button variant="outline" size="sm" disabled={page <= 1} onClick={() => onPageChange(page - 1)} aria-label="Go to previous page">
          Previous
        </Button>
        <span className="text-sm text-(--color-ink-muted)">
          Page {page} of {Math.max(lastPage, 1)}
        </span>
        <Button variant="outline" size="sm" disabled={page >= lastPage} onClick={() => onPageChange(page + 1)} aria-label="Go to next page">
          Next
        </Button>
      </div>
    </div>
  );
}