Pagination Fix

Reversion

Approved-by: Allan Carr

client/src/components/jobs-list/jobs-list.component.jsx

@@ -29,7 +29,7 @@ export function JobsList({bodyshop,}) {
     const search = queryString.parse(useLocation().search);
     const [openSearchResults, setOpenSearchResults] = useState([]);
     const [searchLoading, setSearchLoading] = useState(false);
-    const {page, selected, sortorder, sortcolumn} = search;
+    const {page, selected, sortorder, sortcolumn,statusFilters} = search;
 
     const selectedBreakpoint = Object.entries(Grid.useBreakpoint())
         .filter((screen) => !!screen[1])
@@ -39,7 +39,7 @@ export function JobsList({bodyshop,}) {
         variables: {
             offset: page ? (page - 1) * pageLimit : 0,
             limit: pageLimit,
-            statuses: bodyshop.md_ro_statuses.active_statuses || ["Open", "Open*"],
+            statusFilters: statusFilters ? JSON.parse(statusFilters) : bodyshop.md_ro_statuses.active_statuses || ["Open", "Open*"],
             order: [
                 {
                     [sortcolumn || "ro_number"]:
@@ -67,9 +67,6 @@ export function JobsList({bodyshop,}) {
     const jobs = data?.jobs || [];
 
     const handleTableChange = (pagination, filters, sorter) => {
-        // TODO: Is this needed?
-        setState({...state, filteredInfo: filters});
-
         search.page = pagination.current;
         search.sortcolumn = sorter.column && sorter.column.key;
         search.sortorder = sorter.order;
@@ -205,19 +202,13 @@ export function JobsList({bodyshop,}) {
             sorter: true,
             sortOrder:
                 sortcolumn === "status" && sortorder,
-            filters:
-                (jobs &&
-                    jobs
-                        .map((j) => j.status)
-                        .filter(onlyUnique)
-                        .map((s) => {
-                            return {
-                                text: s || "No Status*",
-                                value: [s],
-                            };
-                        })) ||
-                [],
+            filters:bodyshop.md_ro_statuses.statuses.map((s) => {
+                return { text: s, value: [s] };
+            }),
             onFilter: (value, record) => value.includes(record.status),
+            render: (text, record) => {
+                return record.status || t("general.labels.na");
+            },
         },
         {
             title: t("jobs.fields.vehicle"),
@@ -270,19 +261,20 @@ export function JobsList({bodyshop,}) {
             dataIndex: "ins_co_nm",
             key: "ins_co_nm",
             ellipsis: true,
-            filters:
-                (jobs &&
-                    jobs
-                        .map((j) => j.ins_co_nm)
-                        .filter(onlyUnique)
-                        .map((s) => {
-                            return {
-                                text: s,
-                                value: [s],
-                            };
-                        })) ||
-                [],
-            onFilter: (value, record) => value.includes(record.ins_co_nm),
+            // TODO: Restore Filters?
+            // filters:
+            //     (jobs &&
+            //         jobs
+            //             .map((j) => j.ins_co_nm)
+            //             .filter(onlyUnique)
+            //             .map((s) => {
+            //                 return {
+            //                     text: s,
+            //                     value: [s],
+            //                 };
+            //             })) ||
+            //     [],
+            // onFilter: (value, record) => value.includes(record.ins_co_nm),
             responsive: ["md"],
         },
         {
@@ -304,23 +296,24 @@ export function JobsList({bodyshop,}) {
             key: "jobs.labels.estimator",
             ellipsis: true,
             responsive: ["xl"],
-            filterSearch: true,
-            filters:
-                (jobs &&
-                    jobs
-                        .map((j) => `${j.est_ct_fn || ""} ${j.est_ct_ln || ""}`.trim())
-                        .filter(onlyUnique)
-                        .map((s) => {
-                            return {
-                                text: s || "N/A",
-                                value: [s],
-                            };
-                        })) ||
-                [],
-            onFilter: (value, record) =>
-                value.includes(
-                    `${record.est_ct_fn || ""} ${record.est_ct_ln || ""}`.trim()
-                ),
+            // TODO Restore Filters?
+            // filterSearch: true,
+            // filters:
+            //     (jobs &&
+            //         jobs
+            //             .map((j) => `${j.est_ct_fn || ""} ${j.est_ct_ln || ""}`.trim())
+            //             .filter(onlyUnique)
+            //             .map((s) => {
+            //                 return {
+            //                     text: s || "N/A",
+            //                     value: [s],
+            //                 };
+            //             })) ||
+            //     [],
+            // onFilter: (value, record) =>
+            //     value.includes(
+            //         `${record.est_ct_fn || ""} ${record.est_ct_ln || ""}`.trim()
+            //     ),
             render: (text, record) =>
                 `${record.est_ct_fn || ""} ${record.est_ct_ln || ""}`.trim(),
         },

client/src/graphql/jobs.queries.js

@@ -5,13 +5,13 @@ export const QUERY_ALL_ACTIVE_JOBS_PAGINATED = gql`
     $offset: Int
     $limit: Int
     $order: [jobs_order_by!]
-    $statuses: [String!]!, 
+    $statusFilters: [String!]!, 
     $isConverted: Boolean
   ) {
     jobs(
       offset: $offset
       limit: $limit
-      where: { status: { _in: $statuses }, converted: { _eq: $isConverted } }
+      where: { status: { _in: $statusFilters }, converted: { _eq: $isConverted } }
       order_by: $order
     ) {
       iouparent
@@ -52,7 +52,7 @@ export const QUERY_ALL_ACTIVE_JOBS_PAGINATED = gql`
       est_ct_fn
       est_ct_ln
     }
-    jobs_aggregate(where: { status: { _in: $statuses } }) {
+    jobs_aggregate(where: { status: { _in: $statusFilters } }) {
       aggregate {
         count(distinct: true)
       }

client/src/utils/config.js

@@ -1,4 +1,4 @@
 
 // Sometimes referred to as PageSize, this variable controls the amount of records
 // to show on one page during pagination.
-export const pageLimit = 50;
+export const pageLimit = 10;