Files

39 lines
1.2 KiB
TypeScript

import Link from "next/link";
type Props = {
page: number;
pageSize: number;
total: number;
makeHref: (page: number) => string;
};
export function Pagination({ page, pageSize, total, makeHref }: Props) {
const pages = Math.max(1, Math.ceil(total / pageSize));
if (pages <= 1) return null;
const prev = page > 1 ? page - 1 : null;
const next = page < pages ? page + 1 : null;
return (
<div className="mt-10 flex items-center justify-center gap-3 text-sm">
{prev ? (
<Link href={makeHref(prev)} className="rounded-lg border border-black/10 px-4 py-2 hover:border-brand hover:text-brand">
قبلی
</Link>
) : (
<span className="rounded-lg border border-black/5 px-4 py-2 text-zinc-300">قبلی</span>
)}
<span className="text-zinc-500">
صفحه {page} از {pages}
</span>
{next ? (
<Link href={makeHref(next)} className="rounded-lg border border-black/10 px-4 py-2 hover:border-brand hover:text-brand">
بعدی
</Link>
) : (
<span className="rounded-lg border border-black/5 px-4 py-2 text-zinc-300">بعدی</span>
)}
</div>
);
}