fix pagination

arayabrain · Aug 8, 2023 · bcdccfe · bcdccfe
1 parent c34e9bb
commit bcdccfe
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 21 deletions.
diff --git a/frontend/src/components/Database/DatabaseCells.tsx b/frontend/src/components/Database/DatabaseCells.tsx
@@ -118,7 +118,7 @@ const columns = (handleOpenDialog: (value: ImageUrls[], expId?: string) => void)
 const DatabaseCells = ({ user }: CellProps) => {
   const type: keyof TypeData = user ? 'private' : 'public'
 
-  const { data: dataExperiments, loading } = useSelector(
+  const { data: dataCells, loading } = useSelector(
     (state: RootState) => ({
       data: state[DATABASE_SLICE_NAME].data[type],
       loading: state[DATABASE_SLICE_NAME].loading,
@@ -140,11 +140,11 @@ const DatabaseCells = ({ user }: CellProps) => {
 
   const pagiFilter = useCallback(
     (page?: number) => {
-      return `limit=${dataExperiments.limit}&offset=${
-        page ? page - 1 : dataExperiments.offset
+      return `limit=${dataCells.limit}&offset=${
+        page ? page - 1 : dataCells.offset
       }`
     },
-    [dataExperiments.limit, dataExperiments.offset],
+    [dataCells.limit, dataCells.offset],
   )
 
   const id = searchParams.get('id')
@@ -242,7 +242,7 @@ const DatabaseCells = ({ user }: CellProps) => {
   }
 
   const getColumns = useMemo(() => {
-    return (dataExperiments.header?.graph_titles || []).map(
+    return (dataCells.header?.graph_titles || []).map(
       (graphTitle, index) => ({
         field: `graph_urls.${index}`,
         headerName: graphTitle,
@@ -270,7 +270,7 @@ const DatabaseCells = ({ user }: CellProps) => {
         width: 160,
       }),
     )
-  }, [dataExperiments.header?.graph_titles])
+  }, [dataCells.header?.graph_titles])
 
   const columnsTable = [...columns(handleOpenDialog), ...getColumns].filter(
     Boolean,
@@ -280,7 +280,7 @@ const DatabaseCells = ({ user }: CellProps) => {
     <DatabaseExperimentsWrapper>
       <DataGridPro
         columns={[...columnsTable] as any}
-        rows={dataExperiments?.items || []}
+        rows={dataCells?.items || []}
         hideFooter={true}
         filterMode={'server'}
         sortingMode={'server'}
@@ -329,10 +329,10 @@ const DatabaseCells = ({ user }: CellProps) => {
         onFilterModelChange={handleFilter as any}
       />
       <Pagination
-        sx={{ marginTop: 2 }}
-        count={dataExperiments.total}
-        page={dataParams.offset + 1}
-        onChange={handlePage}
+          sx={{ marginTop: 2 }}
+          count={Math.ceil(dataCells.total / dataCells.limit)}
+          page={Math.ceil(dataCells.offset / dataCells.limit) + 1}
+          onChange={handlePage}
       />
       <DialogImage
         open={dataDialog.type === 'image'}

diff --git a/frontend/src/components/Database/DatabaseExperiments.tsx b/frontend/src/components/Database/DatabaseExperiments.tsx
@@ -524,8 +524,8 @@ const DatabaseExperiments = ({ user, cellPath }: DatabaseProps) => {
       />
       <Pagination
         sx={{ marginTop: 2 }}
-        count={dataExperiments.total}
-        page={dataParams.offset + 1}
+        count={Math.ceil(dataExperiments.total / dataExperiments.limit)}
+        page={Math.ceil(dataExperiments.offset / dataExperiments.limit) + 1}
         onChange={handlePage}
       />
       <DialogImage

diff --git a/frontend/src/pages/AccountManager/index.tsx b/frontend/src/pages/AccountManager/index.tsx
@@ -261,12 +261,15 @@ const AccountManager = () => {
         }}
         onFilterModelChange={handleFilter as any}
       />
-      <Pagination
-        sx={{ marginTop: 2 }}
-        count={listUser?.total || 0}
-        page={(listUser?.offset || 0) + 1 }
-        onChange={handlePage}
-      />
+      {
+        listUser ?
+          <Pagination
+            sx={{ marginTop: 2 }}
+            count={Math.ceil(listUser.total / listUser.limit)}
+            page={Math.ceil(listUser.offset / listUser.limit) + 1}
+            onChange={handlePage}
+          /> : null
+      }
       {
         loading ? <Loading /> : null
       }

diff --git a/frontend/src/pages/Workspace/index.tsx b/frontend/src/pages/Workspace/index.tsx
@@ -469,8 +469,8 @@ const Workspaces = () => {
       }
       <Pagination
         sx={{ marginTop: 2 }}
-        count={data.total}
-        page={data.offset + 1}
+        count={Math.ceil(data.total / data.limit)}
+        page={Math.ceil(data.offset / data.limit) + 1}
         onChange={handlePage}
       />
       {open.share ? (