From 67d197d060c1802f5c58aa2f93e2a809c1a69843 Mon Sep 17 00:00:00 2001
From: Akshita Goyal <36129505+gakshita@users.noreply.github.com>
Date: Thu, 1 Aug 2024 13:16:08 +0530
Subject: [PATCH] [WEB-1955] fix: Advanced bulk ops feature flagging (#730)

* fix: Advanced bulk ops feature flagging

* fix: Refactoring

* fix: Refactoring
---
 .../issues/bulk-operations/properties.tsx     | 121 +++++++++---------
 web/ee/hooks/store/use-flag.ts                |   1 +
 2 files changed, 65 insertions(+), 57 deletions(-)

diff --git a/web/ee/components/issues/bulk-operations/properties.tsx b/web/ee/components/issues/bulk-operations/properties.tsx
index d8233da144..a6ef1d5de7 100644
--- a/web/ee/components/issues/bulk-operations/properties.tsx
+++ b/web/ee/components/issues/bulk-operations/properties.tsx
@@ -29,6 +29,7 @@ import { getDate, renderFormattedPayloadDate } from "@/helpers/date-time.helper"
 import { useProjectEstimates } from "@/hooks/store";
 import { useIssuesStore } from "@/hooks/use-issue-layout-store";
 import { TSelectionHelper, TSelectionSnapshot } from "@/hooks/use-multiple-select";
+import { useFlag } from "@/plane-web/hooks/store/use-flag";
 
 type Props = {
   selectionHelpers: TSelectionHelper;
@@ -59,6 +60,8 @@ export const IssueBulkOperationsProperties: React.FC<Props> = observer((props) =
     issues: { bulkUpdateProperties },
   } = useIssuesStore();
   const { currentActiveEstimateId } = useProjectEstimates();
+  const isAdvancedBulkOpsEnabled = useFlag("BULK_OPS_ADVANCED");
+
   // form info
   const {
     control,
@@ -234,66 +237,70 @@ export const IssueBulkOperationsProperties: React.FC<Props> = observer((props) =
             )}
           />
         )}
-        {projectId && (
-          <Controller
-            name="cycle_id"
-            control={control}
-            render={({ field: { onChange, value } }) => (
-              <>
-                <CycleDropdown
-                  value={value as string | null}
-                  onChange={onChange}
-                  projectId={projectId.toString()}
-                  buttonVariant="border-with-text"
-                  buttonClassName="text-custom-text-300 py-1 rounded"
-                  disabled={isUpdateDisabled}
-                  placement="top-start"
-                  placeholder="Cycle"
-                />
-              </>
-            )}
-          />
-        )}
-        {projectId && currentActiveEstimateId && (
-          <Controller
-            name="estimate_point"
-            control={control}
-            render={({ field: { onChange, value } }) => (
-              <EstimateDropdown
-                value={value as string | null}
-                onChange={onChange}
-                projectId={projectId.toString()}
-                buttonVariant="border-with-text"
-                buttonClassName="text-custom-text-300 py-1"
-                disabled={isUpdateDisabled}
-                placement="top-start"
-                placeholder="Estimates"
+        {!isAdvancedBulkOpsEnabled && (
+          <>
+            {projectId && (
+              <Controller
+                name="cycle_id"
+                control={control}
+                render={({ field: { onChange, value } }) => (
+                  <>
+                    <CycleDropdown
+                      value={value as string | null}
+                      onChange={onChange}
+                      projectId={projectId.toString()}
+                      buttonVariant="border-with-text"
+                      buttonClassName="text-custom-text-300 py-1 rounded"
+                      disabled={isUpdateDisabled}
+                      placement="top-start"
+                      placeholder="Cycle"
+                    />
+                  </>
+                )}
               />
             )}
-          />
-        )}
-        {projectId && (
-          <Controller
-            name="module_ids"
-            control={control}
-            render={({ field: { onChange, value } }) => (
-              <>
-                <ModuleDropdown
-                  value={value}
-                  onChange={onChange}
-                  projectId={projectId.toString()}
-                  buttonVariant="border-with-text"
-                  buttonClassName="text-custom-text-300 border-none  px-2 py-1"
-                  buttonContainerClassName="border-[0.5px] border-custom-border-300 rounded"
-                  disabled={isUpdateDisabled}
-                  placement="top-start"
-                  placeholder="Module"
-                  showCount
-                  multiple
-                />
-              </>
+            {projectId && currentActiveEstimateId && (
+              <Controller
+                name="estimate_point"
+                control={control}
+                render={({ field: { onChange, value } }) => (
+                  <EstimateDropdown
+                    value={value as string | null}
+                    onChange={onChange}
+                    projectId={projectId.toString()}
+                    buttonVariant="border-with-text"
+                    buttonClassName="text-custom-text-300 py-1"
+                    disabled={isUpdateDisabled}
+                    placement="top-start"
+                    placeholder="Estimates"
+                  />
+                )}
+              />
             )}
-          />
+            {projectId && (
+              <Controller
+                name="module_ids"
+                control={control}
+                render={({ field: { onChange, value } }) => (
+                  <>
+                    <ModuleDropdown
+                      value={value}
+                      onChange={onChange}
+                      projectId={projectId.toString()}
+                      buttonVariant="border-with-text"
+                      buttonClassName="text-custom-text-300 border-none  px-2 py-1"
+                      buttonContainerClassName="border-[0.5px] border-custom-border-300 rounded"
+                      disabled={isUpdateDisabled}
+                      placement="top-start"
+                      placeholder="Module"
+                      showCount
+                      multiple
+                    />
+                  </>
+                )}
+              />
+            )}
+          </>
         )}
       </div>
       {isDirty && (
diff --git a/web/ee/hooks/store/use-flag.ts b/web/ee/hooks/store/use-flag.ts
index f8f6acbff7..21b905fce2 100644
--- a/web/ee/hooks/store/use-flag.ts
+++ b/web/ee/hooks/store/use-flag.ts
@@ -4,6 +4,7 @@ import { StoreContext } from "@/lib/store-context";
 
 export enum E_FEATURE_FLAGS {
   BULK_OPS = "BULK_OPS",
+  BULK_OPS_ADVANCED = "BULK_OPS_ADVANCED",
   ESTIMATE_WITH_TIME = "ESTIMATE_WITH_TIME",
   ISSUE_TYPE_DISPLAY = "ISSUE_TYPE_DISPLAY",
   ISSUE_TYPE_SETTINGS = "ISSUE_TYPE_SETTINGS",