From 9f9fa3b9523587f60b5f2ee51d88f52e4c9ad1b2 Mon Sep 17 00:00:00 2001
From: Dave Richer <dave@imexsystems.ca>
Date: Thu, 28 Mar 2024 15:02:06 -0400
Subject: [PATCH] - Progress commit

Signed-off-by: Dave Richer <dave@imexsystems.ca>
---
 .../jobs-detail-header.component.jsx          |  6 +--
 .../task-list/task-list.container.jsx         | 13 ++++++
 .../task-upsert-modal.container.jsx           | 44 ++++++++++++-------
 3 files changed, 43 insertions(+), 20 deletions(-)

diff --git a/client/src/components/jobs-detail-header/jobs-detail-header.component.jsx b/client/src/components/jobs-detail-header/jobs-detail-header.component.jsx
index 003143a86..038e6ef99 100644
--- a/client/src/components/jobs-detail-header/jobs-detail-header.component.jsx
+++ b/client/src/components/jobs-detail-header/jobs-detail-header.component.jsx
@@ -119,7 +119,7 @@ export function JobsDetailHeader({ job, bodyshop, disabled }) {
               <DataLabel label={t("jobs.labels.contracts")}>
                 {job.cccontracts.map((c, index) => (
                   <Space wrap>
-                    <Link key={c.id} to={`/manage/courtesycars/contracts/${c.id}`}>
+                    <Link key={index} to={`/manage/courtesycars/contracts/${c.id}`}>
                       {`${c.agreementnumber} - ${c.courtesycar.fleetnumber} ${c.courtesycar.year} ${c.courtesycar.make} ${c.courtesycar.model}`}
                       {index !== job.cccontracts.length - 1 ? "," : null}
                     </Link>
@@ -222,10 +222,10 @@ export function JobsDetailHeader({ job, bodyshop, disabled }) {
           }
         >
           <div>
-            <DataLabel key="2" label={t("vehicles.fields.plate_no")}>
+            <DataLabel key="222" label={t("vehicles.fields.plate_no")}>
               {`${job.plate_no || t("general.labels.na")} (${`${job.plate_st || t("general.labels.na")}`})`}
             </DataLabel>
-            <DataLabel key="4" label={t("vehicles.fields.v_vin")}>
+            <DataLabel key="444" label={t("vehicles.fields.v_vin")}>
               <VehicleVinDisplay>{`${job.v_vin || t("general.labels.na")}`}</VehicleVinDisplay>
               {bodyshop.pbs_serialnumber || bodyshop.cdk_dealerid ? (
                 job.v_vin?.length !== 17 ? (
diff --git a/client/src/components/task-list/task-list.container.jsx b/client/src/components/task-list/task-list.container.jsx
index 2dbe385f4..191f46a5a 100644
--- a/client/src/components/task-list/task-list.container.jsx
+++ b/client/src/components/task-list/task-list.container.jsx
@@ -52,6 +52,19 @@ export default function TaskListContainer({bodyshop, titleTranslation ,query,  r
     };
   }, [refetch]);
 
+  useEffect(() => {
+    const handleTaskUpdated = (event) => {
+      refetch();
+    };
+
+    window.addEventListener('taskUpdated', handleTaskUpdated);
+
+    // Clean up the event listener when the component is unmounted.
+    return () => {
+      window.removeEventListener('taskUpdated', handleTaskUpdated);
+    };
+  }, [refetch]);
+  
   /**
    * Toggle task completed mutation
    */
diff --git a/client/src/components/task-upsert-modal/task-upsert-modal.container.jsx b/client/src/components/task-upsert-modal/task-upsert-modal.container.jsx
index d88f9f401..7bee7f1bc 100644
--- a/client/src/components/task-upsert-modal/task-upsert-modal.container.jsx
+++ b/client/src/components/task-upsert-modal/task-upsert-modal.container.jsx
@@ -30,7 +30,6 @@ export function TaskUpsertModalContainer({
   const {t} = useTranslation();
   const [insertTask] = useMutation(MUTATION_INSERT_NEW_TASK);
   const [updateTask] = useMutation(MUTATION_UPDATE_TASK);
-
   const {open, context, actions} = taskUpsert;
   const {jobid, existingTask, joblineid, billid, partsorderid} = context;
   const {refetch} = actions;
@@ -55,6 +54,9 @@ export function TaskUpsertModalContainer({
     if (jobid || existingTask?.id) {
       setSelectedJobId(jobid || existingTask.jobid);
     }
+    return () => {
+      setSelectedJobId(null);
+    };
   }, [jobid, existingTask]);
 
   /**
@@ -105,7 +107,9 @@ export function TaskUpsertModalContainer({
           task: replaceUndefinedWithNull(values)
         },
       });
-
+      window.dispatchEvent( new CustomEvent('taskUpdated', {
+        detail: { message: 'A task has been created or edited.' },
+      }));
       notification["success"]({
         message: t("tasks.successes.updated"),
       });
@@ -116,30 +120,36 @@ export function TaskUpsertModalContainer({
         variables: {
           taskInput: [
             {
-              ...replaceUndefinedWithNull(values),
+              ...values,
               created_by: currentUser.email,
               bodyshopid: bodyshop.id
             },
           ],
         },
-        update(cache) {
-          cache.modify({
-            fields: {
-              tasks(existingTasks) {
-                return [{
-                  ...values,
-                  created_by: currentUser.email,
-                  bodyshopid: bodyshop.id
-                }, ...existingTasks]
-              },
-            },
-          });
-        },
-      });
 
+        // TODO: Consult Patrick, because this fails on relationship data, and an event emitter is just much easier to use
+        // update(cache) {
+        //   cache.modify({
+        //     fields: {
+        //       tasks(existingTasks) {
+        //         return [{
+        //           ...values,
+        //           jobid: selectedJobId || values.jobid,
+        //           created_by: currentUser.email,
+        //           bodyshopid: bodyshop.id
+        //         }, ...existingTasks]
+        //       },
+        //     },
+        //   });
+        // },
+
+      });
       if (refetch) await refetch();
       form.resetFields();
       toggleModalVisible();
+      window.dispatchEvent( new CustomEvent('taskUpdated', {
+        detail: { message: 'A task has been created or edited.' },
+      }));
       notification["success"]({
         message: t("tasks.successes.created"),
       });