SPB Git
1019 B · 16 lines tsx
1import Link from "next/link";2export function Pagination({ page, pages, makeHref }: { page: number; pages: number; makeHref: (p: number) => string }) {3  if (pages <= 1) return null;4  const items = Array.from(new Set([1, page - 1, page, page + 1, pages].filter((p) => p >= 1 && p <= pages))).sort((a, b) => a - b);5  return (6    <nav aria-label="Pagination" className="mt-8 flex items-center justify-center gap-1">7      {page > 1 && <Link href={makeHref(page - 1)} className="btn-ghost h-9 px-3" rel="prev">Previous</Link>}8      {items.map((p, i) => (9        <span key={p} className="flex items-center">{i > 0 && items[i - 1] !== p - 1 && <span className="px-1 text-fg-3">…</span>}10          <Link href={makeHref(p)} aria-current={p === page ? "page" : undefined} className={`btn h-9 min-w-9 px-2 ${p === page ? "bg-accent text-accent-fg" : "btn-ghost"}`}>{p}</Link></span>11      ))}12      {page < pages && <Link href={makeHref(page + 1)} className="btn-ghost h-9 px-3" rel="next">Next</Link>}13    </nav>14  );15}16
Files · laptop-initial-20261102
Menu

Theme