IO-2564 Row Expander Links

Move Drawer from Parts Order into seperate componenet and pass props down from main page and then link the BillDetailEdit Container into joblines

Signed-off-by: Allan Carr <allan.carr@thinkimex.com>

client/src/pages/jobs-detail/jobs-detail.page.component.jsx

@@ -9,6 +9,7 @@ import Icon, {
   ToolFilled
 } from "@ant-design/icons";
 import { PageHeader } from "@ant-design/pro-layout";
+import { useQuery } from "@apollo/client";
 import { Badge, Button, Divider, Form, notification, Space, Tabs } from "antd";
 import Axios from "axios";
 import _ from "lodash";
@@ -44,6 +45,7 @@ import JobNotesContainer from "../../components/jobs-notes/jobs-notes.container"
 import NoteUpsertModalComponent from "../../components/note-upsert-modal/note-upsert-modal.container";
 import ScheduleJobModalContainer from "../../components/schedule-job-modal/schedule-job-modal.container";
 import TaskListContainer from "../../components/task-list/task-list.container.jsx";
+import { QUERY_PARTS_BILLS_BY_JOBID } from "../../graphql/bills.queries.js";
 import { QUERY_JOB_TASKS_PAGINATED } from "../../graphql/tasks.queries.js";
 import { insertAuditTrail } from "../../redux/application/application.actions";
 import { selectJobReadOnly } from "../../redux/application/application.selectors";
@@ -94,6 +96,11 @@ export function JobsDetailPage({
   const formItemLayout = {
     layout: "vertical"
   };
+  const billsQuery = useQuery(QUERY_PARTS_BILLS_BY_JOBID, {
+    variables: { jobid: job.id },
+    fetchPolicy: "network-only",
+    nextFetchPolicy: "network-only"
+  });
 
   useEffect(() => {
     //form.setFieldsValue(transormJobToForm(job));
@@ -102,6 +109,42 @@ export function JobsDetailPage({
 
   //useKeyboardSaveShortcut(form.submit);
 
+  const handleBillOnRowClick = (record) => {
+    if (record) {
+      if (record.id) {
+        search.billid = record.id;
+        history({ search: queryString.stringify(search) });
+      }
+    } else {
+      delete search.billid;
+      history({ search: queryString.stringify(search) });
+    }
+  };
+
+  const handlePartsOrderOnRowClick = (record) => {
+    if (record) {
+      if (record.id) {
+        search.partsorderid = record.id;
+        history({ search: queryString.stringify(search) });
+      }
+    } else {
+      delete search.partsorderid;
+      history({ search: queryString.stringify(search) });
+    }
+  };
+
+  const handlePartsDispatchOnRowClick = (record) => {
+    if (record) {
+      if (record.id) {
+        search.partsdispatchid = record.id;
+        history.push({ search: queryString.stringify(search) });
+      }
+    } else {
+      delete search.partsdispatchid;
+      history.push({ search: queryString.stringify(search) });
+    }
+  };
+
   const handleFinish = async (values) => {
     setLoading(true);
 
@@ -301,7 +344,18 @@ export function JobsDetailPage({
               id: "job-details-repairdata",
               label: t("menus.jobsdetail.repairdata"),
               forceRender: true,
-              children: <JobsLinesContainer job={job} joblines={job.joblines} refetch={refetch} form={form} />
+              children: (
+                <JobsLinesContainer
+                  job={job}
+                  joblines={job.joblines}
+                  billsQuery={billsQuery}
+                  handleBillOnRowClick={handleBillOnRowClick}
+                  handlePartsOrderOnRowClick={handlePartsOrderOnRowClick}
+                  handlePartsDispatchOnRowClick={handlePartsDispatchOnRowClick}
+                  refetch={refetch}
+                  form={form}
+                />
+              )
             },
             {
               key: "rates",
@@ -325,7 +379,15 @@ export function JobsDetailPage({
               label: HasFeatureAccess({ featureName: "bills", bodyshop })
                 ? t("menus.jobsdetail.partssublet")
                 : t("menus.jobsdetail.parts"),
-              children: <JobsDetailPliContainer job={job} />
+              children: (
+                <JobsDetailPliContainer
+                  job={job}
+                  billsQuery={billsQuery}
+                  handleBillOnRowClick={handleBillOnRowClick}
+                  handlePartsOrderOnRowClick={handlePartsOrderOnRowClick}
+                  handlePartsDispatchOnRowClick={handlePartsDispatchOnRowClick}
+                />
+              )
             },
             ...(InstanceRenderManager({
               imex: true,