Fixed searching on all jobs page BOD-81

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

@@ -9,14 +9,8 @@ import PhoneFormatter from "../../utils/PhoneFormatter";
 import { alphaSort } from "../../utils/sorters";
 import StartChatButton from "../chat-open-button/chat-open-button.component";
 import { useHistory } from "react-router-dom";
-export default function JobsList({
-  searchTextState,
 
-  refetch,
-  loading,
-  jobs,
-  total,
-}) {
+export default function JobsList({ refetch, loading, jobs, total }) {
   const search = queryString.parse(useLocation().search);
   const { page, sortcolumn, sortorder } = search;
   const history = useHistory();
@@ -26,8 +20,6 @@ export default function JobsList({
   });
 
   const { t } = useTranslation();
-  const setSearchText = searchTextState[1];
-
   const columns = [
     {
       title: t("jobs.fields.ro_number"),
@@ -195,8 +187,9 @@ export default function JobsList({
               </Button>
               <Input.Search
                 placeholder={t("general.labels.search")}
-                onChange={(e) => {
-                  setSearchText(e.target.value);
+                onSearch={(value) => {
+                  search.search = value;
+                  history.push({ search: queryString.stringify(search) });
                 }}
                 enterButton
               />

client/src/graphql/jobs.queries.js

@@ -694,20 +694,21 @@ export const QUERY_ALL_JOB_FIELDS = gql`
 
 export const QUERY_ALL_JOBS_PAGINATED = gql`
   query QUERY_ALL_JOBS_PAGINATED(
+    $search: String
     $offset: Int
     $limit: Int
     $order: [jobs_order_by!]!
   ) {
-    jobs(offset: $offset, limit: $limit, order_by: $order) {
+    search_jobs(
+      args: { search: $search }
+      offset: $offset
+      limit: $limit
+      order_by: $order
+    ) {
       ownr_fn
       ownr_ln
       ownr_ph1
       ownr_ea
-      owner {
-        id
-        allow_text_message
-        preferred_contact
-      }
       plate_no
       plate_st
       v_vin
@@ -743,7 +744,7 @@ export const QUERY_ALL_JOBS_PAGINATED = gql`
       ded_amt
       vehicleid
     }
-    jobs_aggregate {
+    search_jobs_aggregate(args: { search: $search }) {
       aggregate {
         count(distinct: true)
       }

client/src/pages/jobs-all/jobs-all.container.jsx

@@ -20,11 +20,12 @@ const mapDispatchToProps = (dispatch) => ({
 });
 
 export function AllJobs({ bodyshop, setBreadcrumbs }) {
-  const search = queryString.parse(useLocation().search);
-  const { page, sortcolumn, sortorder } = search;
+  const searchParams = queryString.parse(useLocation().search);
+  const { page, sortcolumn, sortorder, search } = searchParams;
 
   const { loading, error, data, refetch } = useQuery(QUERY_ALL_JOBS_PAGINATED, {
     variables: {
+      search: search || "",
       offset: page ? (page - 1) * 25 : 0,
       limit: 25,
       order: [
@@ -45,48 +46,15 @@ export function AllJobs({ bodyshop, setBreadcrumbs }) {
     setBreadcrumbs([{ link: "/manage/jobs", label: t("titles.bc.jobs-all") }]);
   }, [t, setBreadcrumbs]);
 
-  const searchTextState = useState("");
-  const searchText = searchTextState[0];
   if (error) return <AlertComponent message={error.message} type='error' />;
   return (
     <div>
       <JobsListPaginated
-        searchTextState={searchTextState}
         refetch={refetch}
         loading={loading}
-        searchParams={search}
-        total={data ? data.jobs_aggregate.aggregate.count : 0}
-        jobs={
-          data
-            ? searchText === ""
-              ? data.jobs
-              : data.jobs.filter(
-                  (j) =>
-                    (j.ro_number || "")
-                      .toString()
-                      .toLowerCase()
-                      .includes(searchText.toLowerCase()) ||
-                    (j.ownr_fn || "")
-                      .toLowerCase()
-                      .includes(searchText.toLowerCase()) ||
-                    (j.ownr_ln || "")
-                      .toLowerCase()
-                      .includes(searchText.toLowerCase()) ||
-                    (j.clm_no || "")
-                      .toLowerCase()
-                      .includes(searchText.toLowerCase()) ||
-                    (j.plate_no || "")
-                      .toLowerCase()
-                      .includes(searchText.toLowerCase()) ||
-                    (j.v_model_desc || "")
-                      .toLowerCase()
-                      .includes(searchText.toLowerCase()) ||
-                    (j.v_make_desc || "")
-                      .toLowerCase()
-                      .includes(searchText.toLowerCase())
-                )
-            : null
-        }
+        searchParams={searchParams}
+        total={data ? data.search_jobs_aggregate.aggregate.count : 0}
+        jobs={data ? data.search_jobs : []}
       />
     </div>
   );