diff --git a/client/src/components/task-list/task-list.container.jsx b/client/src/components/task-list/task-list.container.jsx index a081f8b1d..1bc801fff 100644 --- a/client/src/components/task-list/task-list.container.jsx +++ b/client/src/components/task-list/task-list.container.jsx @@ -4,7 +4,7 @@ import { useMutation, useQuery } from "@apollo/client"; import { MUTATION_TOGGLE_TASK_COMPLETED, MUTATION_TOGGLE_TASK_DELETED } from "../../graphql/tasks.queries.js"; import { pageLimit } from "../../utils/config.js"; import AlertComponent from "../alert/alert.component.jsx"; -import React, { useContext, useEffect } from "react"; +import React from "react"; import TaskListComponent from "./task-list.component.jsx"; import { notification } from "antd"; import { useTranslation } from "react-i18next"; @@ -14,7 +14,6 @@ import AuditTrailMapping from "../../utils/AuditTrailMappings.js"; import { createStructuredSelector } from "reselect"; import { selectBodyshop, selectCurrentUser } from "../../redux/user/user.selectors.js"; import dayjs from "../../utils/day"; -import { SharedModalContext } from "../../providers/shared-modal.provider.jsx"; const mapStateToProps = createStructuredSelector({ bodyshop: selectBodyshop, @@ -41,7 +40,6 @@ export function TaskListContainer({ const searchParams = queryString.parse(useLocation().search); const { page, sortcolumn, sortorder, deleted, completed, mine } = searchParams; const dispatch = useDispatch(); - const { updateTaskQuery } = useContext(SharedModalContext); // Use the context const { loading, error, data, refetch } = useQuery(query[Object.keys(query)[0]], { fetchPolicy: "network-only", @@ -166,11 +164,6 @@ export function TaskListContainer({ } }; - // Update the Last Task Paginated Query - useEffect(() => { - updateTaskQuery(Object.keys(query)[0]); - }, [query]); - if (error) return ; return ( 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 c1c2b1b65..21a9e4933 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 @@ -1,6 +1,6 @@ import { useMutation, useQuery } from "@apollo/client"; import { Form, Modal, notification } from "antd"; -import React, { useContext, useEffect, useState } from "react"; +import React, { useEffect, useState } from "react"; import { useTranslation } from "react-i18next"; import { connect } from "react-redux"; import { createStructuredSelector } from "reselect"; @@ -15,7 +15,7 @@ import { useLocation, useNavigate } from "react-router-dom"; import { insertAuditTrail } from "../../redux/application/application.actions.js"; import AuditTrailMapping from "../../utils/AuditTrailMappings.js"; import { isEqual } from "lodash"; -import { SharedModalContext } from "../../providers/shared-modal.provider.jsx"; +import refetchRouteMappings from "./task-upsert-modal.route.mappings.js"; const mapStateToProps = createStructuredSelector({ currentUser: selectCurrentUser, @@ -46,7 +46,6 @@ export function TaskUpsertModalContainer({ bodyshop, currentUser, taskUpsert, to variables: { id: jobIdState }, skip: !jobIdState }); - const { taskQuery } = useContext(SharedModalContext); const { loading: taskLoading, @@ -108,25 +107,32 @@ export function TaskUpsertModalContainer({ bodyshop, currentUser, taskUpsert, to }; /** - * Task Query Refetch function to determine if we need to refetch the task query - * @returns {boolean} + * Handle refetch queries + * @param taskObject */ - const taskQueryRefetch = () => - (!jobid || !joblineid || !billid || !partsorderid || !taskId) && - taskQuery && - location.pathname.includes("/manage/tasks"); + const handleRefetchQueries = (taskObject) => { + if (query && Object.keys(query).length) { + taskObject.refetchQueries.push(Object.keys(query)[0]); + } else { + refetchRouteMappings.forEach((mapping) => { + if (location.pathname.includes(mapping.route)) { + taskObject.refetchQueries.push(mapping.query); + } + }); + } + }; /** * Handle existing task + * @param id + * @param jobId * @param values * @returns {Promise} */ - const handleExistingTask = async (values) => { - const isAssignedToDirty = values.assigned_to !== existingTask.assigned_to; - + const handleExistingTask = async (id, jobId, values) => { const taskObject = { variables: { - taskId: existingTask.id, + taskId: id, task: replaceUndefinedWithNull(values) }, refetchQueries: [] @@ -136,16 +142,11 @@ export function TaskUpsertModalContainer({ bodyshop, currentUser, taskUpsert, to taskObject.refetchQueries.push({ query: GET_JOB_BY_PK, variables: { - id: existingTask.jobid + id: jobId } }); - // We have a relationship query, so we need to refetch the query - if (query && Object.keys(query).length) { - taskObject.refetchQueries.push(Object.keys(query)[0]); - } else if (taskQueryRefetch()) { - taskObject.refetchQueries.push(taskQuery); - } + handleRefetchQueries(taskObject); const taskData = await updateTask(taskObject); @@ -196,7 +197,7 @@ export function TaskUpsertModalContainer({ bodyshop, currentUser, taskUpsert, to * @returns {Promise} */ const handleNewTask = async (values) => { - const newTaskObject = { + const taskObject = { variables: { taskInput: [ { @@ -210,7 +211,7 @@ export function TaskUpsertModalContainer({ bodyshop, currentUser, taskUpsert, to }; // We need to make sure this is updated everywhere - newTaskObject.refetchQueries.push({ + taskObject.refetchQueries.push({ query: GET_JOB_BY_PK, variables: { id: values.jobid @@ -218,15 +219,10 @@ export function TaskUpsertModalContainer({ bodyshop, currentUser, taskUpsert, to }); // We have a relationship query, so we need to refetch the query - if (query && Object.keys(query).length) { - newTaskObject.refetchQueries.push(Object.keys(query)[0]); - } else if (taskQueryRefetch()) { - newTaskObject.refetchQueries.push(taskQuery); - } + handleRefetchQueries(taskObject); - const newTaskData = await insertTask({ ...newTaskObject }); + const newTaskData = await insertTask(taskObject); const newTask = newTaskData?.data?.insert_tasks?.returning[0]; - const newTaskID = newTask?.id; if (!newTaskData.errors) { insertAuditTrail({ @@ -274,15 +270,16 @@ export function TaskUpsertModalContainer({ bodyshop, currentUser, taskUpsert, to * @returns {Promise<[{jobid, bodyshopid, created_by},...*]>} */ const handleFinish = async (formValues) => { - if (existingTask) { + if (existingTask || taskData?.tasks_by_pk) { + const taskSource = existingTask || taskData?.tasks_by_pk; const dirtyValues = Object.keys(formValues).reduce((acc, key) => { - if (!isEqual(formValues[key], existingTask[key])) { + if (!isEqual(formValues[key], taskSource[key])) { acc[key] = formValues[key]; } return acc; }, {}); try { - await handleExistingTask(dirtyValues); + await handleExistingTask(taskSource.id, taskSource.jobid, dirtyValues); } catch (e) { notification["error"]({ message: t("tasks.failures.updated") diff --git a/client/src/components/task-upsert-modal/task-upsert-modal.route.mappings.js b/client/src/components/task-upsert-modal/task-upsert-modal.route.mappings.js new file mode 100644 index 000000000..d692dc314 --- /dev/null +++ b/client/src/components/task-upsert-modal/task-upsert-modal.route.mappings.js @@ -0,0 +1,15 @@ +import { + QUERY_ALL_TASKS_PAGINATED, + QUERY_JOB_TASKS_PAGINATED, + QUERY_MY_TASKS_PAGINATED +} from "../../graphql/tasks.queries.js"; + +const getQueryName = (query) => Object.keys(query)[0]; + +const refetchRouteMappings = [ + {query: getQueryName({QUERY_MY_TASKS_PAGINATED}), route: "/manage/tasks/mytasks"}, + {query: getQueryName({QUERY_ALL_TASKS_PAGINATED}), route: "/manage/tasks/alltasks"}, + {query: getQueryName({QUERY_JOB_TASKS_PAGINATED}), route: "/manage/jobs"} +]; + +export default refetchRouteMappings; diff --git a/client/src/pages/manage/manage.page.component.jsx b/client/src/pages/manage/manage.page.component.jsx index 67dd45e53..d8b41b7c6 100644 --- a/client/src/pages/manage/manage.page.component.jsx +++ b/client/src/pages/manage/manage.page.component.jsx @@ -27,7 +27,6 @@ import { setJoyRideFinished } from "../../redux/application/application.actions. import { selectEnableJoyRide, selectJoyRideSteps } from "../../redux/application/application.selectors.js"; import InstanceRenderManager from "../../utils/instanceRenderMgr.js"; import "./manage.page.styles.scss"; -import { SharedModalProvider } from "../../providers/shared-modal.provider.jsx"; const JobsPage = lazy(() => import("../jobs/jobs.page")); @@ -152,425 +151,423 @@ export function Manage({ conflict, bodyshop, enableJoyRide, joyRideSteps, setJoy /> } > - - - - - - - - - - - - - - } /> - } /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - { - // } - // /> + + + + + + + + + + + + + } /> + } /> + }> + + } - }> - - - } - /> - }> - - - } - /> + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + { + // } + // /> + } + }> + + + } + /> + }> + + + } + /> - }> - - - } - /> + }> + + + } + /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - } /> - }> - - - } - /> - }> - - - } - /> - }> - - - } - /> - - + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + } /> + }> + + + } + /> + }> + + + } + /> + }> + + + } + /> + ); diff --git a/client/src/providers/shared-modal.provider.jsx b/client/src/providers/shared-modal.provider.jsx deleted file mode 100644 index c74ba1b07..000000000 --- a/client/src/providers/shared-modal.provider.jsx +++ /dev/null @@ -1,14 +0,0 @@ -import React from "react"; - -// Create a context -export const SharedModalContext = React.createContext({}); - -export const SharedModalProvider = ({ children }) => { - const [taskQuery, setTaskQuery] = React.useState([]); - - const updateTaskQuery = (query) => { - setTaskQuery(query); - }; - - return {children}; -};