spb/cancerindex

1import Link from 'next/link';2import { fmtInt } from '@/lib/format';34export function Pagination({ page, pageSize, total, hrefFor }: { page: number; pageSize: number; total: number; hrefFor: (page: number) => string }) {5  const pages = Math.max(1, Math.ceil(total / pageSize));6  const from = total === 0 ? 0 : (page - 1) * pageSize + 1;7  const to = Math.min(total, page * pageSize);8  return (9    <nav aria-label="Pagination" className="mt-3 flex flex-wrap items-center justify-between gap-2 text-[13px] text-ink-2">10      <p>11        Showing <span className="ci-num">{fmtInt(from)}</span>–<span className="ci-num">{fmtInt(to)}</span> of <span className="ci-num">{fmtInt(total)}</span>12      </p>13      <div className="flex items-center gap-1">14        {page > 1 ? (15          <Link className="border border-rule px-2 py-1 hover:border-accent hover:text-accent" href={hrefFor(page - 1)} rel="prev">16            ← Previous17          </Link>18        ) : (19          <span className="border border-rule px-2 py-1 text-ink-4">← Previous</span>20        )}21        <span className="px-2">22          Page <span className="ci-num">{page}</span> / <span className="ci-num">{pages}</span>23        </span>24        {page < pages ? (25          <Link className="border border-rule px-2 py-1 hover:border-accent hover:text-accent" href={hrefFor(page + 1)} rel="next">26            Next →27          </Link>28        ) : (29          <span className="border border-rule px-2 py-1 text-ink-4">Next →</span>30        )}31      </div>32    </nav>33  );34}35