Saravana Achu Mac
a5b0a89527
Phase 3 (Web UX Polish) of the execution roadmap: - Add reusable Pagination component for list views - Fix getNoteDetail to avoid fetching all notes when workspaceId is unknown - Add file upload button to ArtifactPanel using uploadArtifact() from blob-client - Remove unused zustand and zod from web dependencies - SSR safety already addressed via existing lazy-init patterns Made-with: Cursor
40 lines
1.2 KiB
TypeScript
40 lines
1.2 KiB
TypeScript
"use client";
|
|
|
|
interface PaginationProps {
|
|
offset: number;
|
|
limit: number;
|
|
total: number;
|
|
onPageChange: (newOffset: number) => void;
|
|
}
|
|
|
|
export function Pagination({ offset, limit, total, onPageChange }: PaginationProps) {
|
|
const currentPage = Math.floor(offset / limit) + 1;
|
|
const totalPages = Math.max(1, Math.ceil(total / limit));
|
|
|
|
if (totalPages <= 1) return null;
|
|
|
|
return (
|
|
<div style={{ display: "flex", alignItems: "center", justifyContent: "center", gap: "var(--nl-space-3)", padding: "var(--nl-space-4) 0" }}>
|
|
<button
|
|
disabled={currentPage <= 1}
|
|
onClick={() => onPageChange(Math.max(0, offset - limit))}
|
|
className="surface-muted"
|
|
style={{ padding: "6px 14px", border: "none", fontSize: "var(--nl-fs-sm)" }}
|
|
>
|
|
Previous
|
|
</button>
|
|
<span style={{ fontSize: "var(--nl-fs-sm)", color: "var(--nl-text-secondary)" }}>
|
|
Page {currentPage} of {totalPages}
|
|
</span>
|
|
<button
|
|
disabled={currentPage >= totalPages}
|
|
onClick={() => onPageChange(offset + limit)}
|
|
className="surface-muted"
|
|
style={{ padding: "6px 14px", border: "none", fontSize: "var(--nl-fs-sm)" }}
|
|
>
|
|
Next
|
|
</button>
|
|
</div>
|
|
);
|
|
}
|