Minor fixes: Job detail card schedule, job list search, job list sorting.

client/src/components/job-detail-cards/job-detail-cards.component.jsx

@@ -17,6 +17,7 @@ import JobDetailCardsNotesComponent from "./job-detail-cards.notes.component";
 import JobDetailCardsPartsComponent from "./job-detail-cards.parts.component";
 import "./job-detail-cards.styles.scss";
 import JobDetailCardsTotalsComponent from "./job-detail-cards.totals.component";
+import ScheduleJobModalContainer from "../schedule-job-modal/schedule-job-modal.container";
 
 export default function JobDetailCards({ selectedJob }) {
   const { loading, error, data, refetch } = useQuery(QUERY_JOB_CARD_DETAILS, {
@@ -25,29 +26,35 @@ export default function JobDetailCards({ selectedJob }) {
     skip: !selectedJob
   });
   const [noteModalVisible, setNoteModalVisible] = useState(false);
+  const scheduleModalState = useState(false);
   const { t } = useTranslation();
 
   if (!selectedJob) {
     return <div>{t("jobs.errors.nojobselected")}</div>;
   }
   if (loading) return <LoadingSpinner />;
-  if (error) return <AlertComponent message={error.message} type="error" />;
+  if (error) return <AlertComponent message={error.message} type='error' />;
 
   return (
-    <div className="job-cards-container">
+    <div className='job-cards-container'>
       <NoteUpsertModal
         jobId={data.jobs_by_pk.id}
         visible={noteModalVisible}
         changeVisibility={setNoteModalVisible}
         refetch={refetch}
       />
+      <ScheduleJobModalContainer
+        scheduleModalState={scheduleModalState}
+        jobId={data.jobs_by_pk.id}
+        refetch={refetch}
+      />
       <PageHeader
         ghost={false}
         onBack={() => window.history.back()}
         tags={
-          <span key="job-status">
+          <span key='job-status'>
             {data.jobs_by_pk.status ? (
-              <Tag color="blue">{data.jobs_by_pk.status}</Tag>
+              <Tag color='blue'>{data.jobs_by_pk.status}</Tag>
             ) : null}
           </span>
         }
@@ -65,35 +72,40 @@ export default function JobDetailCards({ selectedJob }) {
           )
         }
         extra={[
+          <Button
+            key='schedule'
+            //TODO Enabled logic based on status.
+            onClick={() => {
+              scheduleModalState[1](true);
+            }}>
+            {t("jobs.actions.schedule")}
+          </Button>,
           <Link
-            key="documents"
-            to={`/manage/jobs/${data.jobs_by_pk.id}#documents`}
-          >
+            key='documents'
+            to={`/manage/jobs/${data.jobs_by_pk.id}#documents`}>
             <Button>
-              <Icon type="file-image" />
+              <Icon type='file-image' />
               {t("jobs.actions.addDocuments")}
             </Button>
           </Link>,
-          <Button key="printing">
-            <Icon type="printer" />
+          <Button key='printing'>
+            <Icon type='printer' />
             {t("jobs.actions.printCenter")}
           </Button>,
           <Button
-            key="notes"
-            actiontype="addNote"
+            key='notes'
+            actiontype='addNote'
             onClick={() => {
               setNoteModalVisible(!noteModalVisible);
-            }}
-          >
-            <Icon type="edit" />
+            }}>
+            <Icon type='edit' />
             {t("jobs.actions.addNote")}
           </Button>,
-          <Button key="postinvoices">
-            <Icon type="shopping-cart" />
+          <Button key='postinvoices'>
+            <Icon type='shopping-cart' />
             {t("jobs.actions.postInvoices")}
           </Button>
-        ]}
-      >
+        ]}>
         {
           //   loading ? (
           //   <LoadingSkeleton />
@@ -114,7 +126,7 @@ export default function JobDetailCards({ selectedJob }) {
           // )
         }
 
-        <section className="job-cards">
+        <section className='job-cards'>
           <JobDetailCardsCustomerComponent
             loading={loading}
             data={data ? data.jobs_by_pk : null}

client/src/components/job-detail-cards/job-detail-cards.customer.component.jsx

@@ -14,7 +14,10 @@ export default function JobDetailCardsCustomerComponent({ loading, data }) {
       extraLink={data && data.owner ? `/manage/owners/${data.owner.id}` : null}>
       {data ? (
         <span>
-          <div>{`${data.ownr_fn || ""} ${data.ownr_ln || ""}`}</div>
+          <div>
+            <Link to={`/manage/owners/${data.owner.id}`}>{`${data.ownr_fn ||
+              ""} ${data.ownr_ln || ""}`}</Link>
+          </div>
           <div>
             {t("jobs.fields.phoneshort")}:
             <PhoneFormatter>{`${data.ownr_ph1 ||