fix: Do not show community modules card and nav item when the flag is disabled (#4648)

Author: awoloszyn22

src/components/Clusters/views/ClusterOverview/ClusterDetails.jsx

@@ -15,6 +15,8 @@ import { CommunityModuleContextProvider } from 'components/Modules/community/pro
 import { ModuleTemplatesContextProvider } from 'components/Modules/providers/ModuleTemplatesProvider';
 import { useGetEnvironmentParameters } from './useGetEnvironmentParameters';
 import { Tokens } from 'shared/components/Tokens';
+import { useFeature } from 'hooks/useFeature';
+import { configFeaturesNames } from 'state/types';
 
 const GardenerProvider = () => {
   const { t } = useTranslation();
@@ -42,6 +44,9 @@ export default function ClusterDetails({ currentCluster }) {
   );
   const { natGatewayIps, environmentParametersLoading } =
     useGetEnvironmentParameters();
+  const { isEnabled: isCommunityModulesEnabled } = useFeature(
+    configFeaturesNames.COMMUNITY_MODULES,
+  );
 
   return (
     <section aria-labelledby="cluster-details-heading">
@@ -108,11 +113,13 @@ export default function ClusterDetails({ currentCluster }) {
             </>
           }
         />
-        <ModuleTemplatesContextProvider>
-          <CommunityModuleContextProvider>
-            <ClusterModulesCard />
-          </CommunityModuleContextProvider>
-        </ModuleTemplatesContextProvider>
+        {(kymaResources || isCommunityModulesEnabled) && (
+          <ModuleTemplatesContextProvider>
+            <CommunityModuleContextProvider>
+              <ClusterModulesCard />
+            </CommunityModuleContextProvider>
+          </ModuleTemplatesContextProvider>
+        )}
       </div>
     </section>
   );

src/state/navigation/addAdditionalNodes.ts

@@ -18,6 +18,7 @@ export const addAdditionalNodes = (
   navNodes: NavNode[],
   scope: Scope,
   configFeatures: ConfigFeatureList,
+  isKymaResources: boolean,
 ) => {
   const extNavList = [...navNodes];
 
@@ -35,13 +36,15 @@ export const addAdditionalNodes = (
     if (scope === 'cluster') {
       addResource(extensionsNavNode, extNavList.length, extNavList);
     }
-    addResource(
-      scope === 'cluster'
-        ? kymaModulesNavNode
-        : { ...kymaModulesNavNode, namespaced: true },
-      extNavList.length,
-      extNavList,
-    );
+    if (configFeatures.COMMUNITY_MODULES?.isEnabled || isKymaResources) {
+      addResource(
+        scope === 'cluster'
+          ? kymaModulesNavNode
+          : { ...kymaModulesNavNode, namespaced: true },
+        extNavList.length,
+        extNavList,
+      );
+    }
   }
 
   const crdIndex = findResourceIndex(crd, navNodes) + 1;

src/state/navigation/clusterAndNsNodesAtom.ts

@@ -8,13 +8,15 @@ import { permissionSetsAtom } from '../permissionSetsAtom';
 import { NavNode, Scope } from '../types';
 import { shouldNodeBeVisible } from './filters/shouldNodeBeVisible';
 import { addAdditionalNodes } from './addAdditionalNodes';
+import { kymaResourcesAtom } from 'state/kymaResourcesAtom';
 
 export const clusterAndNsNodesAtom = atom<Promise<NavNode[]>>(async (get) => {
   const resourceList: NavNode[] = get(resourceListAtom);
   const activeNamespaceId = get(activeNamespaceIdAtom);
   const openapiPathIdList = get(openapiPathIdListAtom);
   const permissionSet = await get(permissionSetsAtom);
   const configuration = get(configurationAtom);
+  const kymaResources = await get(kymaResourcesAtom);
 
   const features = configuration?.features || {};
 
@@ -44,7 +46,12 @@ export const clusterAndNsNodesAtom = atom<Promise<NavNode[]>>(async (get) => {
   );
 
   const scope: Scope = activeNamespaceId ? 'namespace' : 'cluster';
-  const navNodesWithAddons = addAdditionalNodes(navNodes, scope, features!);
+  const navNodesWithAddons = addAdditionalNodes(
+    navNodes,
+    scope,
+    features!,
+    !!kymaResources,
+  );
 
   return navNodesWithAddons;
 });