disable web terminal when MCH flag is available

frontend/packages/console-app/src/components/cloud-shell/CloudShellMastheadButton.tsx

@@ -6,6 +6,7 @@ import { connect } from 'react-redux';
 import { RootState } from '@console/internal/redux';
 import { toggleCloudShellExpanded } from '../../redux/actions/cloud-shell-actions';
 import { isCloudShellExpanded } from '../../redux/reducers/cloud-shell-selectors';
+import isMultiClusterEnabled from '../../utils/isMultiClusterEnabled';
 import useCloudShellAvailable from './useCloudShellAvailable';
 
 type DispatchProps = {
@@ -20,9 +21,10 @@ type Props = StateProps & DispatchProps;
 
 const ClouldShellMastheadButton: React.FC<Props> = ({ onClick, open }) => {
   const terminalAvailable = useCloudShellAvailable();
+
   const { t } = useTranslation();
 
-  if (!terminalAvailable) {
+  if (!terminalAvailable || isMultiClusterEnabled()) {
     return null;
   }
 

frontend/packages/console-app/src/components/cloud-shell/CloudShellTab.tsx

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import { Redirect } from 'react-router';
+import isMultiClusterEnabled from '@console/app/src/utils/isMultiClusterEnabled';
 import { InlineTechPreviewBadge, useFlag } from '@console/shared';
 import { FLAG_DEVWORKSPACE } from '../../consts';
 import CloudShellTerminal from './CloudShellTerminal';
@@ -10,7 +11,7 @@ const CloudShellTab: React.FC = () => {
   const { t } = useTranslation();
   const devWorkspaceFlag = useFlag(FLAG_DEVWORKSPACE);
 
-  if (devWorkspaceFlag === false) return <Redirect to="/" />;
+  if (devWorkspaceFlag === false || isMultiClusterEnabled()) return <Redirect to="/" />;
 
   return (
     <>

frontend/packages/console-app/src/components/cloud-shell/__tests__/CloudShellTab.spec.tsx

@@ -13,22 +13,38 @@ jest.mock('react-i18next', () => {
   };
 });
 
-describe('CloudShellTab', () => {
-  it('should render CloudShellTerminal', () => {
-    spyOn(shared, 'useFlag').and.returnValue(true);
-    const cloudShellTabWrapper = shallow(<CloudShellTab />);
-    expect(cloudShellTabWrapper.find(CloudShellTerminal).exists()).toBe(true);
-  });
+// jest.mock('@console/app/src/utils/isMultiClusterEnabled', () => {
+//   return {
+//     isMultiClusterEnabled: jest.fn(),
+//   };
+// });
 
+describe('CloudShellTab', () => {
   it('should not render redirect component if flag check is pending', () => {
     spyOn(shared, 'useFlag').and.returnValue(undefined);
+    window.SERVER_FLAGS = { isMultiClusterEnabled: 'false' };
     const cloudShellTabWrapper = shallow(<CloudShellTab />);
     expect(cloudShellTabWrapper.find(Redirect).exists()).toBe(false);
   });
 
-  it('should render redirect component if terminal operator is not installed', () => {
+  it('should render redirect component if both Devworkspaceflag and MCH is false', () => {
     spyOn(shared, 'useFlag').and.returnValue(false);
+    window.SERVER_FLAGS = { isMultiClusterEnabled: 'false' };
     const cloudShellTabWrapper = shallow(<CloudShellTab />);
     expect(cloudShellTabWrapper.find(Redirect).exists()).toBe(true);
   });
+
+  it('should not render CloudShellTerminal when both flags are true', () => {
+    spyOn(shared, 'useFlag').and.returnValue(true);
+    window.SERVER_FLAGS = { isMultiClusterEnabled: 'true' };
+    const cloudShellTabWrapper = shallow(<CloudShellTab />);
+    expect(cloudShellTabWrapper.find(CloudShellTerminal).exists()).toBe(false);
+  });
+
+  it('should render CloudShellTerminal when Devworkspaceflag is true and MCH flag is false', () => {
+    spyOn(shared, 'useFlag').and.returnValue(true);
+    window.SERVER_FLAGS = { isMultiClusterEnabled: 'false' };
+    const cloudShellTabWrapper = shallow(<CloudShellTab />);
+    expect(cloudShellTabWrapper.find(CloudShellTerminal).exists()).toBe(true);
+  });
 });

frontend/packages/console-app/src/plugin.tsx

@@ -22,7 +22,6 @@ import {
   DashboardsOverviewInventoryItem,
   DashboardsOverviewHealthOperator,
   ResourceDetailsPage,
-  CustomFeatureFlag,
   ResourceListPage,
   ResourceTabPage,
 } from '@console/plugin-sdk';
@@ -38,7 +37,6 @@ import {
   getControlPlaneHealth,
   getClusterOperatorHealthStatus,
 } from './components/dashboards-page/status';
-import { detectMCHAvailability } from './features';
 import * as models from './models';
 import {
   API_SERVERS_UP,
@@ -57,7 +55,6 @@ type ConsumedExtensions =
   | DashboardsOverviewInventoryItem
   | DashboardsOverviewHealthOperator<ClusterOperator>
   | ResourceListPage
-  | CustomFeatureFlag
   | ResourceDetailsPage
   | ResourceTabPage;
 
@@ -196,12 +193,6 @@ const plugin: Plugin<ConsumedExtensions> = [
       required: [FLAGS.CLUSTER_VERSION],
     },
   },
-  {
-    type: 'FeatureFlag/Custom',
-    properties: {
-      detect: detectMCHAvailability,
-    },
-  },
   {
     type: 'Page/Route',
     properties: {

frontend/packages/console-app/src/utils/__tests__/isMultiClusterEnabled.spec.ts

@@ -0,0 +1,19 @@
+import isMultiClusterEnabled from '../isMultiClusterEnabled';
+
+describe('isMultiClusterEnabled', () => {
+  it('should return false when no flag data exists', () => {
+    window.SERVER_FLAGS = {};
+    const isEnabled = isMultiClusterEnabled();
+    expect(isEnabled).toBe(false);
+  });
+  it('should return false when flag is set to false', () => {
+    window.SERVER_FLAGS = { isMultiClusterEnabled: 'false' };
+    const isEnabled = isMultiClusterEnabled();
+    expect(isEnabled).toBe(false);
+  });
+  it('should return false when flag is set to true', () => {
+    window.SERVER_FLAGS = { isMultiClusterEnabled: 'true' };
+    const isEnabled = isMultiClusterEnabled();
+    expect(isEnabled).toBe(true);
+  });
+});

frontend/packages/console-app/src/utils/isMultiClusterEnabled.ts

@@ -0,0 +1,16 @@
+const isMultiClusterEnabled = (): boolean => {
+  let isAvailable = false;
+  // Mock implementation. needs update
+  const mchFlagData = window.SERVER_FLAGS.isMultiClusterEnabled;
+  try {
+    if (mchFlagData) {
+      isAvailable = JSON.parse(mchFlagData) === true; // to-do: update logic/flag when finalised
+    }
+  } catch (e) {
+    // eslint-disable-next-line no-console
+    console.error('error while parsing SERVER_FLAG.isMultiClusterEnabled', e);
+  }
+  return isAvailable;
+};
+
+export default isMultiClusterEnabled;