SPB Git

spb/autoscholar

Public
1.2 KB · 46 lines tsx
1import Link from "next/link";23export function Pagination({4  page,5  pageSize,6  total,7  hrefFor,8}: {9  page: number;10  pageSize: number;11  total: number;12  hrefFor: (p: number) => string;13}) {14  const pages = Math.max(1, Math.ceil(total / pageSize));15  if (pages <= 1) return null;16  const items = Array.from({ length: pages }, (_, i) => i + 1).filter(17    (p) => p === 1 || p === pages || Math.abs(p - page) <= 2,18  );19  return (20    <nav aria-label="Pagination" className="flex flex-wrap items-center gap-1 text-sm">21      {page > 1 && (22        <Link className="btn btn-sm" href={hrefFor(page - 1)} rel="prev">23          ← Previous24        </Link>25      )}26      {items.map((p, i) => (27        <span key={p} className="flex items-center">28          {i > 0 && items[i - 1] !== p - 1 && <span className="subtle px-1">…</span>}29          <Link30            className={`btn btn-sm ${p === page ? "btn-primary" : ""}`}31            href={hrefFor(p)}32            aria-current={p === page ? "page" : undefined}33          >34            {p}35          </Link>36        </span>37      ))}38      {page < pages && (39        <Link className="btn btn-sm" href={hrefFor(page + 1)} rel="next">40          Next →41        </Link>42      )}43    </nav>44  );45}46
Files · main
Menu

Theme