From 3a466cfe40270462d5b60d10211a8fc7badcedb7 Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <121005188+anmolsinghbhatia@users.noreply.github.com>
Date: Thu, 28 Mar 2024 20:29:35 +0530
Subject: [PATCH] [WEB-838] fix: cycle dropdown fetch (#4076)

* fix: workspace issue properties fetch

* fix: issue modal cycle fetch issue

* fix: issue modal cycle fetch issue

* chore: project issue properties hook updated
---
 web/components/issues/issue-modal/form.tsx |  4 +
 web/hooks/use-project-issue-properties.ts  | 89 ++++++++++++++++++++++
 2 files changed, 93 insertions(+)
 create mode 100644 web/hooks/use-project-issue-properties.ts

diff --git a/web/components/issues/issue-modal/form.tsx b/web/components/issues/issue-modal/form.tsx
index 6c9872369..6112a27fe 100644
--- a/web/components/issues/issue-modal/form.tsx
+++ b/web/components/issues/issue-modal/form.tsx
@@ -26,6 +26,7 @@ import { renderFormattedPayloadDate, getDate } from "@/helpers/date-time.helper"
 import { getChangedIssuefields } from "@/helpers/issue.helper";
 import { shouldRenderProject } from "@/helpers/project.helper";
 import { useApplication, useEstimate, useIssueDetail, useMention, useProject, useWorkspace } from "@/hooks/store";
+import { useProjectIssueProperties } from "@/hooks/use-project-issue-properties";
 // services
 import { AIService } from "@/services/ai.service";
 import { FileService } from "@/services/file.service";
@@ -121,6 +122,7 @@ export const IssueFormRoot: FC<IssueFormProps> = observer((props) => {
   // store hooks
   const {
     config: { envConfig },
+    router: { projectId: routeProjectId },
   } = useApplication();
   const { getProjectById } = useProject();
   const { areEstimatesEnabledForProject } = useEstimate();
@@ -128,6 +130,7 @@ export const IssueFormRoot: FC<IssueFormProps> = observer((props) => {
   const {
     issue: { getIssueById },
   } = useIssueDetail();
+  const { fetchCycles } = useProjectIssueProperties();
   // form info
   const {
     formState: { errors, isDirty, isSubmitting, dirtyFields },
@@ -160,6 +163,7 @@ export const IssueFormRoot: FC<IssueFormProps> = observer((props) => {
         parent_id: formData.parent_id,
       });
     }
+    if (projectId && routeProjectId !== projectId) fetchCycles(workspaceSlug, projectId);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [projectId]);
 
diff --git a/web/hooks/use-project-issue-properties.ts b/web/hooks/use-project-issue-properties.ts
new file mode 100644
index 000000000..195dd4e5c
--- /dev/null
+++ b/web/hooks/use-project-issue-properties.ts
@@ -0,0 +1,89 @@
+import { useCycle, useEstimate, useLabel, useMember, useModule, useProjectState } from "./store";
+
+export const useProjectIssueProperties = () => {
+  const { fetchProjectStates } = useProjectState();
+  const {
+    project: { fetchProjectMembers },
+  } = useMember();
+  const { fetchProjectLabels } = useLabel();
+  const { fetchAllCycles: fetchProjectAllCycles } = useCycle();
+  const { fetchModules: fetchProjectAllModules } = useModule();
+  const { fetchProjectEstimates } = useEstimate();
+
+  // fetching project states
+  const fetchStates = async (
+    workspaceSlug: string | string[] | undefined,
+    projectId: string | string[] | undefined
+  ) => {
+    if (workspaceSlug && projectId) {
+      await fetchProjectStates(workspaceSlug.toString(), projectId.toString());
+    }
+  };
+  // fetching project members
+  const fetchMembers = async (
+    workspaceSlug: string | string[] | undefined,
+    projectId: string | string[] | undefined
+  ) => {
+    if (workspaceSlug && projectId) {
+      await fetchProjectMembers(workspaceSlug.toString(), projectId.toString());
+    }
+  };
+
+  // fetching project labels
+  const fetchLabels = async (
+    workspaceSlug: string | string[] | undefined,
+    projectId: string | string[] | undefined
+  ) => {
+    if (workspaceSlug && projectId) {
+      await fetchProjectLabels(workspaceSlug.toString(), projectId.toString());
+    }
+  };
+  // fetching project cycles
+  const fetchCycles = async (
+    workspaceSlug: string | string[] | undefined,
+    projectId: string | string[] | undefined
+  ) => {
+    if (workspaceSlug && projectId) {
+      await fetchProjectAllCycles(workspaceSlug.toString(), projectId.toString());
+    }
+  };
+  // fetching project modules
+  const fetchModules = async (
+    workspaceSlug: string | string[] | undefined,
+    projectId: string | string[] | undefined
+  ) => {
+    if (workspaceSlug && projectId) {
+      await fetchProjectAllModules(workspaceSlug.toString(), projectId.toString());
+    }
+  };
+  // fetching project estimates
+  const fetchEstimates = async (
+    workspaceSlug: string | string[] | undefined,
+    projectId: string | string[] | undefined
+  ) => {
+    if (workspaceSlug && projectId) {
+      await fetchProjectEstimates(workspaceSlug.toString(), projectId.toString());
+    }
+  };
+
+  const fetchAll = async (workspaceSlug: string | string[] | undefined, projectId: string | string[] | undefined) => {
+    if (workspaceSlug && projectId) {
+      await fetchStates(workspaceSlug, projectId);
+      await fetchMembers(workspaceSlug, projectId);
+      await fetchLabels(workspaceSlug, projectId);
+      await fetchCycles(workspaceSlug, projectId);
+      await fetchModules(workspaceSlug, projectId);
+      await fetchEstimates(workspaceSlug, projectId);
+    }
+  };
+
+  return {
+    fetchAll,
+    fetchStates,
+    fetchMembers,
+    fetchLabels,
+    fetchCycles,
+    fetchModules,
+    fetchEstimates,
+  };
+};