diff --git a/packages/frontend/src/app/validator/[hash]/Validator.js b/packages/frontend/src/app/validator/[hash]/Validator.js
index 1fa03f33..7f746a72 100644
--- a/packages/frontend/src/app/validator/[hash]/Validator.js
+++ b/packages/frontend/src/app/validator/[hash]/Validator.js
@@ -423,12 +423,13 @@ function Validator ({ hash }) {
:
}
- {proposedBlocks.data?.resultSet?.length > 0 &&
+ {proposedBlocks.data?.resultSet &&
paginationHandler(setProposedBlocks, pagination.selected)}
pageCount={Math.ceil(proposedBlocks.data?.pagination?.total / pageSize) || 1}
forcePage={currentPage}
+ pageRangeDisplayed={0}
/>
}
@@ -445,13 +446,13 @@ function Validator ({ hash }) {
: }
- {transactions.data?.resultSet?.length > 0 &&
+ {transactions.data?.resultSet &&
paginationHandler(setTransactions, pagination.selected)}
pageCount={Math.ceil(transactions.data?.pagination?.total / pageSize) || 1}
forcePage={currentPage}
+ pageRangeDisplayed={0}
/>
}
diff --git a/packages/frontend/src/app/validator/[hash]/ValidatorPage.scss b/packages/frontend/src/app/validator/[hash]/ValidatorPage.scss
index 90cebb92..21fbfa78 100644
--- a/packages/frontend/src/app/validator/[hash]/ValidatorPage.scss
+++ b/packages/frontend/src/app/validator/[hash]/ValidatorPage.scss
@@ -35,6 +35,20 @@
&__ListPagination {
margin-top: 20px;
+
+ .PageItem {
+ &--Previous, &--Next {
+ display: block;
+ }
+
+ &--Previous {
+ margin-right: auto;
+ }
+
+ &--Next {
+ margin-left: auto;
+ }
+ }
}
&__List {
diff --git a/packages/frontend/src/components/pagination/index.js b/packages/frontend/src/components/pagination/index.js
index 0083da14..3efba594 100644
--- a/packages/frontend/src/components/pagination/index.js
+++ b/packages/frontend/src/components/pagination/index.js
@@ -2,7 +2,13 @@ import './Pagination.scss'
import ReactPaginate from 'react-paginate'
-function Pagination ({ onPageChange, pageCount, forcePage }) {
+function Pagination ({
+ onPageChange,
+ pageCount,
+ forcePage,
+ pageRangeDisplayed = 2,
+ marginPagesDisplayed = 1
+}) {
pageCount = Math.max(pageCount, 1)
return (
@@ -10,8 +16,8 @@ function Pagination ({ onPageChange, pageCount, forcePage }) {
breakLabel={'...'}
nextLabel={'>'}
onPageChange={onPageChange}
- pageRangeDisplayed={2}
- marginPagesDisplayed={1}
+ pageRangeDisplayed={pageRangeDisplayed}
+ marginPagesDisplayed={marginPagesDisplayed}
pageCount={pageCount}
previousLabel={'<'}
pageClassName={'PageItem'}