ENG-2807: Gate all Entra UI content behind entraMonitor feature flag

changelog/7744.yaml

@@ -0,0 +1,3 @@
+type: changed
+description: Gate all Entra UI content behind entraMonitor feature flag across integration list, detail page, and action center
+pr: 7744

clients/admin-ui/src/features/data-discovery-and-detection/action-center/MonitorList.tsx

@@ -19,6 +19,7 @@ import useSearchForm from "~/features/data-discovery-and-detection/action-center
 import { MonitorResult } from "~/features/data-discovery-and-detection/action-center/MonitorResult";
 import { MONITOR_TYPES } from "~/features/data-discovery-and-detection/action-center/utils/getMonitorType";
 import { useGetUserMonitorsQuery } from "~/features/user-management";
+import { ConnectionType } from "~/types/api";
 
 import MonitorListSearchForm from "./forms/MonitorListSearchForm";
 import {
@@ -30,7 +31,7 @@ import {
 const MonitorList = () => {
   const toast = useToast();
   const {
-    flags: { webMonitor: webMonitorEnabled },
+    flags: { entraMonitor: entraMonitorEnabled, webMonitor: webMonitorEnabled },
   } = useFeatures();
   const { paginationProps, pageIndex, pageSize, resetPagination } =
     useAntPagination();
@@ -96,9 +97,18 @@ const MonitorList = () => {
   }, [isError, toast]);
 
   const results =
-    data?.items?.flatMap((monitor) =>
-      !!monitor.key && typeof monitor.key !== "undefined" ? [monitor] : [],
-    ) || [];
+    data?.items?.flatMap((monitor) => {
+      if (!monitor.key || typeof monitor.key === "undefined") {
+        return [];
+      }
+      if (
+        !entraMonitorEnabled &&
+        monitor.connection_type === ConnectionType.ENTRA
+      ) {
+        return [];
+      }
+      return [monitor];
+    }) || [];
 
   return (
     <Flex className="h-[calc(100%-48px)] overflow-hidden" gap="medium" vertical>

clients/admin-ui/src/pages/integrations/[id].tsx

@@ -3,6 +3,7 @@ import { NextPage } from "next";
 import { useRouter } from "next/router";
 
 import ErrorPage from "~/features/common/errors/ErrorPage";
+import { useFlags } from "~/features/common/features";
 import FixedLayout from "~/features/common/FixedLayout";
 import { INTEGRATION_MANAGEMENT_ROUTE } from "~/features/common/nav/routes";
 import PageHeader from "~/features/common/PageHeader";
@@ -25,6 +26,7 @@ import { ConnectionType } from "~/types/api";
 const IntegrationDetailView: NextPage = () => {
   const router = useRouter();
   const id = router.query.id as string;
+  const { flags } = useFlags();
 
   const {
     data: connection,
@@ -73,7 +75,9 @@ const IntegrationDetailView: NextPage = () => {
 
   if (
     !!connection &&
-    !SUPPORTED_INTEGRATIONS.includes(connection.connection_type)
+    (!SUPPORTED_INTEGRATIONS.includes(connection.connection_type) ||
+      (connection.connection_type === ConnectionType.ENTRA &&
+        !flags.entraMonitor))
   ) {
     router.push(INTEGRATION_MANAGEMENT_ROUTE);
   }

clients/admin-ui/src/pages/integrations/index.tsx

@@ -78,7 +78,7 @@ const IntegrationListView: NextPage = () => {
   const router = useRouter();
 
   const {
-    flags: { newIntegrationManagement },
+    flags: { entraMonitor, newIntegrationManagement },
   } = useFlags();
 
   const handleSearchChange = (value: string) => {
@@ -105,17 +105,20 @@ const IntegrationListView: NextPage = () => {
     [connectionTypesData],
   );
 
-  // Filter connection types based on the new integration management flag
+  // Filter connection types based on feature flags
   const connectionTypesToQuery = useMemo(() => {
-    if (newIntegrationManagement) {
-      // Show all integrations (including SaaS) when the flag is enabled
-      return SUPPORTED_INTEGRATIONS;
+    let types = SUPPORTED_INTEGRATIONS;
+
+    if (!entraMonitor) {
+      types = types.filter((type) => type !== ConnectionType.ENTRA);
     }
-    // Hide SaaS integrations when the flag is disabled
-    return SUPPORTED_INTEGRATIONS.filter(
-      (type) => type !== ConnectionType.SAAS,
-    );
-  }, [newIntegrationManagement]);
+
+    if (!newIntegrationManagement) {
+      types = types.filter((type) => type !== ConnectionType.SAAS);
+    }
+
+    return types;
+  }, [entraMonitor, newIntegrationManagement]);
 
   const { data, isLoading, error } = useGetAllDatastoreConnectionsQuery({
     connection_type: connectionTypesToQuery,