From 151c6ec314481b51090971d9d85f26b0f0269836 Mon Sep 17 00:00:00 2001
From: rishighan <rishi.ghan@gmail.com>
Date: Sat, 29 Oct 2022 15:47:27 -0700
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=8E=20Fixed=20search=20bar=20on=20Libr?=
 =?UTF-8?q?ary=20page?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/client/components/Library/Library.tsx   | 35 +++++++++++++--------
 src/client/components/Library/SearchBar.tsx |  1 +
 2 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/src/client/components/Library/Library.tsx b/src/client/components/Library/Library.tsx
index 7e540df..b53911c 100644
--- a/src/client/components/Library/Library.tsx
+++ b/src/client/components/Library/Library.tsx
@@ -48,10 +48,15 @@ export const Library = (): ReactElement => {
   const T2Table = (tableOptions): ReactElement => {
     const { columns, totalPages, rowClickHandler } =
       tableOptions;
-
+      const [{ pageIndex, pageSize }, setPagination] =
+      React.useState<PaginationState>({
+        pageIndex: 1,
+        pageSize: 25,
+      })
 
     // pagination methods
     const goToNextPage = useCallback((pageIndex, pageSize) => {
+      table.setPageIndex(pageSize);
       dispatch(
         searchIssue(
           {
@@ -71,6 +76,8 @@ export const Library = (): ReactElement => {
 
 
     const goToPreviousPage = useCallback((pageIndex, pageSize) => {
+      console.log("papsdas", pageIndex);
+      // table.setPageIndex(pageIndex + 1)
       let from = 0;
       if (pageIndex === 2) {
         from = (pageIndex - 1) * pageSize + 2 - 27;
@@ -109,6 +116,18 @@ export const Library = (): ReactElement => {
 
     return (
       <>
+      {/* pagination control */}
+      <nav className="pagination">
+        {pageIndex }
+          <div className="field has-addons">
+            <p className="control">
+              <div className="button" onClick={() => goToNextPage(table.getState().pagination.pageIndex + 1, 25)}> Next Page </div>
+            </p>
+            <p className="control">
+              <div className="button" onClick={() => goToPreviousPage(table.getState().pagination.pageIndex, 25)}> Previous Page</div>
+            </p>
+          </div>
+        </nav>
         <table className="table is-hoverable">
           <thead>
             {table.getHeaderGroups().map((headerGroup, idx) => (
@@ -148,18 +167,7 @@ export const Library = (): ReactElement => {
           </tbody>
         </table>
 
-        {/* pagination control */}
-        <nav className="pagination">
-          {table.getState().pagination.pageIndex + 1}
-          <div className="field has-addons">
-            <p className="control">
-              <div className="button" onClick={() => goToNextPage(table.getState().pagination.pageIndex + 1, 25)}> Next Page </div>
-            </p>
-            <p className="control">
-              <div className="button" > Previous Page</div>
-            </p>
-          </div>
-        </nav>
+        
 
       </>
     );
@@ -281,6 +289,7 @@ export const Library = (): ReactElement => {
           <h1 className="title">Library</h1>
           {/* Search bar */}
           <SearchBar />
+          
         </div>
         {!isUndefined(searchResults.hits) && (
           <div>
diff --git a/src/client/components/Library/SearchBar.tsx b/src/client/components/Library/SearchBar.tsx
index 3e75712..39d2190 100644
--- a/src/client/components/Library/SearchBar.tsx
+++ b/src/client/components/Library/SearchBar.tsx
@@ -21,6 +21,7 @@ export const SearchBar = (): ReactElement => {
             from: 0,
           },
           type: "volumeName",
+          trigger: "libraryPage",
         },
       ),
     );