From dd579f83ee79460fd684d151379e2541e2ea3b80 Mon Sep 17 00:00:00 2001
From: guru_sainath <gurusainath007@gmail.com>
Date: Wed, 6 Mar 2024 19:27:04 +0530
Subject: [PATCH] chore: enabled module and cycle display properties in module
 and cycle issues (#3885)

---
 .../display-filters/display-properties.tsx    | 49 ++++++----------
 .../properties/all-properties.tsx             | 58 +++++++++----------
 2 files changed, 45 insertions(+), 62 deletions(-)

diff --git a/web/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx b/web/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx
index 871bf8ff5..d00848acd 100644
--- a/web/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx
+++ b/web/components/issues/issue-layouts/filters/header/display-filters/display-properties.tsx
@@ -1,6 +1,5 @@
 import React from "react";
 import { observer } from "mobx-react-lite";
-import { useRouter } from "next/router";
 // components
 import { ISSUE_DISPLAY_PROPERTIES } from "constants/issue";
 import { IIssueDisplayProperties } from "@plane/types";
@@ -14,19 +13,10 @@ type Props = {
 };
 
 export const FilterDisplayProperties: React.FC<Props> = observer((props) => {
-  const router = useRouter();
-  const { moduleId, cycleId } = router.query;
   const { displayProperties, handleUpdate } = props;
 
   const [previewEnabled, setPreviewEnabled] = React.useState(true);
 
-  const handleDisplayPropertyVisibility = (key: keyof IIssueDisplayProperties): boolean => {
-    const visibility = true;
-    if (key === "modules" && moduleId) return false;
-    if (key === "cycle" && cycleId) return false;
-    return visibility;
-  };
-
   return (
     <>
       <FilterHeader
@@ -36,27 +26,24 @@ export const FilterDisplayProperties: React.FC<Props> = observer((props) => {
       />
       {previewEnabled && (
         <div className="mt-1 flex flex-wrap items-center gap-2">
-          {ISSUE_DISPLAY_PROPERTIES.map(
-            (displayProperty) =>
-              handleDisplayPropertyVisibility(displayProperty?.key) && (
-                <button
-                  key={displayProperty.key}
-                  type="button"
-                  className={`rounded border px-2 py-0.5 text-xs transition-all ${
-                    displayProperties?.[displayProperty.key]
-                      ? "border-custom-primary-100 bg-custom-primary-100 text-white"
-                      : "border-custom-border-200 hover:bg-custom-background-80"
-                  }`}
-                  onClick={() =>
-                    handleUpdate({
-                      [displayProperty.key]: !displayProperties?.[displayProperty.key],
-                    })
-                  }
-                >
-                  {displayProperty.title}
-                </button>
-              )
-          )}
+          {ISSUE_DISPLAY_PROPERTIES.map((displayProperty) => (
+            <button
+              key={displayProperty.key}
+              type="button"
+              className={`rounded border px-2 py-0.5 text-xs transition-all ${
+                displayProperties?.[displayProperty.key]
+                  ? "border-custom-primary-100 bg-custom-primary-100 text-white"
+                  : "border-custom-border-200 hover:bg-custom-background-80"
+              }`}
+              onClick={() =>
+                handleUpdate({
+                  [displayProperty.key]: !displayProperties?.[displayProperty.key],
+                })
+              }
+            >
+              {displayProperty.title}
+            </button>
+          ))}
         </div>
       )}
     </>
diff --git a/web/components/issues/issue-layouts/properties/all-properties.tsx b/web/components/issues/issue-layouts/properties/all-properties.tsx
index 8b3e2e673..c3a6bc037 100644
--- a/web/components/issues/issue-layouts/properties/all-properties.tsx
+++ b/web/components/issues/issue-layouts/properties/all-properties.tsx
@@ -52,7 +52,7 @@ export const IssueProperties: React.FC<IIssueProperties> = observer((props) => {
   const { getStateById } = useProjectState();
   // router
   const router = useRouter();
-  const { workspaceSlug, cycleId, moduleId } = router.query;
+  const { workspaceSlug } = router.query;
   const currentLayout = `${activeLayout} layout`;
   // derived values
   const stateDetails = getStateById(issue.state_id);
@@ -328,38 +328,34 @@ export const IssueProperties: React.FC<IIssueProperties> = observer((props) => {
       </WithDisplayPropertiesHOC>
 
       {/* modules */}
-      {moduleId === undefined && (
-        <WithDisplayPropertiesHOC displayProperties={displayProperties} displayPropertyKey="modules">
-          <div className="h-5">
-            <ModuleDropdown
-              projectId={issue?.project_id}
-              value={issue?.module_ids ?? []}
-              onChange={handleModule}
-              disabled={isReadOnly}
-              multiple
-              buttonVariant="border-with-text"
-              showCount
-              showTooltip
-            />
-          </div>
-        </WithDisplayPropertiesHOC>
-      )}
+      <WithDisplayPropertiesHOC displayProperties={displayProperties} displayPropertyKey="modules">
+        <div className="h-5">
+          <ModuleDropdown
+            projectId={issue?.project_id}
+            value={issue?.module_ids ?? []}
+            onChange={handleModule}
+            disabled={isReadOnly}
+            multiple
+            buttonVariant="border-with-text"
+            showCount
+            showTooltip
+          />
+        </div>
+      </WithDisplayPropertiesHOC>
 
       {/* cycles */}
-      {cycleId === undefined && (
-        <WithDisplayPropertiesHOC displayProperties={displayProperties} displayPropertyKey="cycle">
-          <div className="h-5 truncate">
-            <CycleDropdown
-              projectId={issue?.project_id}
-              value={issue?.cycle_id}
-              onChange={handleCycle}
-              disabled={isReadOnly}
-              buttonVariant="border-with-text"
-              showTooltip
-            />
-          </div>
-        </WithDisplayPropertiesHOC>
-      )}
+      <WithDisplayPropertiesHOC displayProperties={displayProperties} displayPropertyKey="cycle">
+        <div className="h-5 truncate">
+          <CycleDropdown
+            projectId={issue?.project_id}
+            value={issue?.cycle_id}
+            onChange={handleCycle}
+            disabled={isReadOnly}
+            buttonVariant="border-with-text"
+            showTooltip
+          />
+        </div>
+      </WithDisplayPropertiesHOC>
 
       {/* estimates */}
       {areEstimatesEnabledForCurrentProject && (