feat: add Prev/Next pagination bar to session history

Made-with: Cursor
This commit is contained in:
cottongin
2026-03-23 11:35:42 -04:00
parent bfabf390b4
commit 0833cf6167

View File

@@ -371,6 +371,42 @@ function History() {
</div> </div>
)} )}
{/* Pagination bar */}
{limit !== 'all' && (() => {
const limitNum = parseInt(limit, 10);
const totalPages = Math.ceil(totalCount / limitNum);
if (totalPages <= 1) return null;
return (
<div className="flex justify-center items-center gap-4 py-3 mt-3 border-t border-gray-200 dark:border-gray-700">
<button
onClick={() => { setPage(p => p - 1); setSelectedIds(new Set()); }}
disabled={page <= 1}
className={`px-4 py-1.5 rounded-md text-sm font-medium transition ${
page <= 1
? 'bg-gray-600 dark:bg-gray-700 text-gray-400 dark:text-gray-500 cursor-not-allowed'
: 'bg-indigo-600 text-white hover:bg-indigo-700'
}`}
>
Prev
</button>
<span className="text-sm text-gray-500 dark:text-gray-400">
Page {page} of {totalPages}
</span>
<button
onClick={() => { setPage(p => p + 1); setSelectedIds(new Set()); }}
disabled={page >= totalPages}
className={`px-4 py-1.5 rounded-md text-sm font-medium transition ${
page >= totalPages
? 'bg-gray-600 dark:bg-gray-700 text-gray-400 dark:text-gray-500 cursor-not-allowed'
: 'bg-indigo-600 text-white hover:bg-indigo-700'
}`}
>
Next
</button>
</div>
);
})()}
{/* Multi-select Action Bar */} {/* Multi-select Action Bar */}
{selectMode && selectedIds.size > 0 && ( {selectMode && selectedIds.size > 0 && (
<div className="sticky bottom-4 mt-4 bg-white dark:bg-gray-800 rounded-lg shadow-lg border border-gray-200 dark:border-gray-700 p-4 flex justify-between items-center"> <div className="sticky bottom-4 mt-4 bg-white dark:bg-gray-800 rounded-lg shadow-lg border border-gray-200 dark:border-gray-700 p-4 flex justify-between items-center">