openreplay/frontend/app/components/shared/FullPagination.tsx
2025-02-14 12:32:45 +01:00

42 lines
996 B
TypeScript

import React from 'react';
import { Pagination } from 'UI';
import { numberWithCommas } from 'App/utils';
function FullPagination({
page,
limit,
total,
listLen,
onPageChange,
entity,
}: {
page: number;
limit: number;
total: number;
listLen: number;
onPageChange: (page: number) => void;
entity?: string;
}) {
return (
<div className="flex items-center justify-between px-4 py-3 shadow-sm w-full bg-white rounded-lg mt-2">
<div>
{'Showing '}
<span className="font-medium">{(page - 1) * limit + 1}</span>
{' to '}
<span className="font-medium">{(page - 1) * limit + listLen}</span>
{' of '}
<span className="font-medium">{numberWithCommas(total)}</span>
{entity ? ` ${entity}.` : '.'}
</div>
<Pagination
page={page}
total={total}
onPageChange={onPageChange}
limit={limit}
debounceRequest={500}
/>
</div>
);
}
export default FullPagination;