fix: inconsistance page size of paginated data tables

packages/webapp/src/components/Datatable/DataTable.tsx

@@ -60,7 +60,7 @@ export function DataTable(props) {
 
     // Pagination props.
     initialPageIndex = 0,
-    initialPageSize = 10,
+    initialPageSize = 20,
 
     updateDebounceTime = 200,
     selectionColumnWidth = 42,

packages/webapp/src/containers/Customers/CustomersLanding/CustomersTable.tsx

@@ -136,6 +136,7 @@ function CustomersTable({
         sticky={true}
         spinnerProps={{ size: 30 }}
         pagination={true}
+        initialPageSize={customersTableState.pageSize}
         manualSortBy={true}
         manualPagination={true}
         pagesCount={pagination.pagesCount}

packages/webapp/src/containers/Expenses/ExpensesLanding/ExpenseDataTable.tsx

@@ -20,6 +20,7 @@ import withExpensesActions from './withExpensesActions';
 import withAlertsActions from '@/containers/Alert/withAlertActions';
 import withDrawerActions from '@/containers/Drawer/withDrawerActions';
 import withSettings from '@/containers/Settings/withSettings';
+import withExpenses from './withExpenses';
 
 import { ActionsMenu, useExpensesTableColumns } from './components';
 import { DRAWERS } from '@/constants/drawers';
@@ -39,6 +40,9 @@ function ExpensesDataTable({
 
   // #withSettings
   expensesTableSize,
+
+  // #withExpenses
+  expensesTableState
 }) {
   // Expenses list context.
   const {
@@ -116,6 +120,7 @@ function ExpensesDataTable({
         sticky={true}
         onFetchData={handleFetchData}
         pagination={true}
+        initialPageSize={expensesTableState.pageSize}
         manualSortBy={true}
         manualPagination={true}
         pagesCount={pagination.pagesCount}
@@ -147,4 +152,5 @@ export default compose(
   withSettings(({ expenseSettings }) => ({
     expensesTableSize: expenseSettings?.tableSize,
   })),
+  withExpenses(({ expensesTableState }) => ({ expensesTableState }))
 )(ExpensesDataTable);

packages/webapp/src/containers/Items/ItemsDataTable.tsx

@@ -17,6 +17,7 @@ import withAlertsActions from '@/containers/Alert/withAlertActions';
 import withDialogActions from '@/containers/Dialog/withDialogActions';
 import withDrawerActions from '@/containers/Drawer/withDrawerActions';
 import withSettings from '@/containers/Settings/withSettings';
+import withItems from './withItems';
 
 import { useItemsListContext } from './ItemsListProvider';
 import { useItemsTableColumns, ItemsActionMenuList } from './components';
@@ -43,6 +44,9 @@ function ItemsDataTable({
   // #withSettings
   itemsTableSize,
 
+  // #withItems
+  itemsTableState,
+
   // #ownProps
   tableProps,
 }) {
@@ -137,6 +141,7 @@ function ItemsDataTable({
         sticky={true}
         rowClassNames={rowClassNames}
         pagination={true}
+        initialPageSize={itemsTableState.pageSize}
         manualSortBy={true}
         manualPagination={true}
         pagesCount={pagination.pagesCount}
@@ -174,4 +179,5 @@ export default compose(
   withSettings(({ itemsSettings }) => ({
     itemsTableSize: itemsSettings.tableSize,
   })),
+  withItems(({ itemsTableState }) => ({  itemsTableState }))
 )(ItemsDataTable);

packages/webapp/src/containers/Sales/CreditNotes/CreditNotesLanding/CreditNotesDataTable.tsx

@@ -19,6 +19,7 @@ import withAlertsActions from '@/containers/Alert/withAlertActions';
 import withDrawerActions from '@/containers/Drawer/withDrawerActions';
 import withDialogActions from '@/containers/Dialog/withDialogActions';
 import withSettings from '@/containers/Settings/withSettings';
+import withCreditNotes from './withCreditNotes';
 
 import { useCreditNoteTableColumns, ActionsMenu } from './components';
 import { useCreditNoteListContext } from './CreditNotesListProvider';
@@ -44,6 +45,9 @@ function CreditNotesDataTable({
 
   // #withSettings
   creditNoteTableSize,
+
+  // #withCreditNotes
+  creditNoteTableState
 }) {
   const history = useHistory();
 
@@ -129,6 +133,7 @@ function CreditNotesDataTable({
         noInitialFetch={true}
         sticky={true}
         pagination={true}
+        initialPageSize={creditNoteTableState.pageSize}
         pagesCount={pagination.pagesCount}
         TableLoadingRenderer={TableSkeletonRows}
         TableHeaderSkeletonRenderer={TableSkeletonHeader}
@@ -159,4 +164,5 @@ export default compose(
   withSettings(({ creditNoteSettings }) => ({
     creditNoteTableSize: creditNoteSettings?.tableSize,
   })),
+  withCreditNotes(({ creditNoteTableState }) => ({ creditNoteTableState }))
 )(CreditNotesDataTable);

packages/webapp/src/containers/Sales/Estimates/EstimatesLanding/EstimatesDataTable.tsx

@@ -9,6 +9,7 @@ import withAlertsActions from '@/containers/Alert/withAlertActions';
 import withDrawerActions from '@/containers/Drawer/withDrawerActions';
 import withDialogActions from '@/containers/Dialog/withDialogActions';
 import withSettings from '@/containers/Settings/withSettings';
+import withEstimates from './withEstimates';
 
 import { TABLES } from '@/constants/tables';
 import {
@@ -42,6 +43,9 @@ function EstimatesDataTable({
 
   // #withSettings
   estimatesTableSize,
+
+  // #withEstimates
+  estimatesTableState
 }) {
   const history = useHistory();
 
@@ -141,6 +145,7 @@ function EstimatesDataTable({
         selectionColumn={true}
         sticky={true}
         pagination={true}
+        initialPageSize={estimatesTableState.pageSize}
         manualPagination={true}
         pagesCount={pagination.pagesCount}
         TableLoadingRenderer={TableSkeletonRows}
@@ -174,4 +179,5 @@ export default compose(
   withSettings(({ estimatesSettings }) => ({
     estimatesTableSize: estimatesSettings?.tableSize,
   })),
+  withEstimates(({ estimatesTableState }) => ({ estimatesTableState }))
 )(EstimatesDataTable);

packages/webapp/src/containers/Sales/Invoices/InvoicesLanding/InvoicesDataTable.tsx

@@ -144,6 +144,7 @@ function InvoicesDataTable({
         noInitialFetch={true}
         sticky={true}
         pagination={true}
+        initialPageSize={invoicesTableState.pageSize}
         manualPagination={true}
         pagesCount={pagination.pagesCount}
         autoResetSortBy={false}

packages/webapp/src/containers/Sales/Receipts/ReceiptsLanding/ReceiptsTable.tsx

@@ -130,6 +130,7 @@ function ReceiptsDataTable({
         noInitialFetch={true}
         sticky={true}
         pagination={true}
+        initialPageSize={receiptTableState.pageSize}
         pagesCount={pagination.pagesCount}
         manualPagination={true}
         autoResetSortBy={false}

packages/webapp/src/containers/Vendors/VendorsLanding/VendorsTable.tsx

@@ -137,6 +137,7 @@ function VendorsTable({
         expandable={false}
         sticky={true}
         pagination={true}
+        initialPageSize={vendorsTableState.pageSize}
         manualSortBy={true}
         pagesCount={pagination.pagesCount}
         autoResetSortBy={false}