feat: datatables pagination.

client/src/store/Estimate/estimates.reducer.js

@@ -1,6 +1,8 @@
 import { createReducer } from '@reduxjs/toolkit';
-import { createTableQueryReducers } from 'store/queryReducers';
-import { journalNumberChangedReducer } from 'store/journalNumber.reducer';
+import {
+  journalNumberChangedReducer,
+  createTableQueryReducers,
+} from 'store/journalNumber.reducer';
 
 import t from 'store/types';
 
@@ -9,18 +11,17 @@ const initialState = {
   views: {},
   loading: false,
   tableQuery: {
-    page_size: 5,
+    page_size: 12,
     page: 1,
   },
   currentViewId: -1,
-  
 };
 
 const defaultEstimate = {
   entries: [],
 };
 
-const reducer = createReducer(initialState, {
+export default createReducer(initialState, {
   [t.ESTIMATE_SET]: (state, action) => {
     const { id, estimate } = action.payload;
     const _estimate = state.items[id] || {};
@@ -102,10 +103,9 @@ const reducer = createReducer(initialState, {
   },
 
   ...journalNumberChangedReducer(t.ESTIMATE_NUMBER_CHANGED),
+  ...createTableQueryReducers('ESTIMATES'),
 });
 
-export default createTableQueryReducers('sales_estimates', reducer);
-
 export const getEstimateById = (state, id) => {
   return state.sales_estimates.items[id];
 };

client/src/store/Estimate/estimates.selectors.js

@@ -1,5 +1,5 @@
 import { createSelector } from '@reduxjs/toolkit';
-import { pickItemsFromIds, paginationLocationQuery } from 'store/selectors';
+import { pickItemsFromIds, paginationLocationQuery, defaultPaginationMeta } from 'store/selectors';
 
 const estimateTableQuery = (state) => state.salesEstimates.tableQuery;
 
@@ -14,9 +14,12 @@ const estimateItemsSelector = (state) => state.salesEstimates.items;
 
 const estimatesPageSelector = (state, props, query) => {
   const viewId = state.salesEstimates.currentViewId;
-  return state.salesEstimates.views?.[viewId]?.pages?.[query.page];
+  const currentPageId = state.salesEstimates.views?.[viewId]?.paginationMeta?.page;
+
+  return state.salesEstimates.views?.[viewId]?.pages?.[currentPageId];
 };
 
+// Retrieve estimates table query.
 export const getEstimatesTableQueryFactory = () =>
   createSelector(
     paginationLocationQuery,
@@ -29,6 +32,7 @@ export const getEstimatesTableQueryFactory = () =>
     },
   );
 
+// Retreive estimate results of the current page.
 export const getEstimateCurrentPageFactory = () =>
   createSelector(
     estimatesPageSelector,
@@ -40,12 +44,17 @@ export const getEstimateCurrentPageFactory = () =>
     },
   );
 
+// Retrieve specific estimate by the passed estimate id.
 export const getEstimateByIdFactory = () =>
   createSelector(estimateByIdSelector, (estimate) => {
     return estimate;
   });
 
+// Retrieve estimates pagination meta.
 export const getEstimatesPaginationMetaFactory = () =>
   createSelector(estimatesCurrentViewSelector, (estimateView) => {
-    return estimateView?.paginationMeta || {};
+    return {
+      ...defaultPaginationMeta(),
+      ...(estimateView?.paginationMeta || {}),
+    };
   });

client/src/store/Estimate/estimates.types.js

@@ -3,8 +3,8 @@ export default {
   ESTIMATE_SET: 'ESTIMATE_SET',
   ESTIMATE_DELETE: 'ESTIMATE_DELETE',
   ESTIMATES_BULK_DELETE: 'ESTIMATES_BULK_DELETE',
-  ESTIMATES_SET_CURRENT_VIEW: 'ESTIMATES_SET_CURRENT_VIEW',
-  ESTIMATES_TABLE_QUERIES_ADD: 'ESTIMATES_TABLE_QUERIES_ADD',
+  ESTIMATES_SET_CURRENT_VIEW: 'ESTIMATES/SET_CURRENT_VIEW',
+  ESTIMATES_TABLE_QUERIES_ADD: 'ESTIMATES/TABLE_QUERIES_ADD',
   ESTIMATES_TABLE_LOADING: 'ESTIMATES_TABLE_LOADING',
   ESTIMATES_PAGINATION_SET: 'ESTIMATES_PAGINATION_SET',
   ESTIMATES_PAGE_SET: 'ESTIMATES_PAGE_SET',