- Progress Commit

Signed-off-by: Dave Richer <dave@imexsystems.ca>

client/src/components/task-upsert-modal/task-upsert-modal.component.jsx

@@ -32,7 +32,6 @@ export function TaskUpsertModalComponent({
                                            selectedJobDetails,
                                            loading,
                                            error,
-                                           data
                                          }) {
   const {t} = useTranslation();
 

client/src/components/task-upsert-modal/task-upsert-modal.container.jsx

@@ -4,7 +4,11 @@ import React, {useEffect, useState} from "react";
 import {useTranslation} from "react-i18next";
 import {connect} from "react-redux";
 import {createStructuredSelector} from "reselect";
-import {MUTATION_INSERT_NEW_TASK, MUTATION_UPDATE_TASK} from "../../graphql/tasks.queries";
+import {
+  MUTATION_INSERT_NEW_TASK,
+  MUTATION_UPDATE_TASK,
+  QUERY_GET_TASK_BY_ID
+} from "../../graphql/tasks.queries";
 import {QUERY_GET_TASKS_JOB_DETAILS_BY_ID} from "../../graphql/jobs.queries.js";
 import {toggleModalVisible} from "../../redux/modals/modals.actions";
 import {selectTaskUpsert} from "../../redux/modals/modals.selectors";
@@ -31,7 +35,7 @@ export function TaskUpsertModalContainer({
   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 {jobid, joblineid, billid, partsorderid, taskId, existingTask} = context;
   const {refetch} = actions;
   const [form] = Form.useForm();
   const [selectedJobId, setSelectedJobId] = useState(null);
@@ -47,6 +51,19 @@ export function TaskUpsertModalContainer({
     skip: !jobIdState,
   });
 
+  const {loading: taskLoading, error: taskError, data: taskData} = useQuery(QUERY_GET_TASK_BY_ID, {
+    variables: {id: taskId},
+    skip: !taskId,
+  });
+
+  // This takes care of the ability to deep link a task from the URL (Fills in form fields)
+  useEffect(() => {
+    if (!taskLoading && !taskError && taskData && taskData?.tasks_by_pk) {
+      form.setFieldsValue(taskData.tasks_by_pk);
+      setSelectedJobId(taskData.tasks_by_pk.jobid);
+    }
+  }, [taskLoading, taskError, taskData]);
+
   /**
    * Set the selected job id when the modal is opened and jobId is passed as a prop or when an existing task is passed as a prop
    */

client/src/graphql/tasks.queries.js

@@ -64,6 +64,14 @@ const PARTIAL_TASK_FIELDS = gql`
   }
 `;
 
+export const QUERY_GET_TASK_BY_ID = gql`
+  ${PARTIAL_TASK_FIELDS}
+  query QUERY_GET_TASK_BY_ID($id: uuid!) {
+    tasks_by_pk(id: $id) {
+      ...TaskFields
+    }
+  }`;
+
 export const QUERY_ALL_TASKS_PAGINATED = gql`
   ${PARTIAL_TASK_FIELDS}
   query QUERY_ALL_TASKS_PAGINATED(

client/src/pages/tasks/allTasksPageContainer.jsx

@@ -8,6 +8,7 @@ import {setBreadcrumbs, setSelectedHeader} from "../../redux/application/applica
 import InstanceRenderManager from "../../utils/instanceRenderMgr.js";
 import {selectBodyshop, selectCurrentUser} from "../../redux/user/user.selectors.js";
 import TaskPageTypes from "./taskPageTypes.jsx";
+import {setModalContext} from "../../redux/modals/modals.actions.js";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
@@ -17,9 +18,16 @@ const mapStateToProps = createStructuredSelector({
 const mapDispatchToProps = (dispatch) => ({
   setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)),
   setSelectedHeader: (key) => dispatch(setSelectedHeader(key)),
+  setTaskUpsertContext: (context) => dispatch(setModalContext({context, modal: 'taskUpsert'})),
 });
 
-export function MyTasksPageContainer({bodyshop, currentUser,  setBreadcrumbs, setSelectedHeader, query}) {
+export function MyTasksPageContainer({
+                                       bodyshop,
+                                       currentUser,
+                                       setBreadcrumbs,
+                                       setSelectedHeader,
+                                       setTaskUpsertContext
+                                     }) {
   const {t} = useTranslation();
   useEffect(() => {
     document.title = t("titles.all_tasks", {
@@ -37,6 +45,21 @@ export function MyTasksPageContainer({bodyshop, currentUser,  setBreadcrumbs, se
       },]);
   }, [t, setBreadcrumbs, setSelectedHeader]);
 
+  // This takes care of the ability to deep link a task from the URL (Dispatches the modal)
+  useEffect(() => {
+    // Check for a query string in the URL
+    const queryString = window.location.search;
+    const urlParams = new URLSearchParams(queryString);
+    const taskId = urlParams.get('taskid');
+    if (taskId) {
+      setTaskUpsertContext({
+        context: {
+          taskId,
+        },
+      });
+    }
+  }, [setTaskUpsertContext]);
+
   return (
     <TasksPageComponent type={TaskPageTypes.ALL_TASKS} currentUser={currentUser} bodyshop={bodyshop}/>
   );

client/src/pages/tasks/myTasksPageContainer.jsx

@@ -19,7 +19,7 @@ const mapDispatchToProps = (dispatch) => ({
   setSelectedHeader: (key) => dispatch(setSelectedHeader(key)),
 });
 
-export function MyTasksPageContainer({bodyshop, currentUser,  setBreadcrumbs, setSelectedHeader, query}) {
+export function MyTasksPageContainer({bodyshop, currentUser, setBreadcrumbs, setSelectedHeader}) {
   const {t} = useTranslation();
   useEffect(() => {
     document.title = t("titles.my_tasks", {