Move PageSize (PageLimit) to an external configuration file.

2023-11-29 13:37:02 -05:00
parent d7f52d864a
commit ec2519eae4
27 changed files with 63 additions and 37 deletions
--- a/client/src/components/accounting-payables-table/accounting-payables-table.component.jsx
+++ b/client/src/components/accounting-payables-table/accounting-payables-table.component.jsx
@@ -15,6 +15,7 @@ import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import ExportLogsCountDisplay from "../export-logs-count-display/export-logs-count-display.component";
 import BillMarkSelectedExported from "../payable-mark-selected-exported/payable-mark-selected-exported.component";
+import {pageLimit} from "../../utils/config";

 const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop,
@@ -210,7 +211,7 @@ export function AccountingPayablesTableComponent({
      <Table
        loading={loading}
        dataSource={dataSource}
-        pagination={{ position: "top", pageSize: 50 }}
+        pagination={{ position: "top", pageSize: pageLimit }}
        columns={columns}
        rowKey="id"
        onChange={handleTableChange}
--- a/client/src/components/accounting-payments-table/accounting-payments-table.component.jsx
+++ b/client/src/components/accounting-payments-table/accounting-payments-table.component.jsx
@@ -15,6 +15,7 @@ import PaymentExportButton from "../payment-export-button/payment-export-button.
 import PaymentMarkSelectedExported from "../payment-mark-selected-exported/payment-mark-selected-exported.component";
 import PaymentsExportAllButton from "../payments-export-all-button/payments-export-all-button.component";
 import QboAuthorizeComponent from "../qbo-authorize/qbo-authorize.component";
+import {pageLimit} from "../../utils/config";

 const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop,
@@ -209,7 +210,7 @@ export function AccountingPayablesTableComponent({
      <Table
        loading={loading}
        dataSource={dataSource}
-        pagination={{ position: "top", pageSize: 50 }}
+        pagination={{ position: "top", pageSize: pageLimit }}
        columns={columns}
        rowKey="id"
        onChange={handleTableChange}
--- a/client/src/components/audit-trail-list/audit-trail-list.component.jsx
+++ b/client/src/components/audit-trail-list/audit-trail-list.component.jsx
@@ -4,6 +4,7 @@ import { alphaSort } from "../../utils/sorters";
 import { DateTimeFormatter } from "../../utils/DateFormatter";
 import { useTranslation } from "react-i18next";
 import AuditTrailValuesComponent from "../audit-trail-values/audit-trail-values.component";
+import {pageLimit} from "../../utils/config";

 export default function AuditTrailListComponent({ loading, data }) {
  const [state, setState] = useState({
@@ -74,7 +75,7 @@ export default function AuditTrailListComponent({ loading, data }) {
    <Table
      {...formItemLayout}
      loading={loading}
-      pagination={{ position: "top", defaultPageSize: 25 }}
+      pagination={{ position: "top", defaultPageSize: pageLimit }}
      columns={columns}
      rowKey="id"
      dataSource={data}
--- a/client/src/components/audit-trail-list/email-audit-trail-list.component.jsx
+++ b/client/src/components/audit-trail-list/email-audit-trail-list.component.jsx
@@ -3,6 +3,7 @@ import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { DateTimeFormatter } from "../../utils/DateFormatter";
 import { alphaSort } from "../../utils/sorters";
+import {pageLimit} from "../../utils/config";

 export default function EmailAuditTrailListComponent({ loading, data }) {
  const [state, setState] = useState({
@@ -53,7 +54,7 @@ export default function EmailAuditTrailListComponent({ loading, data }) {
    <Table
      {...formItemLayout}
      loading={loading}
-      pagination={{ position: "top", defaultPageSize: 25 }}
+      pagination={{ position: "top", defaultPageSize: pageLimit }}
      columns={columns}
      rowKey="id"
      dataSource={data}
--- a/client/src/components/contract-jobs/contract-jobs.component.jsx
+++ b/client/src/components/contract-jobs/contract-jobs.component.jsx
@@ -4,6 +4,7 @@ import { useTranslation } from "react-i18next";
 import { alphaSort } from "../../utils/sorters";
 import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import {pageLimit} from "../../utils/config";

 export default function ContractsJobsComponent({
  loading,
@@ -175,7 +176,7 @@ export default function ContractsJobsComponent({
        loading={loading}
        pagination={{
          position: "top",
-          defaultPageSize: 10,
+          defaultPageSize: pageLimit,
          defaultCurrent: defaultCurrent,
        }}
        columns={columns}
--- a/client/src/components/contracts-list/contracts-list.component.jsx
+++ b/client/src/components/contracts-list/contracts-list.component.jsx
@@ -13,6 +13,7 @@ import moment from "moment";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import {pageLimit} from "../../utils/config";

 const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop,
@@ -209,7 +210,7 @@ export function ContractsList({
        }}
        pagination={{
          position: "top",
-          pageSize: 25,
+          pageSize: pageLimit,
          current: parseInt(page || 1),
          total: total,
        }}
--- a/client/src/components/courtesy-car-contract-list/courtesy-car-contract-list.component.jsx
+++ b/client/src/components/courtesy-car-contract-list/courtesy-car-contract-list.component.jsx
@@ -5,6 +5,7 @@ import { useTranslation } from "react-i18next";
 import { Link, useHistory, useLocation } from "react-router-dom";
 import { DateFormatter } from "../../utils/DateFormatter";
 import { alphaSort } from "../../utils/sorters";
+import {pageLimit} from "../../utils/config";

 export default function CourtesyCarContractListComponent({
  contracts,
@@ -89,7 +90,7 @@ export default function CourtesyCarContractListComponent({
        scroll={{ x: true }}
        pagination={{
          position: "top",
-          pageSize: 25,
+          pageSize: pageLimit,
          current: parseInt(page || 1),
          total: totalContracts,
        }}
--- a/client/src/components/csi-response-list-paginated/csi-response-list-paginated.component.jsx
+++ b/client/src/components/csi-response-list-paginated/csi-response-list-paginated.component.jsx
@@ -7,6 +7,7 @@ import { Link, useHistory, useLocation } from "react-router-dom";
 import { DateFormatter } from "../../utils/DateFormatter";
 import { alphaSort } from "../../utils/sorters";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import {pageLimit} from "../../utils/config";

 export default function CsiResponseListPaginated({
  refetch,
@@ -106,7 +107,7 @@ export default function CsiResponseListPaginated({
        loading={loading}
        pagination={{
          position: "top",
-          pageSize: 25,
+          pageSize: pageLimit,
          current: parseInt(page || 1),
          total: total,
        }}
--- a/client/src/components/dashboard-components/monthly-job-costing/monthly-job-costing.component.jsx
+++ b/client/src/components/dashboard-components/monthly-job-costing/monthly-job-costing.component.jsx
@@ -6,6 +6,7 @@ import { alphaSort } from "../../../utils/sorters";
 import LoadingSkeleton from "../../loading-skeleton/loading-skeleton.component";
 import Dinero from "dinero.js";
 import DashboardRefreshRequired from "../refresh-required.component";
+import {pageLimit} from "../../../utils/config";

 export default function DashboardMonthlyJobCosting({ data, ...cardProps }) {
  const { t } = useTranslation();
@@ -118,7 +119,7 @@ export default function DashboardMonthlyJobCosting({ data, ...cardProps }) {
        <div style={{ height: "100%" }}>
          <Table
            onChange={handleTableChange}
-            pagination={{ position: "top", defaultPageSize: 50 }}
+            pagination={{ position: "top", defaultPageSize: pageLimit }}
            columns={columns}
            scroll={{ x: true, y: "calc(100% - 4em)" }}
            rowKey="id"
--- a/client/src/components/dashboard-components/scheduled-in-today/scheduled-in-today.component.jsx
+++ b/client/src/components/dashboard-components/scheduled-in-today/scheduled-in-today.component.jsx
@@ -11,6 +11,7 @@ import { Link } from "react-router-dom";
 import ChatOpenButton from "../../chat-open-button/chat-open-button.component";
 import OwnerNameDisplay from "../../owner-name-display/owner-name-display.component";
 import DashboardRefreshRequired from "../refresh-required.component";
+import {pageLimit} from "../../../utils/config";

 export default function DashboardScheduledInToday({ data, ...cardProps }) {
  const { t } = useTranslation();
@@ -195,7 +196,7 @@ export default function DashboardScheduledInToday({ data, ...cardProps }) {
      <div style={{ height: "100%" }}>
        <Table
          onChange={handleTableChange}
-          pagination={{ position: "top", defaultPageSize: 50 }}
+          pagination={{ position: "top", defaultPageSize: pageLimit }}
          columns={columns}
          scroll={{ x: true, y: "calc(100% - 2em)" }}
          rowKey="id"
--- a/client/src/components/dashboard-components/scheduled-out-today/scheduled-out-today.component.jsx
+++ b/client/src/components/dashboard-components/scheduled-out-today/scheduled-out-today.component.jsx
@@ -11,6 +11,7 @@ import { Link } from "react-router-dom";
 import ChatOpenButton from "../../chat-open-button/chat-open-button.component";
 import OwnerNameDisplay from "../../owner-name-display/owner-name-display.component";
 import DashboardRefreshRequired from "../refresh-required.component";
+import {pageLimit} from "../../../utils/config";

 export default function DashboardScheduledOutToday({ data, ...cardProps }) {
  const { t } = useTranslation();
@@ -165,7 +166,7 @@ export default function DashboardScheduledOutToday({ data, ...cardProps }) {
      <div style={{ height: "100%" }}>
        <Table
          onChange={handleTableChange}
-          pagination={{ position: "top", defaultPageSize: 50 }}
+          pagination={{ position: "top", defaultPageSize: pageLimit }}
          columns={columns}
          scroll={{ x: true, y: "calc(100% - 2em)" }}
          rowKey="id"
--- a/client/src/components/dms-allocations-summary-ap/dms-allocations-summary-ap.component.jsx
+++ b/client/src/components/dms-allocations-summary-ap/dms-allocations-summary-ap.component.jsx
@@ -5,6 +5,7 @@ import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import {pageLimit} from "../../utils/config";

 const mapStateToProps = createStructuredSelector({
  //currentUser: selectCurrentUser
@@ -117,7 +118,7 @@ export function DmsAllocationsSummaryAp({ socket, bodyshop, billids, title }) {
      }
    >
      <Table
-        pagination={{ position: "top", defaultPageSize: 50 }}
+        pagination={{ position: "top", defaultPageSize: pageLimit }}
        columns={columns}
        rowKey={(record) => `${record.InvoiceNumber}${record.Account}`}
        dataSource={allocationsSummary}
--- a/client/src/components/dms-allocations-summary/dms-allocations-summary.component.jsx
+++ b/client/src/components/dms-allocations-summary/dms-allocations-summary.component.jsx
@@ -6,6 +6,7 @@ import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import Dinero from "dinero.js";
 import { SyncOutlined } from "@ant-design/icons";
+import {pageLimit} from "../../utils/config";

 const mapStateToProps = createStructuredSelector({
  //currentUser: selectCurrentUser
@@ -94,7 +95,7 @@ export function DmsAllocationsSummary({ socket, bodyshop, jobId, title }) {
        <Alert type="warning" message={t("jobs.labels.dms.disablebillwip")} />
      )}
      <Table
-        pagination={{ position: "top", defaultPageSize: 50 }}
+        pagination={{ position: "top", defaultPageSize: pageLimit }}
        columns={columns}
        rowKey="center"
        dataSource={allocationsSummary}
--- a/client/src/components/inventory-list/inventory-list.component.jsx
+++ b/client/src/components/inventory-list/inventory-list.component.jsx
@@ -11,6 +11,7 @@ import { selectBodyshop } from "../../redux/user/user.selectors";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import InventoryBillRo from "../inventory-bill-ro/inventory-bill-ro.component";
 import InventoryLineDelete from "../inventory-line-delete/inventory-line-delete.component";
+import {pageLimit} from "../../utils/config";
 const mapStateToProps = createStructuredSelector({
  //currentUser: selectCurrentUser
  bodyshop: selectBodyshop,
@@ -213,7 +214,7 @@ export function JobsList({
        loading={loading}
        pagination={{
          position: "top",
-          pageSize: 25,
+          pageSize: pageLimit,
          current: parseInt(page || 1),
          total: total,
        }}
--- a/client/src/components/job-costing-parts-table/job-costing-parts-table.component.jsx
+++ b/client/src/components/job-costing-parts-table/job-costing-parts-table.component.jsx
@@ -3,6 +3,7 @@ import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { alphaSort } from "../../utils/sorters";
 import Dinero from "dinero.js";
+import {pageLimit} from "../../utils/config";
 export default function JobCostingPartsTable({ data, summaryData }) {
  const [searchText, setSearchText] = useState("");
  const [state, setState] = useState({
@@ -98,7 +99,7 @@ export default function JobCostingPartsTable({ data, summaryData }) {
          x: "50%", //y: "40rem"
        }}
        onChange={handleTableChange}
-        pagination={{ position: "top", defaultPageSize: 50 }}
+        pagination={{ position: "top", defaultPageSize: pageLimit }}
        columns={columns}
        rowKey="id"
        dataSource={filteredData}
--- a/client/src/components/jobs-list-paginated/jobs-list-paginated.component.jsx
+++ b/client/src/components/jobs-list-paginated/jobs-list-paginated.component.jsx
@@ -12,6 +12,7 @@ import { selectBodyshop } from "../../redux/user/user.selectors";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import StartChatButton from "../chat-open-button/chat-open-button.component";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import {pageLimit} from "../../utils/config";
 const mapStateToProps = createStructuredSelector({
  //currentUser: selectCurrentUser
  bodyshop: selectBodyshop,
@@ -43,7 +44,6 @@ export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
        </Link>
      ),
    },
-
    {
      title: t("jobs.fields.owner"),
      dataIndex: "ownr_ln",
@@ -125,7 +125,6 @@ export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
      title: t("vehicles.fields.plate_no"),
      dataIndex: "plate_no",
      key: "plate_no",
-
      ellipsis: true,
      sorter: true, //(a, b) => alphaSort(a.plate_no, b.plate_no),
      sortOrder: sortcolumn === "plate_no" && sortorder,
@@ -137,7 +136,6 @@ export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
      title: t("jobs.fields.clm_no"),
      dataIndex: "clm_no",
      key: "clm_no",
-
      ellipsis: true,
      sorter: true, //(a, b) => alphaSort(a.clm_no, b.clm_no),
      sortOrder: sortcolumn === "clm_no" && sortorder,
@@ -259,11 +257,11 @@ export function JobsList({ bodyshop, refetch, loading, jobs, total }) {
        pagination={
          search?.search
            ? {
-                pageSize: 25,
+                pageSize: pageLimit,
                showSizeChanger: false,
              }
            : {
-                pageSize: 25,
+                pageSize: pageLimit,
                current: parseInt(page || 1),
                total: total,
                showSizeChanger: false,
--- a/client/src/components/jobs-list/jobs-list.component.jsx
+++ b/client/src/components/jobs-list/jobs-list.component.jsx
@@ -14,7 +14,7 @@ import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import AlertComponent from "../alert/alert.component";
 import ChatOpenButton from "../chat-open-button/chat-open-button.component";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
-import _ from "lodash";
+import {flattenDeep} from "lodash";
 import { pageLimit } from '../../utils/config';
 import axios from "axios";

@@ -75,7 +75,7 @@ export function JobsList({bodyshop,}) {
        search.sortorder = sorter.order;

        if (filters.status) {
-            search.statusFilters = JSON.stringify(_.flattenDeep(filters.status));
+            search.statusFilters = JSON.stringify(flattenDeep(filters.status));
        } else {
            delete search.statusFilters;
        }
@@ -85,7 +85,9 @@ export function JobsList({bodyshop,}) {

    useEffect(() => {
        if (search.search && search.search.trim() !== "") {
-            searchJobs();
+            searchJobs().catch(e => {
+                console.error('Something went wrong searching for jobs in the job-list component', e);
+            });
        }
        // eslint-disable-next-line react-hooks/exhaustive-deps
    }, []);
@@ -217,7 +219,6 @@ export function JobsList({bodyshop,}) {
                [],
            onFilter: (value, record) => value.includes(record.status),
        },
-
        {
            title: t("jobs.fields.vehicle"),
            dataIndex: "vehicle",
--- a/client/src/components/jobs-ready-list/jobs-ready-list.component.jsx
+++ b/client/src/components/jobs-ready-list/jobs-ready-list.component.jsx
@@ -20,6 +20,7 @@ import { alphaSort } from "../../utils/sorters";
 import AlertComponent from "../alert/alert.component";
 import ChatOpenButton from "../chat-open-button/chat-open-button.component";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import {pageLimit} from "../../utils/config";

 const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop,
@@ -377,7 +378,7 @@ export function JobsReadyList({ bodyshop }) {
    >
      <Table
        loading={loading}
-        pagination={{ defaultPageSize: 50 }}
+        pagination={{ defaultPageSize: pageLimit }}
        columns={columns}
        rowKey="id"
        dataSource={jobs}
--- a/client/src/components/owners-list/owners-list.component.jsx
+++ b/client/src/components/owners-list/owners-list.component.jsx
@@ -6,6 +6,7 @@ import { useTranslation } from "react-i18next";
 import { Link, useHistory, useLocation } from "react-router-dom";
 import PhoneFormatter from "../../utils/PhoneFormatter";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
+import {pageLimit} from "../../utils/config";

 export default function OwnersListComponent({
  loading,
@@ -122,7 +123,7 @@ export default function OwnersListComponent({
        loading={loading}
        pagination={{
          position: "top",
-          pageSize: 25,
+          pageSize: pageLimit,
          current: parseInt(page || 1),
          total: total,
        }}
--- a/client/src/components/payments-list-paginated/payment-list-paginated.component.jsx
+++ b/client/src/components/payments-list-paginated/payment-list-paginated.component.jsx
@@ -18,6 +18,7 @@ import { alphaSort } from "../../utils/sorters";
 import CaBcEtfTableModalContainer from "../ca-bc-etf-table-modal/ca-bc-etf-table-modal.container";
 import OwnerNameDisplay from "../owner-name-display/owner-name-display.component";
 import PrintWrapperComponent from "../print-wrapper/print-wrapper.component";
+import {pageLimit} from "../../utils/config";

 const mapStateToProps = createStructuredSelector({
  //currentUser: selectCurrentUser
@@ -282,11 +283,11 @@ export function PaymentsListPaginated({
        pagination={
          search?.search
            ? {
-                pageSize: 25,
+                pageSize: pageLimit,
                showSizeChanger: false,
              }
            : {
-                pageSize: 25,
+                pageSize: pageLimit,
                current: parseInt(page || 1),
                total: total,
                showSizeChanger: false,
--- a/client/src/components/scoreboard-jobs-list/scoreboard-jobs-list.component.jsx
+++ b/client/src/components/scoreboard-jobs-list/scoreboard-jobs-list.component.jsx
@@ -10,13 +10,14 @@ import OwnerNameDisplay from "../owner-name-display/owner-name-display.component
 import ScoreboardEntryEdit from "../scoreboard-entry-edit/scoreboard-entry-edit.component";
 import ScoreboardRemoveButton from "../scoreboard-remove-button/scorebard-remove-button.component";
 import { SyncOutlined } from "@ant-design/icons";
+import {pageLimit} from "../../utils/config";
 export default function ScoreboardJobsList({ scoreBoardlist }) {
  const { t } = useTranslation();
  const [state, setState] = useState({
    visible: false,
    search: "",
    current: 1,
-    pageSize: 10,
+    pageSize: pageLimit,
  });

  const { loading, error, data, refetch } = useQuery(
@@ -148,7 +149,7 @@ export default function ScoreboardJobsList({ scoreBoardlist }) {
            }
            pagination={{
              position: "top",
-              pageSize: state.pageSize || 10,
+              pageSize: state.pageSize || pageLimit,
              current: state.current || 1,
              total: data ? data.scoreboard_aggregate.aggregate.count : 0,
            }}
--- a/client/src/components/vehicles-list/vehicles-list.component.jsx
+++ b/client/src/components/vehicles-list/vehicles-list.component.jsx
@@ -5,6 +5,7 @@ import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { Link, useHistory, useLocation } from "react-router-dom";
 import VehicleVinDisplay from "../vehicle-vin-display/vehicle-vin-display.component";
+import {pageLimit} from "../../utils/config";
 export default function VehiclesListComponent({
  loading,
  vehicles,
@@ -106,7 +107,7 @@ export default function VehiclesListComponent({
        loading={loading}
        pagination={{
          position: "top",
-          pageSize: 25,
+          pageSize: pageLimit,
          current: parseInt(page || 1),
          total: total,
        }}
--- a/client/src/pages/bills/bills.page.component.jsx
+++ b/client/src/pages/bills/bills.page.component.jsx
@@ -14,6 +14,7 @@ import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { DateFormatter } from "../../utils/DateFormatter";
 import { TemplateList } from "../../utils/TemplateConstants";
 import { alphaSort, dateSort } from "../../utils/sorters";
+import {pageLimit} from "../../utils/config";

 const mapDispatchToProps = (dispatch) => ({
  setPartsOrderContext: (context) =>
@@ -295,11 +296,11 @@ export function BillsListPage({
        pagination={
          search?.search
            ? {
-                pageSize: 25,
+                pageSize: pageLimit,
                showSizeChanger: false,
              }
            : {
-                pageSize: 25,
+                pageSize: pageLimit,
                current: parseInt(page || 1),
                total: total,
                showSizeChanger: false,
--- a/client/src/pages/export-logs/export-logs.page.component.jsx
+++ b/client/src/pages/export-logs/export-logs.page.component.jsx
@@ -12,6 +12,7 @@ import AlertComponent from "../../components/alert/alert.component";
 import { QUERY_EXPORT_LOG_PAGINATED } from "../../graphql/accounting.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import { DateTimeFormatter } from "../../utils/DateFormatter";
+import {pageLimit} from "../../utils/config";

 const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop,
@@ -178,7 +179,7 @@ export function ExportLogsPageComponent({ bodyshop }) {
        loading={loading}
        pagination={{
          position: "top",
-          pageSize: 25,
+          pageSize: pageLimit,
          current: parseInt(page || 1),
          total: data && data.search_exportlog_aggregate.aggregate.count,
        }}
--- a/client/src/pages/parts-queue/parts-queue.page.component.jsx
+++ b/client/src/pages/parts-queue/parts-queue.page.component.jsx
@@ -18,6 +18,7 @@ import { selectBodyshop } from "../../redux/user/user.selectors";
 import { DateTimeFormatter, TimeAgoFormatter } from "../../utils/DateFormatter";
 import { alphaSort, dateSort } from "../../utils/sorters";
 import useLocalStorage from "../../utils/useLocalStorage";
+import {pageLimit} from "../../utils/config";

 const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop,
@@ -296,7 +297,7 @@ export function PartsQueuePageComponent({ bodyshop }) {
        loading={loading}
        pagination={{
          position: "top",
-          pageSize: 50,
+          pageSize: pageLimit,
          // current: parseInt(page || 1),
          // total: data && data.jobs_aggregate.aggregate.count,
        }}
--- a/client/src/pages/phonebook/phonebook.page.component.jsx
+++ b/client/src/pages/phonebook/phonebook.page.component.jsx
@@ -17,6 +17,7 @@ import {
 import ChatOpenButton from "../../components/chat-open-button/chat-open-button.component";
 import { alphaSort } from "../../utils/sorters";
 import { HasRbacAccess } from "../../components/rbac-wrapper/rbac-wrapper.component";
+import {pageLimit} from "../../utils/config";

 const mapStateToProps = createStructuredSelector({
  bodyshop: selectBodyshop,
@@ -189,7 +190,7 @@ export function PhonebookPageComponent({ bodyshop, authLevel }) {
        loading={loading}
        pagination={{
          position: "top",
-          pageSize: 25,
+          pageSize: pageLimit,
          current: parseInt(page || 1),
          total: data && data.search_phonebook_aggregate.aggregate.count,
        }}
--- a/client/src/utils/config.js
+++ b/client/src/utils/config.js
@@ -1 +1,4 @@
-export const pageLimit = 10;
+
+// Sometimes referred to as PageSize, this variable controls the amount of records
+// to show on one page during pagination.
+export const pageLimit = 50;