diff options
Diffstat (limited to 'services/blog/nuldoc-src/components/Pagination.tsx')
| -rw-r--r-- | services/blog/nuldoc-src/components/Pagination.tsx | 45 |
1 files changed, 45 insertions, 0 deletions
diff --git a/services/blog/nuldoc-src/components/Pagination.tsx b/services/blog/nuldoc-src/components/Pagination.tsx new file mode 100644 index 00000000..5527c924 --- /dev/null +++ b/services/blog/nuldoc-src/components/Pagination.tsx @@ -0,0 +1,45 @@ +type Props = { + currentPage: number; + totalPages: number; + basePath: string; +}; + +export default function Pagination( + { currentPage, totalPages, basePath }: Props, +) { + if (totalPages <= 1) { + return <div></div>; + } + + const prevPage = currentPage > 1 ? currentPage - 1 : null; + const nextPage = currentPage < totalPages ? currentPage + 1 : null; + + const prevHref = prevPage === 1 ? basePath : `${basePath}${prevPage}/`; + const nextHref = `${basePath}${nextPage}/`; + + return ( + <nav className="pagination"> + <div className="pagination-prev"> + {prevPage + ? ( + <a href={prevHref}> + 前のページ + </a> + ) + : null} + </div> + <div className="pagination-info"> + {String(currentPage)} / {String(totalPages)} + </div> + <div className="pagination-next"> + {nextPage + ? ( + <a href={nextHref}> + 次のページ + </a> + ) + : null} + </div> + </nav> + ); +} |
