This commit is contained in:
@@ -72,6 +72,25 @@ export const useChangeTaskPhase = () => {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const useChangeTaskPriority = () => {
|
||||||
|
const queryClient = useQueryClient();
|
||||||
|
|
||||||
|
return useMutation({
|
||||||
|
mutationFn: ({
|
||||||
|
srcId,
|
||||||
|
destId,
|
||||||
|
}: {
|
||||||
|
srcId: string;
|
||||||
|
destId: string;
|
||||||
|
taskPhaseId: string;
|
||||||
|
projectId: string;
|
||||||
|
}) => api.changeTaskPriority(srcId, destId),
|
||||||
|
onSuccess: (_data, variables) => {
|
||||||
|
queryClient.invalidateQueries({ queryKey: ["tasks-by-task-phase", variables.taskPhaseId] });
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
export const useDeleteTask = () => {
|
export const useDeleteTask = () => {
|
||||||
const queryClient = useQueryClient();
|
const queryClient = useQueryClient();
|
||||||
|
|
||||||
|
|||||||
@@ -48,6 +48,11 @@ export const changeTaskPhase = async (id: string, params: ChangeTaskPhaseType) =
|
|||||||
return data;
|
return data;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const changeTaskPriority = async (srcId: string, destId: string) => {
|
||||||
|
const { data } = await axios.patch(`/task-manager/tasks/change-priority/${srcId}/${destId}`);
|
||||||
|
return data;
|
||||||
|
};
|
||||||
|
|
||||||
export const deleteTask = async (id: string) => {
|
export const deleteTask = async (id: string) => {
|
||||||
const { data } = await axios.delete(`/task-manager/tasks/${id}`);
|
const { data } = await axios.delete(`/task-manager/tasks/${id}`);
|
||||||
return data;
|
return data;
|
||||||
|
|||||||
@@ -0,0 +1,24 @@
|
|||||||
|
import type { TaskItemType } from "../task/types/TaskTypes";
|
||||||
|
|
||||||
|
const getTaskSortOrder = (task: TaskItemType) => task.order ?? task.priority ?? 0;
|
||||||
|
|
||||||
|
export const getPriorityDestinationTaskId = (
|
||||||
|
items: TaskItemType[],
|
||||||
|
sourceId: string,
|
||||||
|
destIndex: number,
|
||||||
|
removeSource = true,
|
||||||
|
): string | null => {
|
||||||
|
const sorted = [...items].sort((a, b) => getTaskSortOrder(a) - getTaskSortOrder(b));
|
||||||
|
const sourceIndex = sorted.findIndex((item) => item.id === sourceId);
|
||||||
|
|
||||||
|
if (removeSource && sourceIndex === destIndex) return null;
|
||||||
|
|
||||||
|
const list = removeSource ? sorted.filter((item) => item.id !== sourceId) : sorted;
|
||||||
|
if (list.length === 0) return null;
|
||||||
|
|
||||||
|
if (destIndex >= list.length) {
|
||||||
|
return list[list.length - 1].id;
|
||||||
|
}
|
||||||
|
|
||||||
|
return list[destIndex].id;
|
||||||
|
};
|
||||||
@@ -10,12 +10,14 @@ import HeaderWorkspace from "./components/HeaderWorkspace";
|
|||||||
import TaskDetailModal from "./components/task-detail/TaskDetailModal";
|
import TaskDetailModal from "./components/task-detail/TaskDetailModal";
|
||||||
import { useGetProject } from "./project/hooks/useProjectData";
|
import { useGetProject } from "./project/hooks/useProjectData";
|
||||||
import { useUpdateTaskPhase } from "./task-phase/hooks/useTaskPhaseData";
|
import { useUpdateTaskPhase } from "./task-phase/hooks/useTaskPhaseData";
|
||||||
import { useChangeTaskPhase } from "./task/hooks/useTaskData";
|
import { useChangeTaskPhase, useChangeTaskPriority } from "./task/hooks/useTaskData";
|
||||||
import type { TaskPhaseItemType } from "./task-phase/types/TaskPhaseTypes";
|
import type { TaskPhaseItemType } from "./task-phase/types/TaskPhaseTypes";
|
||||||
import type { Column as ColumnType, Task } from "./types";
|
import type { Column as ColumnType, Task } from "./types";
|
||||||
|
import { getPriorityDestinationTaskId } from "./utils/getPriorityDestinationTaskId";
|
||||||
import { reorderColumns } from "./utils/reorderColumns";
|
import { reorderColumns } from "./utils/reorderColumns";
|
||||||
import { reorderTaskItems } from "./utils/reorderTaskItems";
|
import { reorderTaskItems } from "./utils/reorderTaskItems";
|
||||||
import {
|
import {
|
||||||
|
getTaskPhaseItems,
|
||||||
insertTaskPhaseItem,
|
insertTaskPhaseItem,
|
||||||
type TasksByTaskPhaseInfiniteData,
|
type TasksByTaskPhaseInfiniteData,
|
||||||
updateTaskPhaseItems,
|
updateTaskPhaseItems,
|
||||||
@@ -26,6 +28,7 @@ const Workspace: FC = () => {
|
|||||||
const { slug: projectId = "" } = useParams<{ slug: string }>();
|
const { slug: projectId = "" } = useParams<{ slug: string }>();
|
||||||
const { data: project, isPending } = useGetProject(projectId);
|
const { data: project, isPending } = useGetProject(projectId);
|
||||||
const changeTaskPhase = useChangeTaskPhase();
|
const changeTaskPhase = useChangeTaskPhase();
|
||||||
|
const changeTaskPriority = useChangeTaskPriority();
|
||||||
const updateTaskPhase = useUpdateTaskPhase();
|
const updateTaskPhase = useUpdateTaskPhase();
|
||||||
const [columns, setColumns] = useState<ColumnType[]>([]);
|
const [columns, setColumns] = useState<ColumnType[]>([]);
|
||||||
const [draggedTask, setDraggedTask] = useState<Task | null>(null);
|
const [draggedTask, setDraggedTask] = useState<Task | null>(null);
|
||||||
@@ -65,9 +68,30 @@ const Workspace: FC = () => {
|
|||||||
setDraggedTask(null);
|
setDraggedTask(null);
|
||||||
|
|
||||||
if (!columnChanged) {
|
if (!columnChanged) {
|
||||||
|
const previousData = queryClient.getQueryData<TasksByTaskPhaseInfiniteData>([
|
||||||
|
"tasks-by-task-phase",
|
||||||
|
columnId,
|
||||||
|
]);
|
||||||
|
const currentItems = getTaskPhaseItems(previousData);
|
||||||
|
const destTaskId = getPriorityDestinationTaskId(currentItems, activeTask.id, index);
|
||||||
|
|
||||||
|
if (!destTaskId) return;
|
||||||
|
|
||||||
queryClient.setQueryData<TasksByTaskPhaseInfiniteData>(["tasks-by-task-phase", columnId], (current) =>
|
queryClient.setQueryData<TasksByTaskPhaseInfiniteData>(["tasks-by-task-phase", columnId], (current) =>
|
||||||
updateTaskPhaseItems(current, (items) => reorderTaskItems(items, activeTask.id, index)),
|
updateTaskPhaseItems(current, (items) => reorderTaskItems(items, activeTask.id, index)),
|
||||||
);
|
);
|
||||||
|
|
||||||
|
changeTaskPriority.mutate(
|
||||||
|
{ srcId: activeTask.id, destId: destTaskId, taskPhaseId: columnId, projectId },
|
||||||
|
{
|
||||||
|
onError: (error: ErrorType) => {
|
||||||
|
if (previousData) {
|
||||||
|
queryClient.setQueryData(["tasks-by-task-phase", columnId], previousData);
|
||||||
|
}
|
||||||
|
toast.error(error.response?.data?.error.message[0]);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -100,6 +124,13 @@ const Workspace: FC = () => {
|
|||||||
}, index),
|
}, index),
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const destTaskId = getPriorityDestinationTaskId(
|
||||||
|
getTaskPhaseItems(previousDest),
|
||||||
|
activeTask.id,
|
||||||
|
index,
|
||||||
|
false,
|
||||||
|
);
|
||||||
|
|
||||||
if (selectedTask?.id === activeTask.id) {
|
if (selectedTask?.id === activeTask.id) {
|
||||||
setSelectedTask({ ...activeTask, columnId });
|
setSelectedTask({ ...activeTask, columnId });
|
||||||
}
|
}
|
||||||
@@ -108,6 +139,20 @@ const Workspace: FC = () => {
|
|||||||
{ id: activeTask.id, params: { taskPhaseId: columnId }, projectId },
|
{ id: activeTask.id, params: { taskPhaseId: columnId }, projectId },
|
||||||
{
|
{
|
||||||
onSuccess: () => {
|
onSuccess: () => {
|
||||||
|
if (destTaskId) {
|
||||||
|
changeTaskPriority.mutate(
|
||||||
|
{ srcId: activeTask.id, destId: destTaskId, taskPhaseId: columnId, projectId },
|
||||||
|
{
|
||||||
|
onError: (error: ErrorType) => {
|
||||||
|
queryClient.invalidateQueries({ queryKey: ["tasks-by-task-phase", sourceColumnId] });
|
||||||
|
queryClient.invalidateQueries({ queryKey: ["tasks-by-task-phase", columnId] });
|
||||||
|
toast.error(error.response?.data?.error.message[0]);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
queryClient.invalidateQueries({ queryKey: ["tasks-by-task-phase", sourceColumnId] });
|
queryClient.invalidateQueries({ queryKey: ["tasks-by-task-phase", sourceColumnId] });
|
||||||
queryClient.invalidateQueries({ queryKey: ["tasks-by-task-phase", columnId] });
|
queryClient.invalidateQueries({ queryKey: ["tasks-by-task-phase", columnId] });
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user