From 7bff8d2ec57ac6883346cbef759664afc73dc00c Mon Sep 17 00:00:00 2001 From: Anmol Singh Bhatia <121005188+anmolsinghbhatia@users.noreply.github.com> Date: Mon, 18 Dec 2023 19:01:10 +0530 Subject: [PATCH] chore: cycle and module sidebar mutation fix (#3174) * chore: issue action cycle sidebar mutation fix * chore: issue action module sidebar mutation fix --- .../issue-layouts/calendar/roots/cycle-root.tsx | 4 ++++ .../issue-layouts/calendar/roots/module-root.tsx | 4 ++++ .../issues/issue-layouts/gantt/cycle-root.tsx | 9 ++++++++- .../issues/issue-layouts/gantt/module-root.tsx | 9 ++++++++- .../issue-layouts/kanban/roots/cycle-root.tsx | 4 ++++ .../issue-layouts/kanban/roots/module-root.tsx | 4 ++++ .../issue-layouts/list/roots/cycle-root.tsx | 9 ++++++++- .../issue-layouts/list/roots/module-root.tsx | 9 ++++++++- .../spreadsheet/roots/cycle-root.tsx | 15 +++++++++++---- .../spreadsheet/roots/module-root.tsx | 15 +++++++++++---- web/components/issues/modal.tsx | 8 ++++++-- 11 files changed, 76 insertions(+), 14 deletions(-) diff --git a/web/components/issues/issue-layouts/calendar/roots/cycle-root.tsx b/web/components/issues/issue-layouts/calendar/roots/cycle-root.tsx index f9a4bd9a0..88025ad68 100644 --- a/web/components/issues/issue-layouts/calendar/roots/cycle-root.tsx +++ b/web/components/issues/issue-layouts/calendar/roots/cycle-root.tsx @@ -14,6 +14,7 @@ export const CycleCalendarLayout: React.FC = observer(() => { cycleIssues: cycleIssueStore, cycleIssuesFilter: cycleIssueFilterStore, calendarHelpers: { handleDragDrop: handleCalenderDragDrop }, + cycle: { fetchCycleWithId }, } = useMobxStore(); const router = useRouter(); @@ -24,10 +25,12 @@ export const CycleCalendarLayout: React.FC = observer(() => { if (!workspaceSlug || !cycleId) return; await cycleIssueStore.updateIssue(workspaceSlug.toString(), issue.project, issue.id, issue, cycleId.toString()); + fetchCycleWithId(workspaceSlug.toString(), issue.project, cycleId.toString()); }, [EIssueActions.DELETE]: async (issue: IIssue) => { if (!workspaceSlug || !cycleId) return; await cycleIssueStore.removeIssue(workspaceSlug.toString(), issue.project, issue.id, cycleId.toString()); + fetchCycleWithId(workspaceSlug.toString(), issue.project, cycleId.toString()); }, [EIssueActions.REMOVE]: async (issue: IIssue) => { if (!workspaceSlug || !cycleId || !projectId || !issue.bridge_id) return; @@ -38,6 +41,7 @@ export const CycleCalendarLayout: React.FC = observer(() => { issue.id, issue.bridge_id ); + fetchCycleWithId(workspaceSlug.toString(), issue.project, cycleId.toString()); }, }; diff --git a/web/components/issues/issue-layouts/calendar/roots/module-root.tsx b/web/components/issues/issue-layouts/calendar/roots/module-root.tsx index 187c05f6a..4a7cfbd3f 100644 --- a/web/components/issues/issue-layouts/calendar/roots/module-root.tsx +++ b/web/components/issues/issue-layouts/calendar/roots/module-root.tsx @@ -14,6 +14,7 @@ export const ModuleCalendarLayout: React.FC = observer(() => { moduleIssues: moduleIssueStore, moduleIssuesFilter: moduleIssueFilterStore, calendarHelpers: { handleDragDrop: handleCalenderDragDrop }, + module: { fetchModuleDetails }, } = useMobxStore(); const router = useRouter(); @@ -27,14 +28,17 @@ export const ModuleCalendarLayout: React.FC = observer(() => { [EIssueActions.UPDATE]: async (issue: IIssue) => { if (!workspaceSlug || !moduleId) return; await moduleIssueStore.updateIssue(workspaceSlug, issue.project, issue.id, issue, moduleId); + fetchModuleDetails(workspaceSlug, issue.project, moduleId); }, [EIssueActions.DELETE]: async (issue: IIssue) => { if (!workspaceSlug || !moduleId) return; await moduleIssueStore.removeIssue(workspaceSlug, issue.project, issue.id, moduleId); + fetchModuleDetails(workspaceSlug, issue.project, moduleId); }, [EIssueActions.REMOVE]: async (issue: IIssue) => { if (!workspaceSlug || !moduleId || !issue.bridge_id) return; await moduleIssueStore.removeIssueFromModule(workspaceSlug, issue.project, moduleId, issue.id, issue.bridge_id); + fetchModuleDetails(workspaceSlug, issue.project, moduleId); }, }; diff --git a/web/components/issues/issue-layouts/gantt/cycle-root.tsx b/web/components/issues/issue-layouts/gantt/cycle-root.tsx index e09092fec..c2aa3d726 100644 --- a/web/components/issues/issue-layouts/gantt/cycle-root.tsx +++ b/web/components/issues/issue-layouts/gantt/cycle-root.tsx @@ -12,18 +12,24 @@ export const CycleGanttLayout: React.FC = observer(() => { const router = useRouter(); const { cycleId, workspaceSlug } = router.query; - const { cycleIssues: cycleIssueStore, cycleIssuesFilter: cycleIssueFilterStore } = useMobxStore(); + const { + cycleIssues: cycleIssueStore, + cycleIssuesFilter: cycleIssueFilterStore, + cycle: { fetchCycleWithId }, + } = useMobxStore(); const issueActions = { [EIssueActions.UPDATE]: async (issue: IIssue) => { if (!workspaceSlug || !cycleId) return; await cycleIssueStore.updateIssue(workspaceSlug.toString(), issue.project, issue.id, issue, cycleId.toString()); + fetchCycleWithId(workspaceSlug.toString(), issue.project, cycleId.toString()); }, [EIssueActions.DELETE]: async (issue: IIssue) => { if (!workspaceSlug || !cycleId) return; await cycleIssueStore.removeIssue(workspaceSlug.toString(), issue.project, issue.id, cycleId.toString()); + fetchCycleWithId(workspaceSlug.toString(), issue.project, cycleId.toString()); }, [EIssueActions.REMOVE]: async (issue: IIssue) => { if (!workspaceSlug || !cycleId || !issue.bridge_id) return; @@ -35,6 +41,7 @@ export const CycleGanttLayout: React.FC = observer(() => { issue.id, issue.bridge_id ); + fetchCycleWithId(workspaceSlug.toString(), issue.project, cycleId.toString()); }, }; diff --git a/web/components/issues/issue-layouts/gantt/module-root.tsx b/web/components/issues/issue-layouts/gantt/module-root.tsx index 73ecde1c9..16b269b9f 100644 --- a/web/components/issues/issue-layouts/gantt/module-root.tsx +++ b/web/components/issues/issue-layouts/gantt/module-root.tsx @@ -12,18 +12,24 @@ export const ModuleGanttLayout: React.FC = observer(() => { const router = useRouter(); const { moduleId, workspaceSlug } = router.query; - const { moduleIssues: moduleIssueStore, moduleIssuesFilter: moduleIssueFilterStore } = useMobxStore(); + const { + moduleIssues: moduleIssueStore, + moduleIssuesFilter: moduleIssueFilterStore, + module: { fetchModuleDetails }, + } = useMobxStore(); const issueActions = { [EIssueActions.UPDATE]: async (issue: IIssue) => { if (!workspaceSlug || !moduleId) return; await moduleIssueStore.updateIssue(workspaceSlug.toString(), issue.project, issue.id, issue, moduleId.toString()); + fetchModuleDetails(workspaceSlug.toString(), issue.project, moduleId.toString()); }, [EIssueActions.DELETE]: async (issue: IIssue) => { if (!workspaceSlug || !moduleId) return; await moduleIssueStore.removeIssue(workspaceSlug.toString(), issue.project, issue.id, moduleId.toString()); + fetchModuleDetails(workspaceSlug.toString(), issue.project, moduleId.toString()); }, [EIssueActions.REMOVE]: async (issue: IIssue) => { if (!workspaceSlug || !moduleId || !issue.bridge_id) return; @@ -35,6 +41,7 @@ export const ModuleGanttLayout: React.FC = observer(() => { issue.id, issue.bridge_id ); + fetchModuleDetails(workspaceSlug.toString(), issue.project, moduleId.toString()); }, }; diff --git a/web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx b/web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx index 3c3ee69bc..b54b18edb 100644 --- a/web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx +++ b/web/components/issues/issue-layouts/kanban/roots/cycle-root.tsx @@ -25,6 +25,7 @@ export const CycleKanBanLayout: React.FC = observer(() => { cycleIssuesFilter: cycleIssueFilterStore, cycleIssueKanBanView: cycleIssueKanBanViewStore, kanBanHelpers: kanBanHelperStore, + cycle: { fetchCycleWithId }, } = useMobxStore(); const issueActions = { @@ -32,11 +33,13 @@ export const CycleKanBanLayout: React.FC = observer(() => { if (!workspaceSlug || !cycleId) return; await cycleIssueStore.updateIssue(workspaceSlug.toString(), issue.project, issue.id, issue, cycleId.toString()); + fetchCycleWithId(workspaceSlug.toString(), issue.project, cycleId.toString()); }, [EIssueActions.DELETE]: async (issue: IIssue) => { if (!workspaceSlug || !cycleId) return; await cycleIssueStore.removeIssue(workspaceSlug.toString(), issue.project, issue.id, cycleId.toString()); + fetchCycleWithId(workspaceSlug.toString(), issue.project, cycleId.toString()); }, [EIssueActions.REMOVE]: async (issue: IIssue) => { if (!workspaceSlug || !cycleId || !issue.bridge_id) return; @@ -48,6 +51,7 @@ export const CycleKanBanLayout: React.FC = observer(() => { issue.id, issue.bridge_id ); + fetchCycleWithId(workspaceSlug.toString(), issue.project, cycleId.toString()); }, }; diff --git a/web/components/issues/issue-layouts/kanban/roots/module-root.tsx b/web/components/issues/issue-layouts/kanban/roots/module-root.tsx index 168460026..138787b1f 100644 --- a/web/components/issues/issue-layouts/kanban/roots/module-root.tsx +++ b/web/components/issues/issue-layouts/kanban/roots/module-root.tsx @@ -25,6 +25,7 @@ export const ModuleKanBanLayout: React.FC = observer(() => { moduleIssuesFilter: moduleIssueFilterStore, moduleIssueKanBanView: moduleIssueKanBanViewStore, kanBanHelpers: kanBanHelperStore, + module: { fetchModuleDetails }, } = useMobxStore(); const issueActions = { @@ -32,11 +33,13 @@ export const ModuleKanBanLayout: React.FC = observer(() => { if (!workspaceSlug || !moduleId) return; await moduleIssueStore.updateIssue(workspaceSlug.toString(), issue.project, issue.id, issue, moduleId.toString()); + fetchModuleDetails(workspaceSlug.toString(), issue.project, moduleId.toString()); }, [EIssueActions.DELETE]: async (issue: IIssue) => { if (!workspaceSlug || !moduleId) return; await moduleIssueStore.removeIssue(workspaceSlug.toString(), issue.project, issue.id, moduleId.toString()); + fetchModuleDetails(workspaceSlug.toString(), issue.project, moduleId.toString()); }, [EIssueActions.REMOVE]: async (issue: IIssue) => { if (!workspaceSlug || !moduleId || !issue.bridge_id) return; @@ -48,6 +51,7 @@ export const ModuleKanBanLayout: React.FC = observer(() => { issue.id, issue.bridge_id ); + fetchModuleDetails(workspaceSlug.toString(), issue.project, moduleId.toString()); }, }; diff --git a/web/components/issues/issue-layouts/list/roots/cycle-root.tsx b/web/components/issues/issue-layouts/list/roots/cycle-root.tsx index 1ce28d008..de579473b 100644 --- a/web/components/issues/issue-layouts/list/roots/cycle-root.tsx +++ b/web/components/issues/issue-layouts/list/roots/cycle-root.tsx @@ -19,23 +19,30 @@ export const CycleListLayout: React.FC = observer(() => { const router = useRouter(); const { workspaceSlug, cycleId } = router.query as { workspaceSlug: string; cycleId: string }; // store - const { cycleIssues: cycleIssueStore, cycleIssuesFilter: cycleIssueFilterStore } = useMobxStore(); + const { + cycleIssues: cycleIssueStore, + cycleIssuesFilter: cycleIssueFilterStore, + cycle: { fetchCycleWithId }, + } = useMobxStore(); const issueActions = { [EIssueActions.UPDATE]: async (group_by: string | null, issue: IIssue) => { if (!workspaceSlug || !cycleId) return; await cycleIssueStore.updateIssue(workspaceSlug, issue.project, issue.id, issue, cycleId); + fetchCycleWithId(workspaceSlug, issue.project, cycleId); }, [EIssueActions.DELETE]: async (group_by: string | null, issue: IIssue) => { if (!workspaceSlug || !cycleId) return; await cycleIssueStore.removeIssue(workspaceSlug, issue.project, issue.id, cycleId); + fetchCycleWithId(workspaceSlug, issue.project, cycleId); }, [EIssueActions.REMOVE]: async (group_by: string | null, issue: IIssue) => { if (!workspaceSlug || !cycleId || !issue.bridge_id) return; await cycleIssueStore.removeIssueFromCycle(workspaceSlug, issue.project, cycleId, issue.id, issue.bridge_id); + fetchCycleWithId(workspaceSlug, issue.project, cycleId); }, }; const getProjects = (projectStore: IProjectStore) => { diff --git a/web/components/issues/issue-layouts/list/roots/module-root.tsx b/web/components/issues/issue-layouts/list/roots/module-root.tsx index 2c8737e70..5d076a0cc 100644 --- a/web/components/issues/issue-layouts/list/roots/module-root.tsx +++ b/web/components/issues/issue-layouts/list/roots/module-root.tsx @@ -19,23 +19,30 @@ export const ModuleListLayout: React.FC = observer(() => { const router = useRouter(); const { workspaceSlug, moduleId } = router.query as { workspaceSlug: string; moduleId: string }; - const { moduleIssues: moduleIssueStore, moduleIssuesFilter: moduleIssueFilterStore } = useMobxStore(); + const { + moduleIssues: moduleIssueStore, + moduleIssuesFilter: moduleIssueFilterStore, + module: { fetchModuleDetails }, + } = useMobxStore(); const issueActions = { [EIssueActions.UPDATE]: async (group_by: string | null, issue: IIssue) => { if (!workspaceSlug || !moduleId) return; await moduleIssueStore.updateIssue(workspaceSlug, issue.project, issue.id, issue, moduleId); + fetchModuleDetails(workspaceSlug, issue.project, moduleId); }, [EIssueActions.DELETE]: async (group_by: string | null, issue: IIssue) => { if (!workspaceSlug || !moduleId) return; await moduleIssueStore.removeIssue(workspaceSlug, issue.project, issue.id, moduleId); + fetchModuleDetails(workspaceSlug, issue.project, moduleId); }, [EIssueActions.REMOVE]: async (group_by: string | null, issue: IIssue) => { if (!workspaceSlug || !moduleId || !issue.bridge_id) return; await moduleIssueStore.removeIssueFromModule(workspaceSlug, issue.project, moduleId, issue.id, issue.bridge_id); + fetchModuleDetails(workspaceSlug, issue.project, moduleId); }, }; diff --git a/web/components/issues/issue-layouts/spreadsheet/roots/cycle-root.tsx b/web/components/issues/issue-layouts/spreadsheet/roots/cycle-root.tsx index 0edefc4e7..f61b14eb1 100644 --- a/web/components/issues/issue-layouts/spreadsheet/roots/cycle-root.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/roots/cycle-root.tsx @@ -13,21 +13,28 @@ export const CycleSpreadsheetLayout: React.FC = observer(() => { const router = useRouter(); const { workspaceSlug, cycleId } = router.query as { workspaceSlug: string; cycleId: string }; - const { cycleIssues: cycleIssueStore, cycleIssuesFilter: cycleIssueFilterStore } = useMobxStore(); + const { + cycleIssues: cycleIssueStore, + cycleIssuesFilter: cycleIssueFilterStore, + cycle: { fetchCycleWithId }, + } = useMobxStore(); const issueActions = { [EIssueActions.UPDATE]: async (issue: IIssue) => { if (!workspaceSlug || !cycleId) return; - cycleIssueStore.updateIssue(workspaceSlug, issue.project, issue.id, issue, cycleId); + await cycleIssueStore.updateIssue(workspaceSlug, issue.project, issue.id, issue, cycleId); + fetchCycleWithId(workspaceSlug, issue.project, cycleId); }, [EIssueActions.DELETE]: async (issue: IIssue) => { if (!workspaceSlug || !cycleId) return; - cycleIssueStore.removeIssue(workspaceSlug, issue.project, issue.id, cycleId); + await cycleIssueStore.removeIssue(workspaceSlug, issue.project, issue.id, cycleId); + fetchCycleWithId(workspaceSlug, issue.project, cycleId); }, [EIssueActions.REMOVE]: async (issue: IIssue) => { if (!workspaceSlug || !cycleId || !issue.bridge_id) return; - cycleIssueStore.removeIssueFromCycle(workspaceSlug, issue.project, cycleId, issue.id, issue.bridge_id); + await cycleIssueStore.removeIssueFromCycle(workspaceSlug, issue.project, cycleId, issue.id, issue.bridge_id); + fetchCycleWithId(workspaceSlug, issue.project, cycleId); }, }; diff --git a/web/components/issues/issue-layouts/spreadsheet/roots/module-root.tsx b/web/components/issues/issue-layouts/spreadsheet/roots/module-root.tsx index eb118a0cc..ac921bcb5 100644 --- a/web/components/issues/issue-layouts/spreadsheet/roots/module-root.tsx +++ b/web/components/issues/issue-layouts/spreadsheet/roots/module-root.tsx @@ -14,21 +14,28 @@ export const ModuleSpreadsheetLayout: React.FC = observer(() => { const router = useRouter(); const { workspaceSlug, moduleId } = router.query as { workspaceSlug: string; moduleId: string }; - const { moduleIssues: moduleIssueStore, moduleIssuesFilter: moduleIssueFilterStore } = useMobxStore(); + const { + moduleIssues: moduleIssueStore, + moduleIssuesFilter: moduleIssueFilterStore, + module: { fetchModuleDetails }, + } = useMobxStore(); const issueActions = { [EIssueActions.UPDATE]: async (issue: IIssue) => { if (!workspaceSlug || !moduleId) return; - moduleIssueStore.updateIssue(workspaceSlug.toString(), issue.project, issue.id, issue, moduleId); + await moduleIssueStore.updateIssue(workspaceSlug.toString(), issue.project, issue.id, issue, moduleId); + fetchModuleDetails(workspaceSlug, issue.project, moduleId); }, [EIssueActions.DELETE]: async (issue: IIssue) => { if (!workspaceSlug || !moduleId) return; - moduleIssueStore.removeIssue(workspaceSlug, issue.project, issue.id, moduleId); + await moduleIssueStore.removeIssue(workspaceSlug, issue.project, issue.id, moduleId); + fetchModuleDetails(workspaceSlug, issue.project, moduleId); }, [EIssueActions.REMOVE]: async (issue: IIssue) => { if (!workspaceSlug || !moduleId || !issue.bridge_id) return; - moduleIssueStore.removeIssueFromModule(workspaceSlug, issue.project, moduleId, issue.id, issue.bridge_id); + await moduleIssueStore.removeIssueFromModule(workspaceSlug, issue.project, moduleId, issue.id, issue.bridge_id); + fetchModuleDetails(workspaceSlug, issue.project, moduleId); }, }; diff --git a/web/components/issues/modal.tsx b/web/components/issues/modal.tsx index b94cfd48f..43ac5ad71 100644 --- a/web/components/issues/modal.tsx +++ b/web/components/issues/modal.tsx @@ -83,6 +83,8 @@ export const CreateUpdateIssueModal: React.FC = observer((prop user: userStore, trackEvent: { postHogEventTracker }, workspace: { currentWorkspace }, + cycle: { fetchCycleWithId }, + module: { fetchModuleDetails }, } = useMobxStore(); const user = userStore.currentUser; @@ -221,13 +223,15 @@ export const CreateUpdateIssueModal: React.FC = observer((prop const addIssueToCycle = async (issue: IIssue, cycleId: string) => { if (!workspaceSlug || !activeProject) return; - cycleIssueStore.addIssueToCycle(workspaceSlug, cycleId, [issue.id]); + await cycleIssueStore.addIssueToCycle(workspaceSlug, cycleId, [issue.id]); + fetchCycleWithId(workspaceSlug, activeProject, cycleId); }; const addIssueToModule = async (issue: IIssue, moduleId: string) => { if (!workspaceSlug || !activeProject) return; - moduleIssueStore.addIssueToModule(workspaceSlug, moduleId, [issue.id]); + await moduleIssueStore.addIssueToModule(workspaceSlug, moduleId, [issue.id]); + fetchModuleDetails(workspaceSlug, activeProject, moduleId); }; const createIssue = async (payload: Partial) => {