refactor: dnd function (#308)

This commit is contained in:
Aaryan Khandelwal 2023-02-21 14:56:32 +05:30 committed by GitHub
parent 3d28cde91d
commit 8c15a1519f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -106,12 +106,13 @@ export const IssuesView: React.FC<Props> = ({
const { source, destination } = result; const { source, destination } = result;
const draggedItem = groupedByIssues[source.droppableId][source.index]; const draggedItem = groupedByIssues[source.droppableId][source.index];
let newSortOrder = draggedItem.sort_order;
if (destination.droppableId === "trashBox") { if (destination.droppableId === "trashBox") {
handleDeleteIssue(draggedItem); handleDeleteIssue(draggedItem);
} else { } else {
if (orderBy === "sort_order") { if (orderBy === "sort_order") {
let newSortOrder = draggedItem.sort_order;
const destinationGroupArray = groupedByIssues[destination.droppableId]; const destinationGroupArray = groupedByIssues[destination.droppableId];
if (destinationGroupArray.length !== 0) { if (destinationGroupArray.length !== 0) {
@ -130,6 +131,8 @@ export const IssuesView: React.FC<Props> = ({
destinationGroupArray[destination.index].sort_order) / destinationGroupArray[destination.index].sort_order) /
2; 2;
} }
draggedItem.sort_order = newSortOrder;
} }
if (orderBy === "sort_order" || source.droppableId !== destination.droppableId) { if (orderBy === "sort_order" || source.droppableId !== destination.droppableId) {
@ -138,176 +141,83 @@ export const IssuesView: React.FC<Props> = ({
if (!sourceGroup || !destinationGroup) return; if (!sourceGroup || !destinationGroup) return;
if (selectedGroup === "priority") { if (selectedGroup === "priority") draggedItem.priority = destinationGroup;
if (cycleId) else if (selectedGroup === "state_detail.name") {
mutate<CycleIssueResponse[]>(
CYCLE_ISSUES(cycleId as string),
(prevData) => {
if (!prevData) return prevData;
const updatedIssues = prevData.map((issue) => {
if (issue.issue_detail.id === draggedItem.id) {
return {
...issue,
issue_detail: {
...draggedItem,
priority: destinationGroup,
sort_order: newSortOrder,
},
};
}
return issue;
});
return [...updatedIssues];
},
false
);
if (moduleId)
mutate<ModuleIssueResponse[]>(
MODULE_ISSUES(moduleId as string),
(prevData) => {
if (!prevData) return prevData;
const updatedIssues = prevData.map((issue) => {
if (issue.issue_detail.id === draggedItem.id) {
return {
...issue,
issue_detail: {
...draggedItem,
priority: destinationGroup,
sort_order: newSortOrder,
},
};
}
return issue;
});
return [...updatedIssues];
},
false
);
mutate<IIssue[]>(
PROJECT_ISSUES_LIST(workspaceSlug as string, projectId as string),
(prevData) => {
if (!prevData) return prevData;
const updatedIssues = prevData.map((issue) => {
if (issue.id === draggedItem.id)
return {
...draggedItem,
priority: destinationGroup,
sort_order: newSortOrder,
};
return issue;
});
return updatedIssues;
},
false
);
// patch request
issuesService
.patchIssue(workspaceSlug as string, projectId as string, draggedItem.id, {
priority: destinationGroup,
sort_order: newSortOrder,
})
.then((res) => {
if (cycleId) mutate(CYCLE_ISSUES(cycleId as string));
if (moduleId) mutate(MODULE_ISSUES(moduleId as string));
mutate(PROJECT_ISSUES_LIST(workspaceSlug as string, projectId as string));
});
} else if (selectedGroup === "state_detail.name") {
const destinationState = states?.find((s) => s.name === destinationGroup); const destinationState = states?.find((s) => s.name === destinationGroup);
const destinationStateId = destinationState?.id;
// update the removed item for mutation if (!destinationState) return;
if (!destinationStateId || !destinationState) return;
if (cycleId) draggedItem.state = destinationState.id;
mutate<CycleIssueResponse[]>( draggedItem.state_detail = destinationState;
CYCLE_ISSUES(cycleId as string), }
(prevData) => {
if (!prevData) return prevData;
const updatedIssues = prevData.map((issue) => {
if (issue.issue_detail.id === draggedItem.id) {
return {
...issue,
issue_detail: {
...draggedItem,
state_detail: destinationState,
state: destinationStateId,
sort_order: newSortOrder,
},
};
}
return issue;
});
return [...updatedIssues];
},
false
);
if (moduleId) if (cycleId)
mutate<ModuleIssueResponse[]>( mutate<CycleIssueResponse[]>(
MODULE_ISSUES(moduleId as string), CYCLE_ISSUES(cycleId as string),
(prevData) => {
if (!prevData) return prevData;
const updatedIssues = prevData.map((issue) => {
if (issue.issue_detail.id === draggedItem.id) {
return {
...issue,
issue_detail: {
...draggedItem,
state_detail: destinationState,
state: destinationStateId,
sort_order: newSortOrder,
},
};
}
return issue;
});
return [...updatedIssues];
},
false
);
mutate<IIssue[]>(
PROJECT_ISSUES_LIST(workspaceSlug as string, projectId as string),
(prevData) => { (prevData) => {
if (!prevData) return prevData; if (!prevData) return prevData;
const updatedIssues = prevData.map((issue) => { const updatedIssues = prevData.map((issue) => {
if (issue.id === draggedItem.id) if (issue.issue_detail.id === draggedItem.id) {
return { return {
...draggedItem, ...issue,
state_detail: destinationState, issue_detail: draggedItem,
state: destinationStateId,
sort_order: newSortOrder,
}; };
}
return issue; return issue;
}); });
return [...updatedIssues];
return updatedIssues;
}, },
false false
); );
// patch request if (moduleId)
issuesService mutate<ModuleIssueResponse[]>(
.patchIssue(workspaceSlug as string, projectId as string, draggedItem.id, { MODULE_ISSUES(moduleId as string),
state: destinationStateId, (prevData) => {
sort_order: newSortOrder, if (!prevData) return prevData;
}) const updatedIssues = prevData.map((issue) => {
.then((res) => { if (issue.issue_detail.id === draggedItem.id) {
if (cycleId) mutate(CYCLE_ISSUES(cycleId as string)); return {
if (moduleId) mutate(MODULE_ISSUES(moduleId as string)); ...issue,
issue_detail: draggedItem,
};
}
return issue;
});
return [...updatedIssues];
},
false
);
mutate(PROJECT_ISSUES_LIST(workspaceSlug as string, projectId as string)); mutate<IIssue[]>(
PROJECT_ISSUES_LIST(workspaceSlug as string, projectId as string),
(prevData) => {
if (!prevData) return prevData;
const updatedIssues = prevData.map((i) => {
if (i.id === draggedItem.id) return draggedItem;
return i;
}); });
}
return updatedIssues;
},
false
);
// patch request
issuesService
.patchIssue(workspaceSlug as string, projectId as string, draggedItem.id, {
priority: draggedItem.priority,
state: draggedItem.state,
sort_order: draggedItem.sort_order,
})
.then((res) => {
if (cycleId) mutate(CYCLE_ISSUES(cycleId as string));
if (moduleId) mutate(MODULE_ISSUES(moduleId as string));
mutate(PROJECT_ISSUES_LIST(workspaceSlug as string, projectId as string));
});
} }
} }
}, },