From 4e70c6a9b659a4cf97d7b64b4b2062128ff655c4 Mon Sep 17 00:00:00 2001
From: Patrick Fic <snaptsoft@gmail.com>
Date: Thu, 9 Apr 2020 15:29:30 -0700
Subject: [PATCH] Further work on totals testing. Almost accurate now.

---
 bodyshop_translations.babel                   |  25 ++-
 .../invoice-enter-modal.container.jsx         |   9 +-
 .../invoices-list-table.component.jsx         | 156 +++++++++++++++---
 .../job-totals-table/job-totals.utility.js    |  35 ++--
 .../jobs-detail-pli.component.jsx             |  21 +--
 .../jobs-detail-pli.container.jsx             |  28 +++-
 .../jobs-list/jobs-list.component.jsx         |  67 ++++----
 client/src/graphql/invoices.queries.js        |  28 ++++
 client/src/graphql/jobs.queries.js            |   5 +-
 client/src/pages/jobs/jobs.page.jsx           |  10 +-
 client/src/translations/en_us/common.json     |   3 +-
 client/src/translations/es/common.json        |   3 +-
 client/src/translations/fr/common.json        |   3 +-
 jsconfig.json                                 |  11 --
 14 files changed, 297 insertions(+), 107 deletions(-)
 delete mode 100644 jsconfig.json

diff --git a/bodyshop_translations.babel b/bodyshop_translations.babel
index cca38e046..a803a43d4 100644
--- a/bodyshop_translations.babel
+++ b/bodyshop_translations.babel
@@ -1,4 +1,4 @@
-<babeledit_project version="1.2" be_version="2.6.1">
+<babeledit_project be_version="2.6.1" version="1.2">
     <!--
 
     BabelEdit project file
@@ -4807,6 +4807,27 @@
                             <folder_node>
                                 <name>actions</name>
                                 <children>
+                                    <concept_node>
+                                        <name>edit</name>
+                                        <definition_loaded>false</definition_loaded>
+                                        <description></description>
+                                        <comment></comment>
+                                        <default_text></default_text>
+                                        <translations>
+                                            <translation>
+                                                <language>en-US</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>es-MX</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                            <translation>
+                                                <language>fr-CA</language>
+                                                <approved>false</approved>
+                                            </translation>
+                                        </translations>
+                                    </concept_node>
                                     <concept_node>
                                         <name>receive</name>
                                         <definition_loaded>false</definition_loaded>
@@ -5122,7 +5143,7 @@
                                 <name>successes</name>
                                 <children>
                                     <concept_node>
-                                        <name>creating</name>
+                                        <name>created</name>
                                         <definition_loaded>false</definition_loaded>
                                         <description></description>
                                         <comment></comment>
diff --git a/client/src/components/invoice-enter-modal/invoice-enter-modal.container.jsx b/client/src/components/invoice-enter-modal/invoice-enter-modal.container.jsx
index cde7a027b..782eefe4b 100644
--- a/client/src/components/invoice-enter-modal/invoice-enter-modal.container.jsx
+++ b/client/src/components/invoice-enter-modal/invoice-enter-modal.container.jsx
@@ -1,6 +1,6 @@
 import { useLazyQuery, useMutation, useQuery } from "@apollo/react-hooks";
 import { Form, Modal, notification } from "antd";
