summaryrefslogtreecommitdiff
path: root/src/core/components/elements/Pagination
diff options
context:
space:
mode:
authorRafi Zadanly <zadanlyr@gmail.com>2023-02-17 17:07:50 +0700
committerRafi Zadanly <zadanlyr@gmail.com>2023-02-17 17:07:50 +0700
commitf99e0aba70efad0deb907d8e27f09fc9f527c8a4 (patch)
treef0ac96e4e736a1d385e32553f0e641ee27e11fd3 /src/core/components/elements/Pagination
parent90e1edab9b6a8ccc09a49fed3addbec2cbc4e4c3 (diff)
Refactor
Diffstat (limited to 'src/core/components/elements/Pagination')
-rw-r--r--src/core/components/elements/Pagination/Pagination.js64
1 files changed, 64 insertions, 0 deletions
diff --git a/src/core/components/elements/Pagination/Pagination.js b/src/core/components/elements/Pagination/Pagination.js
new file mode 100644
index 00000000..485295fe
--- /dev/null
+++ b/src/core/components/elements/Pagination/Pagination.js
@@ -0,0 +1,64 @@
+import Link from "../Link/Link"
+
+const Pagination = ({ pageCount, currentPage, url, className }) => {
+ let firstPage = false
+ let lastPage = false
+ let dotsPrevPage = false
+ let dotsNextPage = false
+ let urlParameterPrefix = url.includes('?') ? '&' : '?'
+
+ return pageCount > 1 && (
+ <div className={`pagination ${className}`}>
+ { Array.from(Array(pageCount)).map((v, i) => {
+ let page = i + 1
+ let rangePrevPage = currentPage - 2
+ let rangeNextPage = currentPage + 2
+ let PageComponent = <Link key={i} href={`${url + urlParameterPrefix}page=${page}`} className={"pagination-item" + (page == currentPage ? " pagination-item--active " : "")}>{page}</Link>
+ let DotsComponent = <div key={i} className="pagination-dots">...</div>
+
+ if (pageCount == 7) {
+ return PageComponent
+ }
+
+ if (currentPage == 1) rangeNextPage += 3
+ if (currentPage == 2) rangeNextPage += 2
+ if (currentPage == 3) rangeNextPage += 1
+ if (currentPage == 4) rangePrevPage -= 1
+ if (currentPage == pageCount) rangePrevPage -= 3
+ if (currentPage == pageCount - 1) rangePrevPage -= 2
+ if (currentPage == pageCount - 2) rangePrevPage -= 1
+ if (currentPage == pageCount - 3) rangeNextPage += 1
+
+ if (page > rangePrevPage && page < rangeNextPage) {
+ return PageComponent
+ }
+
+ if (page == 1 && rangePrevPage >= 1 && !firstPage) {
+ firstPage = true
+ return PageComponent
+ }
+
+ if (page == pageCount && rangeNextPage <= pageCount && !lastPage) {
+ lastPage = true
+ return PageComponent
+ }
+
+ if (page > currentPage && (pageCount - currentPage) > 1 && !dotsNextPage) {
+ dotsNextPage = true
+ return DotsComponent
+ }
+
+ if (page < currentPage && (currentPage - 1) > 1 && !dotsPrevPage) {
+ dotsPrevPage = true
+ return DotsComponent
+ }
+ }) }
+ </div>
+ )
+}
+
+Pagination.defaultProps = {
+ className: ''
+}
+
+export default Pagination \ No newline at end of file