CLEANUP on Jobs page. Now uses search param instead of state.

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

@@ -63,7 +63,6 @@ function JobDetailCards({ selectedJob, setInvoiceEnterContext }) {
       />
       <PageHeader
         ghost={false}
-        onBack={() => window.history.back()}
         tags={
           <span key="job-status">
             {data.jobs_by_pk.status ? (
@@ -96,7 +95,7 @@ function JobDetailCards({ selectedJob, setInvoiceEnterContext }) {
           </Button>,
           <Link
             key="documents"
-            to={`/manage/jobs/${data.jobs_by_pk.id}#documents`}
+            to={`/manage/jobs/${data.jobs_by_pk.id}?documents`}
           >
             <Button>
               <FileImageFilled />

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

@@ -17,7 +17,7 @@ export default function JobDetailCardsNotesComponent({ loading, data }) {
     <CardTemplate
       loading={loading}
       title={t("jobs.labels.cards.notes")}
-      extraLink={`/manage/jobs/${data.id}#notes`}
+      extraLink={`/manage/jobs/${data.id}?notes`}
     >
       {data ? (
         <Container>

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

@@ -7,15 +7,14 @@ import CurrencyFormatter from "../../utils/CurrencyFormatter";
 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 withRouter(function JobsList({
   searchTextState,
   refetch,
   loading,
   jobs,
-  selectedJob,
-  setSelectedJob,
-  history
+  selectedJob
 }) {
   const [state, setState] = useState({
     sortedInfo: {},
@@ -23,7 +22,7 @@ export default withRouter(function JobsList({
   });
 
   const { t } = useTranslation();
-
+  const history = useHistory();
   const setSearchText = searchTextState[1];
   const columns = [
     {
@@ -31,22 +30,18 @@ export default withRouter(function JobsList({
       dataIndex: "ro_number",
       key: "ro_number",
       width: "8%",
-      // onFilter: (value, record) => record.ro_number.includes(value),
-      // filteredValue: state.filteredInfo.text || null,
       sorter: (a, b) =>
         alphaSort(
-          a.ro_number ? a.ro_number : "EST-" + a.est_number,
-          b.ro_number ? b.ro_number : "EST-" + b.est_number
+          a.ro_number ? a.ro_number : a.est_number,
+          b.ro_number ? b.ro_number : b.est_number
         ),
       sortOrder:
         state.sortedInfo.columnKey === "ro_number" && state.sortedInfo.order,
 
       render: (text, record) => (
-        <span>
-          <Link to={"/manage/jobs/" + record.id}>
-            {record.ro_number ? record.ro_number : "EST-" + record.est_number}
-          </Link>
-        </span>
+        <Link to={"/manage/jobs/" + record.id}>
+          {record.ro_number ? record.ro_number : record.est_number}
+        </Link>
       )
     },
     {
@@ -61,10 +56,9 @@ export default withRouter(function JobsList({
       render: (text, record) => {
         return record.owner ? (
           <Link to={"/manage/owners/" + record.owner.id}>
-            {record.ownr_fn} {record.ownr_ln}
+            {`${record.ownr_fn} ${record.ownr_ln}`}
           </Link>
         ) : (
-          // t("jobs.errors.noowner")
           <span>{`${record.ownr_fn} ${record.ownr_ln}`}</span>
         );
       }
@@ -81,9 +75,7 @@ export default withRouter(function JobsList({
             <PhoneFormatter>{record.ownr_ph1}</PhoneFormatter>
             <StartChatButton phone={record.ownr_ph1} />
           </span>
-        ) : (
-          t("general.labels.unknown")
-        );
+        ) : null;
       }
     },
     {
@@ -113,7 +105,8 @@ export default withRouter(function JobsList({
               ""} ${record.v_model_desc || ""}`}
           </Link>
         ) : (
-          t("jobs.errors.novehicle")
+          <span>{`${record.v_model_yr || ""} ${record.v_make_desc ||
+            ""} ${record.v_model_desc || ""}`}</span>
         );
       }
     },
@@ -127,11 +120,7 @@ export default withRouter(function JobsList({
       sortOrder:
         state.sortedInfo.columnKey === "plate_no" && state.sortedInfo.order,
       render: (text, record) => {
-        return record.plate_no ? (
-          <span>{record.plate_no}</span>
-        ) : (
-          t("general.labels.unknown")
-        );
+        return record.plate_no ? record.plate_no : "";
       }
     },
     {
@@ -186,19 +175,12 @@ export default withRouter(function JobsList({
     setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
   };
 
-  // const handleChange = event => {
-  //   const { value } = event.target;
-  //   setState({ ...state, filterinfo: { text: [value] } });
-  // };
-
   const handleOnRowClick = record => {
     if (record) {
       if (record.id) {
-        setSelectedJob(record.id);
-        return;
+        history.push({ search: `selected=${record.id}` });
       }
     }
-    setSelectedJob(null);
   };
 
   return (
@@ -212,7 +194,7 @@ export default withRouter(function JobsList({
                 <SyncOutlined />
               </Button>
               <Input.Search
-                placeholder="Search..."
+                placeholder={t("general.labels.search")}
                 onChange={e => {
                   setSearchText(e.target.value);
                 }}
@@ -226,7 +208,13 @@ export default withRouter(function JobsList({
         columns={columns.map(item => ({ ...item }))}
         rowKey="id"
         dataSource={jobs}
-        rowSelection={{ selectedRowKeys: [selectedJob] }}
+        rowSelection={{
+          onSelect: record => {
+            handleOnRowClick(record);
+          },
+          selectedRowKeys: [selectedJob],
+          type: "radio"
+        }}
         onChange={handleTableChange}
         onRow={(record, rowIndex) => {
           return {