From fd6fdf6b3d75effdd48ee4fcf01fff307a28e62a Mon Sep 17 00:00:00 2001
From: Sendou <sendou77@gmail.com>
Date: Thu, 19 Mar 2020 01:21:50 +0200
Subject: [PATCH] pagination bug fixed

---
 frontend-react/src/components/common/Pagination.tsx      | 9 +++++++--
 .../src/components/xsearch/Top500BrowserPage.tsx         | 4 +++-
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/frontend-react/src/components/common/Pagination.tsx b/frontend-react/src/components/common/Pagination.tsx
index 905fbfda8..4c8bc578f 100644
--- a/frontend-react/src/components/common/Pagination.tsx
+++ b/frontend-react/src/components/common/Pagination.tsx
@@ -8,7 +8,11 @@ interface PaginationProps {
   onChange: (page: number) => void
 }
 
-const Pagination: React.FC<PaginationProps> = ({ pageCount, onChange }) => {
+const Pagination: React.FC<PaginationProps> = ({
+  pageCount,
+  onChange,
+  currentPage,
+}) => {
   return (
     <ReactPaginate
       previousLabel={<>&laquo;</>}
@@ -18,7 +22,8 @@ const Pagination: React.FC<PaginationProps> = ({ pageCount, onChange }) => {
       pageCount={pageCount}
       marginPagesDisplayed={2}
       pageRangeDisplayed={3}
-      onPageChange={({ selected }) => onChange(selected)}
+      onPageChange={({ selected }) => onChange(selected + 1)}
+      forcePage={currentPage - 1}
       containerClassName="pagination"
       pageClassName="page"
       previousClassName="page"
diff --git a/frontend-react/src/components/xsearch/Top500BrowserPage.tsx b/frontend-react/src/components/xsearch/Top500BrowserPage.tsx
index 9d416e5cb..04b589260 100644
--- a/frontend-react/src/components/xsearch/Top500BrowserPage.tsx
+++ b/frontend-react/src/components/xsearch/Top500BrowserPage.tsx
@@ -98,6 +98,8 @@ const Top500BrowserPage: React.FC<RouteComponentProps> = () => {
 
   const placements = data ? data.searchForPlacements.placements : []
 
+  console.log("forms.page", forms.page)
+
   return (
     <>
       <Helmet>
@@ -115,7 +117,7 @@ const Top500BrowserPage: React.FC<RouteComponentProps> = () => {
           </Box>
         </Flex>
       </Box>
-      <Box mt="2em" mb="1em">
+      <Box mt="1em">
         <Pagination
           currentPage={forms.page ?? 1}
           pageCount={data?.searchForPlacements.pageCount ?? 999}