-import React, { useState } from "react";
+import React from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -28,7 +28,6 @@ function InvoiceEnterModalContainer({
 }) {
   const [form] = Form.useForm();
   const { t } = useTranslation();
-  const linesState = useState([]);
 
   const [insertInvoice] = useMutation(INSERT_NEW_INVOICE);
 
@@ -67,6 +66,9 @@ function InvoiceEnterModalContainer({
         notification["success"]({
           message: t("invoices.successes.created"),
         });
+        if (invoiceEnterModal.actions.refetch)
+          invoiceEnterModal.actions.refetch();
+
         toggleModalVisible();
       })
       .catch((error) => {
@@ -82,8 +84,6 @@ function InvoiceEnterModalContainer({
     toggleModalVisible();
   };
 
-  console.log("invoiceEnterModal", invoiceEnterModal);
-
   return (
     <Modal
       title={
@@ -116,7 +116,6 @@ function InvoiceEnterModalContainer({
             VendorAutoCompleteData && VendorAutoCompleteData.vendors
           }
           loadLines={loadLines}
-          linesState={linesState}
           lineData={lineData ? lineData.joblines : null}
           responsibilityCenters={bodyshop.md_responsibility_centers || null}
         />
diff --git a/client/src/components/invoices-list-table/invoices-list-table.component.jsx b/client/src/components/invoices-list-table/invoices-list-table.component.jsx
index a1a4a2fa9..6f3cdebb6 100644
--- a/client/src/components/invoices-list-table/invoices-list-table.component.jsx
+++ b/client/src/components/invoices-list-table/invoices-list-table.component.jsx
@@ -1,60 +1,146 @@
-import { Table } from "antd";
+import { Button, Descriptions, Table } from "antd";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { alphaSort } from "../../utils/sorters";
+import { Link } from "react-router-dom";
+import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import { DateFormatter } from "../../utils/DateFormatter";
-export default function InvoicesListTableComponent({ loading, invoices }) {
-  const [state, setState] = useState({
-    sortedInfo: {}
-  });
+import { alphaSort } from "../../utils/sorters";
+
+export default function InvoicesListTableComponent({
+  loading,
+  invoices,
+  selectedInvoice,
+  handleOnRowClick,
+}) {
   const { t } = useTranslation();
 
+  const [state, setState] = useState({
+    sortedInfo: {},
+  });
+
   const columns = [
     {
       title: t("invoices.fields.vendorname"),
       dataIndex: "vendorname",
       key: "vendorname",
-      // onFilter: (value, record) => record.ro_number.includes(value),
-      // filteredValue: state.filteredInfo.text || null,
       sorter: (a, b) => alphaSort(a.vendor.name, b.vendor.name),
       sortOrder:
         state.sortedInfo.columnKey === "vendorname" && state.sortedInfo.order,
-      //ellipsis: true,
-      render: (text, record) => <span>{record.vendor.name}</span>
+      render: (text, record) => <span>{record.vendor.name}</span>,
     },
     {
       title: t("invoices.fields.invoice_number"),
       dataIndex: "invoice_number",
       key: "invoice_number",
-      // onFilter: (value, record) => record.ro_number.includes(value),
-      // filteredValue: state.filteredInfo.text || null,
       sorter: (a, b) => alphaSort(a.invoice_number, b.invoice_number),
       sortOrder:
         state.sortedInfo.columnKey === "invoice_number" &&
-        state.sortedInfo.order
-      //ellipsis: true,
+        state.sortedInfo.order,
     },
     {
       title: t("invoices.fields.date"),
       dataIndex: "date",
       key: "date",
-      // onFilter: (value, record) => record.ro_number.includes(value),
-      // filteredValue: state.filteredInfo.text || null,
+
       sorter: (a, b) => a.date - b.date,
       sortOrder:
         state.sortedInfo.columnKey === "date" && state.sortedInfo.order,
-      //ellipsis: true,
-      render: (text, record) => <DateFormatter>{record.date}</DateFormatter>
-    }
+      render: (text, record) => <DateFormatter>{record.date}</DateFormatter>,
+    },
+    {
+      title: t("invoices.fields.total"),
+      dataIndex: "total",
+      key: "total",
+
+      sorter: (a, b) => a.total - b.total,
+      sortOrder:
+        state.sortedInfo.columnKey === "total" && state.sortedInfo.order,
+      render: (text, record) => (
+        <CurrencyFormatter>{record.total}</CurrencyFormatter>
+      ),
+    },
+    {
+      title: t("general.labels.actions"),
+      dataIndex: "actions",
+      key: "actions",
+      render: (text, record) => (
+        <Link to={`/manage/invoices/${record.id}`}>
+          <Button>{t("invoices.actions.edit")}</Button>
+        </Link>
+      ),
+    },
   ];
 
   const handleTableChange = (pagination, filters, sorter) => {
     setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
   };
 
-  const rowExpander = record => (
-    <div style={{ margin: 0 }}>Invoice details</div>
-  );
+  const rowExpander = (record) => {
+    const columns = [
+      {
+        title: t("invoicelines.fields.line_desc"),
+        dataIndex: "line_desc",
+        key: "line_desc",
+        sorter: (a, b) => alphaSort(a.line_desc, b.line_desc),
+        sortOrder:
+          state.sortedInfo.columnKey === "line_desc" && state.sortedInfo.order,
+      },
+      {
+        title: t("invoicelines.fields.retail"),
+        dataIndex: "actual_price",
+        key: "actual_price",
+        sorter: (a, b) => a.actual_price - b.actual_price,
+        sortOrder:
+          state.sortedInfo.columnKey === "actual_price" &&
+          state.sortedInfo.order,
+        render: (text, record) => (
+          <CurrencyFormatter>{record.actual_price}</CurrencyFormatter>
+        ),
+      },
+      {
+        title: t("invoicelines.fields.actual_cost"),
+        dataIndex: "actual_cost",
+        key: "actual_cost",
+        sorter: (a, b) => a.actual_cost - b.actual_cost,
+        sortOrder:
+          state.sortedInfo.columnKey === "actual_cost" &&
+          state.sortedInfo.order,
+        render: (text, record) => (
+          <CurrencyFormatter>{record.actual_cost}</CurrencyFormatter>
+        ),
+      },
+      {
+        title: t("invoicelines.fields.cost_center"),
+        dataIndex: "cost_center",
+        key: "cost_center",
+        sorter: (a, b) => alphaSort(a.cost_center, b.cost_center),
+        sortOrder:
+          state.sortedInfo.columnKey === "cost_center" &&
+          state.sortedInfo.order,
+      },
+    ];
+
+    return (
+      <div>
+        <Descriptions title="User Info">
+          <Descriptions.Item label="UserName">Zhou Maomao</Descriptions.Item>
+          <Descriptions.Item label="Telephone">1810000000</Descriptions.Item>
+          <Descriptions.Item label="Live">Hangzhou, Zhejiang</Descriptions.Item>
+          <Descriptions.Item label="Remark">empty</Descriptions.Item>
+          <Descriptions.Item label="Address">
+            No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China
+          </Descriptions.Item>
+        </Descriptions>
+        <Table
+          size="small"
+          pagination={{ position: "top", defaultPageSize: 25 }}
+          columns={columns.map((item) => ({ ...item }))}
+          rowKey="id"
+          dataSource={record.invoicelines}
+        />
+      </div>
+    );
+  };
 
   return (
     <Table
@@ -62,10 +148,34 @@ export default function InvoicesListTableComponent({ loading, invoices }) {
       size="small"
       expandedRowRender={rowExpander}
       pagination={{ position: "top", defaultPageSize: 25 }}
-      columns={columns.map(item => ({ ...item }))}
+      columns={columns.map((item) => ({ ...item }))}
       rowKey="id"
       dataSource={invoices}
       onChange={handleTableChange}
+      expandable={{
+        expandedRowKeys: [selectedInvoice],
+        onExpand: (expanded, record) => {
+          handleOnRowClick(expanded ? record : null);
+        },
+      }}
+      rowSelection={{
+        onSelect: (record) => {
+          handleOnRowClick(record);
+        },
+        selectedRowKeys: [selectedInvoice],
+        type: "radio",
+      }}
+      onRow={(record, rowIndex) => {
+        return {
+          onClick: (event) => {
+            handleOnRowClick(record);
+          }, // click row
+          onDoubleClick: (event) => {}, // double click row
+          onContextMenu: (event) => {}, // right button click row
+          onMouseEnter: (event) => {}, // mouse enter row
+          onMouseLeave: (event) => {}, // mouse leave row
+        };
+      }}
     />
   );
 }
diff --git a/client/src/components/job-totals-table/job-totals.utility.js b/client/src/components/job-totals-table/job-totals.utility.js
index eba13997d..dd08f32ca 100644
--- a/client/src/components/job-totals-table/job-totals.utility.js
+++ b/client/src/components/job-totals-table/job-totals.utility.js
@@ -34,7 +34,6 @@ function CalculateTaxesTotals(job, otherTotals) {
   }, 0);
 
   console.log("otherTotals", otherTotals);
-
   console.log("job", job);
   console.log("parts pst", statePartsTax);
   console.log(
@@ -158,19 +157,23 @@ function CalculateRatesTotals(ratesList, shoprates) {
     },
     rate_atp: {
       rate: shoprates.rate_atp || 0,
-      hours: jobLines
-        .filter(
-          (item) =>
-            item.mod_lbr_ty !== "LA1" &&
-            item.mod_lbr_ty !== "LA2" &&
-            item.mod_lbr_ty !== "LA3" &&
-            item.mod_lbr_ty !== "LA4" &&
-            item.mod_lbr_ty !== "LAU" &&
-            item.mod_lbr_ty !== "LAG" &&
-            item.mod_lbr_ty !== "LAS" &&
-            item.mod_lbr_ty !== "LAA"
-        )
-        .reduce((acc, value) => acc + value.mod_lb_hrs, 0),
+      hours:
+        jobLines.filter((item) => item.line_desc.includes("ATS Amount"))
+          .length > 0
+          ? jobLines
+              .filter(
+                (item) =>
+                  item.mod_lbr_ty !== "LA1" &&
+                  item.mod_lbr_ty !== "LA2" &&
+                  item.mod_lbr_ty !== "LA3" &&
+                  item.mod_lbr_ty !== "LA4" &&
+                  item.mod_lbr_ty !== "LAU" &&
+                  item.mod_lbr_ty !== "LAG" &&
+                  item.mod_lbr_ty !== "LAS" &&
+                  item.mod_lbr_ty !== "LAA"
+              )
+              .reduce((acc, value) => acc + value.mod_lb_hrs, 0)
+          : 0,
     },
     paint_mat: {
       rate: ratesList.rate_mapa,
@@ -193,8 +196,8 @@ function CalculateRatesTotals(ratesList, shoprates) {
     subtotal = subtotal + ret[property].hours * ret[property].rate;
     if (
       property !== "paint_mat" &&
-      property !== "shop_mat" &&
-      property !== "rate_atp"
+      property !== "shop_mat"
+      //&&      property !== "rate_atp"
     )
       rates_subtotal =
         rates_subtotal + ret[property].hours * ret[property].rate;
diff --git a/client/src/components/jobs-detail-pli/jobs-detail-pli.component.jsx b/client/src/components/jobs-detail-pli/jobs-detail-pli.component.jsx
index 506da4886..ae26ad764 100644
--- a/client/src/components/jobs-detail-pli/jobs-detail-pli.component.jsx
+++ b/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);
diff --git a/client/src/components/jobs-detail-pli/jobs-detail-pli.container.jsx b/client/src/components/jobs-detail-pli/jobs-detail-pli.container.jsx
index 3c955bf50..9a36680a8 100644
--- a/client/src/components/jobs-detail-pli/jobs-detail-pli.container.jsx
+++ b/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}
+    />
+  );
 }
diff --git a/client/src/components/jobs-list/jobs-list.component.jsx b/client/src/components/jobs-list/jobs-list.component.jsx
index 0bf900490..731a18a25 100644
--- a/client/src/components/jobs-list/jobs-list.component.jsx
+++ b/client/src/components/jobs-list/jobs-list.component.jsx
@@ -8,17 +8,20 @@ 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";
+import queryString from "query-string";
 
 export default withRouter(function JobsList({
   searchTextState,
   refetch,
   loading,
   jobs,
-  selectedJob
+  searchParams,
 }) {
+  const { selected } = searchParams;
+
   const [state, setState] = useState({
     sortedInfo: {},
-    filteredInfo: { text: "" }
+    filteredInfo: { text: "" },
   });
 
   const { t } = useTranslation();
@@ -42,7 +45,7 @@ export default withRouter(function JobsList({
         <Link to={"/manage/jobs/" + record.id}>
           {record.ro_number ? record.ro_number : record.est_number}
         </Link>
-      )
+      ),
     },
     {
       title: t("jobs.fields.owner"),
@@ -61,7 +64,7 @@ export default withRouter(function JobsList({
         ) : (
           <span>{`${record.ownr_fn} ${record.ownr_ln}`}</span>
         );
-      }
+      },
     },
     {
       title: t("jobs.fields.ownr_ph1"),
@@ -76,7 +79,7 @@ export default withRouter(function JobsList({
             <StartChatButton phone={record.ownr_ph1} />
           </span>
         ) : null;
-      }
+      },
     },
     {
       title: t("jobs.fields.status"),
@@ -89,7 +92,7 @@ export default withRouter(function JobsList({
         state.sortedInfo.columnKey === "status" && state.sortedInfo.order,
       render: (text, record) => {
         return record.status || t("general.labels.na");
-      }
+      },
     },
 
     {
@@ -101,14 +104,16 @@ export default withRouter(function JobsList({
       render: (text, record) => {
         return record.vehicleid ? (
           <Link to={"/manage/vehicles/" + record.vehicleid}>
-            {`${record.v_model_yr || ""} ${record.v_make_desc ||
-              ""} ${record.v_model_desc || ""}`}
+            {`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${
+              record.v_model_desc || ""
+            }`}
           </Link>
         ) : (
-          <span>{`${record.v_model_yr || ""} ${record.v_make_desc ||
-            ""} ${record.v_model_desc || ""}`}</span>
+          <span>{`${record.v_model_yr || ""} ${record.v_make_desc || ""} ${
+            record.v_model_desc || ""
+          }`}</span>
         );
-      }
+      },
     },
     {
       title: t("vehicles.fields.plate_no"),
@@ -121,7 +126,7 @@ export default withRouter(function JobsList({
         state.sortedInfo.columnKey === "plate_no" && state.sortedInfo.order,
       render: (text, record) => {
         return record.plate_no ? record.plate_no : "";
-      }
+      },
     },
     {
       title: t("jobs.fields.clm_no"),
@@ -138,7 +143,7 @@ export default withRouter(function JobsList({
         ) : (
           t("general.labels.unknown")
         );
-      }
+      },
     },
     {
       title: t("jobs.fields.clm_total"),
@@ -154,7 +159,7 @@ export default withRouter(function JobsList({
         ) : (
           t("general.labels.unknown")
         );
-      }
+      },
     },
     {
       title: t("jobs.fields.owner_owing"),
@@ -167,18 +172,24 @@ export default withRouter(function JobsList({
         ) : (
           t("general.labels.unknown")
         );
-      }
-    }
+      },
+    },
   ];
 
   const handleTableChange = (pagination, filters, sorter) => {
     setState({ ...state, filteredInfo: filters, sortedInfo: sorter });
   };
 
-  const handleOnRowClick = record => {
+  const handleOnRowClick = (record) => {
     if (record) {
       if (record.id) {
-        history.push({ search: `selected=${record.id}` });
+        console.log("searchParams", searchParams);
+        history.push({
+          search: queryString.stringify({
+            ...searchParams,
+            selected: record.id,
+          }),
+        });
       }
     }
   };
@@ -195,7 +206,7 @@ export default withRouter(function JobsList({
               </Button>
               <Input.Search
                 placeholder={t("general.labels.search")}
-                onChange={e => {
+                onChange={(e) => {
                   setSearchText(e.target.value);
                 }}
                 enterButton
@@ -205,26 +216,26 @@ export default withRouter(function JobsList({
         }}
         size="small"
         pagination={{ position: "top" }}
-        columns={columns.map(item => ({ ...item }))}
+        columns={columns.map((item) => ({ ...item }))}
         rowKey="id"
         dataSource={jobs}
         rowSelection={{
-          onSelect: record => {
+          onSelect: (record) => {
             handleOnRowClick(record);
           },
-          selectedRowKeys: [selectedJob],
-          type: "radio"
+          selectedRowKeys: [selected],
+          type: "radio",
         }}
         onChange={handleTableChange}
         onRow={(record, rowIndex) => {
           return {
-            onClick: event => {
+            onClick: (event) => {
               handleOnRowClick(record);
             }, // click row
-            onDoubleClick: event => {}, // double click row
-            onContextMenu: event => {}, // right button click row
-            onMouseEnter: event => {}, // mouse enter row
-            onMouseLeave: event => {} // mouse leave row
+            onDoubleClick: (event) => {}, // double click row
+            onContextMenu: (event) => {}, // right button click row
+            onMouseEnter: (event) => {}, // mouse enter row
+            onMouseLeave: (event) => {}, // mouse leave row
           };
         }}
       />
diff --git a/client/src/graphql/invoices.queries.js b/client/src/graphql/invoices.queries.js
index 9a52f38cf..c33c01679 100644
--- a/client/src/graphql/invoices.queries.js
+++ b/client/src/graphql/invoices.queries.js
@@ -31,3 +31,31 @@ export const QUERY_INVOICES_BY_JOBID = gql`
     }
   }
 `;
+
+export const QUERY_INVOICE_BY_PK = gql`
+  query QUERY_INVOICE_BY_PK($invoiceid: uuid!) {
+    invoices_by_pk(id: $invoiceid) {
+      due_date
+      exported
+      exported_at
+      id
+      invoice_number
+      date
+      is_credit_memo
+      jobid
+      total
+      updated_at
+      vendor {
+        name
+        discount
+      }
+      invoicelines {
+        id
+        line_desc
+        actual_price
+        actual_cost
+        cost_center
+      }
+    }
+  }
+`;
diff --git a/client/src/graphql/jobs.queries.js b/client/src/graphql/jobs.queries.js
index b4504b7bd..5c98851e9 100644
--- a/client/src/graphql/jobs.queries.js
+++ b/client/src/graphql/jobs.queries.js
@@ -435,9 +435,10 @@ export const QUERY_JOB_FINANCIALS = gql`
       rate_matd
       joblines {
         id
+        line_desc
         tax_part
-        prt_dsmk_p 
-        prt_dsmk_m 
+        prt_dsmk_p
+        prt_dsmk_m
         mod_lbr_ty
         act_price
         mod_lb_hrs
diff --git a/client/src/pages/jobs/jobs.page.jsx b/client/src/pages/jobs/jobs.page.jsx
index 54ae56e03..1ac088bc2 100644
--- a/client/src/pages/jobs/jobs.page.jsx
+++ b/client/src/pages/jobs/jobs.page.jsx
@@ -12,14 +12,14 @@ import { QUERY_ALL_ACTIVE_JOBS } from "../../graphql/jobs.queries";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 
 const mapStateToProps = createStructuredSelector({
-  bodyshop: selectBodyshop
+  bodyshop: selectBodyshop,
 });
 
 export function JobsPage({ location, bodyshop }) {
   const { loading, error, data, refetch } = useQuery(QUERY_ALL_ACTIVE_JOBS, {
     variables: {
-      statuses: bodyshop.md_ro_statuses.open_statuses || ["Open"]
-    }
+      statuses: bodyshop.md_ro_statuses.open_statuses || ["Open"],
+    },
   });
   const { t } = useTranslation();
 
@@ -39,14 +39,14 @@ export function JobsPage({ location, bodyshop }) {
         searchTextState={searchTextState}
         refetch={refetch}
         loading={loading}
-        selectedJob={search.selected}
+        searchParams={search}
         //setSelectedJob={setSelectedJob}
         jobs={
           data
             ? searchText === ""
               ? data.jobs
               : data.jobs.filter(
-                  j =>
+                  (j) =>
                     (j.ro_number || "")
                       .toString()
                       .toLowerCase()
diff --git a/client/src/translations/en_us/common.json b/client/src/translations/en_us/common.json
index 57aa439b4..8f3450824 100644
--- a/client/src/translations/en_us/common.json
+++ b/client/src/translations/en_us/common.json
@@ -339,6 +339,7 @@
 		},
 		"invoices": {
 			"actions": {
+				"edit": "Edit",
 				"receive": "Receive Part"
 			},
 			"errors": {
@@ -361,7 +362,7 @@
 				"new": "New Invoice"
 			},
 			"successes": {
-				"creating": "Invoice added successfully."
+				"created": "Invoice added successfully."
 			}
 		},
 		"joblines": {
diff --git a/client/src/translations/es/common.json b/client/src/translations/es/common.json
index c08cf0dc9..ead67df4d 100644
--- a/client/src/translations/es/common.json
+++ b/client/src/translations/es/common.json
@@ -339,6 +339,7 @@
 		},
 		"invoices": {
 			"actions": {
+				"edit": "",
 				"receive": ""
 			},
 			"errors": {
@@ -361,7 +362,7 @@
 				"new": ""
 			},
 			"successes": {
-				"creating": ""
+				"created": ""
 			}
 		},
 		"joblines": {
diff --git a/client/src/translations/fr/common.json b/client/src/translations/fr/common.json
index fb7ef49a2..53bd2c9a8 100644
--- a/client/src/translations/fr/common.json
+++ b/client/src/translations/fr/common.json
@@ -339,6 +339,7 @@
 		},
 		"invoices": {
 			"actions": {
+				"edit": "",
 				"receive": ""
 			},
 			"errors": {
@@ -361,7 +362,7 @@
 				"new": ""
 			},
 			"successes": {
-				"creating": ""
+				"created": ""
 			}
 		},
 		"joblines": {
diff --git a/jsconfig.json b/jsconfig.json
deleted file mode 100644
index 9c5c96413..000000000
--- a/jsconfig.json
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-    "compilerOptions": {
-        "target": "ES6",
-        "module": "commonjs",
-        "allowSyntheticDefaultImports": true
-    },
-    "exclude": [
-        "dist",
-        "node_modules"
-    ]
-}
\ No newline at end of file