spb/satelliteindex

1import Link from 'next/link';2import { cn } from '@/lib/cn';3import { fmtInt } from '@/lib/format';45/** URL-driven pagination (server component). `makeHref(page)` builds the link preserving current filters. */6export function Pagination({ page, pages, total, pageSize, makeHref, className }: { page: number; pages: number; total: number; pageSize: number; makeHref: (p: number) => string; className?: string }) {7  if (pages <= 1) return <p className={cn('text-xs text-ink-3', className)}>{fmtInt(total)} results</p>;8  const from = (page - 1) * pageSize + 1;9  const to = Math.min(total, page * pageSize);10  const btn = 'inline-flex h-10 min-w-10 items-center justify-center rounded-md border border-rule px-3 text-sm text-ink-2 hover:bg-plane-2 hover:text-ink';11  return (12    <nav className={cn('flex flex-wrap items-center justify-between gap-3', className)} aria-label="Pagination">13      <p className="tnum text-xs text-ink-3">14        {fmtInt(from)}–{fmtInt(to)} of {fmtInt(total)}15      </p>16      <div className="flex items-center gap-1.5">17        {page > 1 ? <Link href={makeHref(page - 1)} className={btn} rel="prev">‹ Prev</Link> : <span className={cn(btn, 'opacity-40')}>‹ Prev</span>}18        <span className="mono px-2 text-xs text-ink-3">{page} / {fmtInt(pages)}</span>19        {page < pages ? <Link href={makeHref(page + 1)} className={btn} rel="next">Next ›</Link> : <span className={cn(btn, 'opacity-40')}>Next ›</span>}20      </div>21    </nav>22  );23}24