Further work on totals testing. Almost accurate now.

client/src/components/jobs-detail-pli/jobs-detail-pli.component.jsx

@@ -1,25 +1,21 @@
 import { Button } from "antd";
 import React from "react";
 import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
 import { setModalContext } from "../../redux/modals/modals.actions";
-import InvoicesListTableComponent from "../invoices-list-table/invoices-list-table.component";
 import AlertComponent from "../alert/alert.component";
+import InvoicesListTableComponent from "../invoices-list-table/invoices-list-table.component";
 
-const mapStateToProps = createStructuredSelector({
-  //currentUser: selectCurrentUser
-});
 const mapDispatchToProps = (dispatch) => ({
   setInvoiceEnterContext: (context) =>
     dispatch(setModalContext({ context: context, modal: "invoiceEnter" })),
 });
-export default connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(function JobsDetailPliComponent({
+
+export function JobsDetailPliComponent({
   setInvoiceEnterContext,
   job,
   invoicesQuery,
+  handleOnRowClick,
+  selectedInvoice,
 }) {
   return (
     <div>
@@ -40,8 +36,13 @@ export default connect(
       ) : null}
       <InvoicesListTableComponent
         loading={invoicesQuery.loading}
+        handleOnRowClick={handleOnRowClick}
+        selectedInvoice={selectedInvoice}
         invoices={invoicesQuery.data ? invoicesQuery.data.invoices : null}
+        refetch={invoicesQuery.refetch}
       />
     </div>
   );
-});
+}
+
+export default connect(null, mapDispatchToProps)(JobsDetailPliComponent);

client/src/components/jobs-detail-pli/jobs-detail-pli.container.jsx

@@ -2,11 +2,35 @@ import React from "react";
 import { useQuery } from "@apollo/react-hooks";
 import JobsDetailPliComponent from "./jobs-detail-pli.component";
 import { QUERY_INVOICES_BY_JOBID } from "../../graphql/invoices.queries";
+import { useHistory, useLocation } from "react-router-dom";
+import queryString from "query-string";
+
 export default function JobsDetailPliContainer({ job }) {
   const invoicesQuery = useQuery(QUERY_INVOICES_BY_JOBID, {
     variables: { jobid: job.id },
-    fetchPolicy: "network-only"
   });
 
-  return <JobsDetailPliComponent job={job} invoicesQuery={invoicesQuery} />;
+  const search = queryString.parse(useLocation().search);
+  const history = useHistory();
+
+  const handleOnRowClick = (record) => {
+    if (record) {
+      if (record.id) {
+        search.invoiceid = record.id;
+        history.push({ search: queryString.stringify(search) });
+      }
+    } else {
+      delete search.invoiceid;
+      history.push({ search: queryString.stringify(search) });
+    }
+  };
+
+  return (
+    <JobsDetailPliComponent
+      job={job}
+      invoicesQuery={invoicesQuery}
+      handleOnRowClick={handleOnRowClick}
+      selectedInvoice={search.invoiceid}
+    />
+  );
 }