import { ChevronLeft, ChevronRight, ChevronsLeft, ChevronsRight } from "lucide-react"; import { PAGE_SIZES } from "~/components/console/use-list-pagination.ts"; import { Button } from "~/components/ui/button.tsx"; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "~/components/ui/select.tsx"; import { cn } from "~/lib/utils.ts"; export type PaginationProps = { page: number; pageSize: number; /** With hasMore, total is the loaded count, not a complete total. */ total: number; hasMore?: boolean; busy?: boolean; onPageChange: (page: number) => void; onPageSizeChange?: (size: number) => void; className?: string; }; export function pageNumbers(page: number, pages: number): (number | "…")[] { const values = new Set([1, pages, page - 1, page, page + 1]); const valid = [...values].filter((n) => n >= 1 && n <= pages).sort((a, b) => a - b); return valid.flatMap((n, i): (number | "…")[] => (i && n - valid[i - 1] > 1 ? ["…", n] : [n])); } /** Shared pagination for tables, cards and cursor-backed record lists. */ export function Pagination({ page, pageSize, total, hasMore = false, busy = false, onPageChange, onPageSizeChange, className, }: PaginationProps) { const loadedPages = Math.max(1, Math.ceil(total / pageSize)); const pages = loadedPages + (hasMore ? 1 : 0); const from = total ? (page - 1) * pageSize + 1 : 0; const to = Math.min(page * pageSize, total); return ( ); }