Customization of developer catalog and sub-catalogs

cmd/bridge/main.go

@@ -131,6 +131,7 @@ func main() {
 	fLoadTestFactor := fs.Int("load-test-factor", 0, "DEV ONLY. The factor used to multiply k8s API list responses for load testing purposes.")
 
 	fDevCatalogCategories := fs.String("developer-catalog-categories", "", "Allow catalog categories customization. (JSON as string)")
+	fDevCatalogTypes := fs.String("developer-catalog-types", "", "Allow enabling/disabling of sub-catalog types from the developer catalog. (JSON as string)")
 	fUserSettingsLocation := fs.String("user-settings-location", "configmap", "DEV ONLY. Define where the user settings should be stored. (configmap | localstorage).")
 	fQuickStarts := fs.String("quick-starts", "", "Allow customization of available ConsoleQuickStart resources in console. (JSON as string)")
 	fAddPage := fs.String("add-page", "", "DEV ONLY. Allow add page customization. (JSON as string)")
@@ -257,6 +258,7 @@ func main() {
 		LoadTestFactor:            *fLoadTestFactor,
 		InactivityTimeout:         *fInactivityTimeout,
 		DevCatalogCategories:      *fDevCatalogCategories,
+		DevCatalogTypes: 		   *fDevCatalogTypes,
 		UserSettingsLocation:      *fUserSettingsLocation,
 		EnabledConsolePlugins:     consolePluginsFlags,
 		I18nNamespaces:            i18nNamespaces,

frontend/@types/console/index.d.ts

@@ -43,6 +43,7 @@ declare interface Window {
     GOOS: string;
     graphqlBaseURL: string;
     developerCatalogCategories: string;
+    developerCatalogTypes: string;
     userSettingsLocation: string;
     addPage: string; // JSON encoded configuration
     consolePlugins: string[]; // Console dynamic plugins enabled on the cluster

frontend/packages/console-dynamic-plugin-sdk/docs/console-extensions.md

@@ -223,6 +223,7 @@ ResourceActionProvider contributes a hook that returns list of actions for speci
 | `typeDescription` | `string` | yes | Description for the catalog item type. |
 | `filters` | `CatalogItemAttribute[]` | yes | Custom filters specific to the catalog item. |
 | `groupings` | `CatalogItemAttribute[]` | yes | Custom groupings specific to the catalog item. |
+| `enabledType` | `boolean` | yes | Indicated the sub-catalog is enabled or not |
 
 ---
 

frontend/packages/console-dynamic-plugin-sdk/src/extensions/actions.ts

@@ -126,6 +126,8 @@ export type Action = {
   insertAfter?: string | string[];
   /** Describes the access check to perform. */
   accessReview?: AccessReviewResourceAttributes;
+  /** check if sub-catalog type is enabled or not */
+  isEnabled?: boolean;
 };
 
 export type GroupedMenuOption = ActionGroup['properties'] & {

frontend/packages/console-dynamic-plugin-sdk/src/extensions/catalog.ts

@@ -17,6 +17,8 @@ export type CatalogItemType = ExtensionDeclaration<
     filters?: CatalogItemAttribute[];
     /** Custom groupings specific to the catalog item. */
     groupings?: CatalogItemAttribute[];
+    /** Indicated the sub-catalog is enabled or not */
+    enabledType?: boolean;
   }
 >;
 

frontend/packages/console-shared/src/components/catalog/CatalogController.tsx

@@ -130,6 +130,7 @@ const CatalogController: React.FC<CatalogControllerProps> = ({
       label: extension.properties.title,
       value: extension.properties.type,
       description: extension.properties.typeDescription,
+      enabledType: extension.properties?.enabledType,
     }));
 
     return _.sortBy(types, ({ label }) => label.toLowerCase());

frontend/packages/console-shared/src/components/catalog/catalog-view/CatalogTypeSelector.tsx

@@ -39,7 +39,7 @@ const CatalogTypeSelector: React.FC<CatalogTypeSelectorProps> = ({
       </Title>
       <VerticalTabs data-test="catalog-types">
         {catalogTypes.map((type) => {
-          const { value, label } = type;
+          const { value, label, enabledType } = type;
           const typeCount = catalogTypeCounts[value];
           const queryParams = new URLSearchParams(search);
           queryParams.set(CatalogQueryParams.TYPE, type.value);
@@ -49,7 +49,7 @@ const CatalogTypeSelector: React.FC<CatalogTypeSelectorProps> = ({
             search: `?${queryParams.toString()}`,
           };
 
-          return typeCount > 0 ? (
+          return typeCount > 0 && enabledType ? (
             <li key={value} className="vertical-tabs-pf-tab" data-test={`tab ${value}`}>
               <Link to={to}>{`${label} (${typeCount})`}</Link>
             </li>

frontend/packages/console-shared/src/components/catalog/hooks/__tests__/useCatalogExtensions.spec.ts

@@ -26,13 +26,15 @@ describe('useCatalogExtensions', () => {
       {
         type: 'console.catalog/item-type',
         properties: {
+          enabledType: true,
           type: 'type1',
           title: 'Test',
         },
       },
       {
         type: 'console.catalog/item-type',
         properties: {
+          enabledType: true,
           type: 'type2',
           title: 'Test2',
         },
@@ -50,6 +52,7 @@ describe('useCatalogExtensions', () => {
       {
         type: 'console.catalog/item-type',
         properties: {
+          enabledType: true,
           type: 'type1',
           title: 'Test',
           filters: [
@@ -69,6 +72,7 @@ describe('useCatalogExtensions', () => {
       {
         type: 'console.catalog/item-type',
         properties: {
+          enabledType: true,
           type: 'type2',
           title: 'Test2',
           filters: [
@@ -112,6 +116,7 @@ describe('useCatalogExtensions', () => {
       {
         type: 'console.catalog/item-type',
         properties: {
+          enabledType: true,
           type: 'type2',
           title: 'Test2',
           filters: [

frontend/packages/console-shared/src/components/catalog/hooks/useCatalogExtensions.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import * as _ from 'lodash';
+import { GetAllSubCatalogsDisabled } from '@console/dev-console/src/utils/useAddActionExtensions';
 import { useResolvedExtensions, ResolvedExtension } from '@console/dynamic-plugin-sdk';
 import {
   CatalogItemFilter,
@@ -24,6 +25,7 @@ const useCatalogExtensions = (
   ResolvedExtension<CatalogItemMetadataProvider>[],
   boolean,
 ] => {
+  const [disabledSubCatalogs] = GetAllSubCatalogsDisabled();
   const [itemTypeExtensions, itemTypesResolved] = useResolvedExtensions<CatalogItemType>(
     React.useCallback(
       (e): e is CatalogItemType =>
@@ -80,6 +82,7 @@ const useCatalogExtensions = (
         ? itemTypeExtensions.filter((e) => e.properties.type === catalogType)
         : itemTypeExtensions
       ).map((e) => {
+        const subCatalogEnabledType = !disabledSubCatalogs?.includes(e?.properties?.type);
         const metadataExts = typeMetadataExtensions.filter(
           (em) => e.properties.type === em.properties.type,
         );
@@ -95,12 +98,18 @@ const useCatalogExtensions = (
                 ...(e.properties.groupings ?? []),
                 ..._.flatten(metadataExts.map((em) => em.properties.groupings).filter((x) => x)),
               ],
+              enabledType: subCatalogEnabledType,
             },
           });
         }
-        return e;
+        return Object.assign({}, e, {
+          properties: {
+            ...e.properties,
+            enabledType: subCatalogEnabledType,
+          },
+        });
       }),
-    [catalogType, itemTypeExtensions, typeMetadataExtensions],
+    [catalogType, disabledSubCatalogs, itemTypeExtensions, typeMetadataExtensions],
   );
 
   catalogProviderExtensions.sort((a, b) => {

frontend/packages/console-shared/src/components/catalog/service/CatalogServiceProvider.tsx

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import * as _ from 'lodash';
+import { GetAllSubCatalogsDisabled } from '@console/dev-console/src/utils/useAddActionExtensions';
 import {
   CatalogExtensionHookOptions,
   CatalogItem,
@@ -47,7 +48,7 @@ const CatalogServiceProvider: React.FC<CatalogServiceProviderProps> = ({
     catalogBadgeProviderExtensions,
     extensionsResolved,
   ] = useCatalogExtensions(catalogId, catalogType);
-
+  const [disabledSubCatalogs] = GetAllSubCatalogsDisabled();
   const [extItemsMap, setExtItemsMap] = React.useState<{ [uid: string]: CatalogItem[] }>({});
   const [extItemsErrorMap, setItemsErrorMap] = React.useState<{ [uid: string]: Error }>({});
   const [metadataProviderMap, setMetadataProviderMap] = React.useState<{
@@ -63,13 +64,16 @@ const CatalogServiceProvider: React.FC<CatalogServiceProviderProps> = ({
         ? catalogProviderExtensions.some(({ uid }) => extItemsMap[uid] || extItemsErrorMap[uid])
         : catalogProviderExtensions.every(({ uid }) => extItemsMap[uid] || extItemsErrorMap[uid])));
 
+  const enabledCatalogProviderExtensions = catalogProviderExtensions.filter((item) => {
+    return !disabledSubCatalogs?.includes(item?.properties?.type);
+  });
   const preCatalogItems = React.useMemo(() => {
     if (!loaded) {
       return [];
     }
 
     const itemMap = _.flatten(
-      catalogProviderExtensions.map((e) =>
+      enabledCatalogProviderExtensions.map((e) =>
         catalogFilterExtensions
           .filter((fe) => fe.properties.type === e.properties.type)
           .reduce((acc, ext) => acc.filter(ext.properties.filter), extItemsMap[e.uid]),
@@ -81,7 +85,7 @@ const CatalogServiceProvider: React.FC<CatalogServiceProviderProps> = ({
     }, {} as { [uid: string]: CatalogItem });
 
     return _.sortBy(Object.values(itemMap), 'name');
-  }, [extItemsMap, loaded, catalogProviderExtensions, catalogFilterExtensions]);
+  }, [extItemsMap, loaded, enabledCatalogProviderExtensions, catalogFilterExtensions]);
 
   const catalogItems = React.useMemo(() => {
     if (!loaded) {

frontend/packages/console-shared/src/components/catalog/utils/types.ts

@@ -41,6 +41,7 @@ export type CatalogType = {
   label: string;
   value: string;
   description: string;
+  enabledType?: boolean;
 };
 
 export type CatalogCategory = {

frontend/packages/dev-console/console-extensions.json

@@ -22,12 +22,21 @@
       "usePerspectiveDetection": { "$codeRef": "perspective.usePerspectiveDetection" }
     }
   },
+  {
+    "type": "console.flag/hookProvider",
+    "properties": {
+      "handler": { "$codeRef": "actions.developerCatalogProvider" }
+    }
+  },
   {
     "type": "dev-console.add/action-group",
     "properties": {
       "id": "developer-catalog",
       "name": "%devconsole~Developer Catalog%",
       "insertBefore": "git-repository"
+    },
+    "flags": {
+      "required": ["DEVELOPER_CATALOG"]
     }
   },
   {
@@ -90,6 +99,9 @@
         { "group": "route.openshift.io", "resource": "routes", "verb": "create" },
         { "group": "", "resource": "services", "verb": "create" }
       ]
+    },
+    "flags": {
+      "required": ["SAMPLE_TYPE"]
     }
   },
   {
@@ -151,6 +163,9 @@
       "label": "%devconsole~All services%",
       "description": "%devconsole~Browse the catalog to discover, deploy and connect to services%",
       "icon": { "$codeRef": "icons.devCatalogIconElement" }
+    },
+    "flags": {
+      "required": ["DEVELOPER_CATALOG"]
     }
   },
   {
@@ -162,6 +177,9 @@
       "label": "%devconsole~Database%",
       "description": "%devconsole~Browse the catalog to discover database services to add to your application%",
       "icon": { "$codeRef": "icons.databaseCatalogIconElement" }
+    },
+    "flags": {
+      "required": ["DEVELOPER_CATALOG"]
     }
   },
   {
@@ -173,6 +191,9 @@
       "label": "%devconsole~Operator Backed%",
       "description": "%devconsole~Browse the catalog to discover and deploy operator managed services%",
       "icon": { "$codeRef": "icons.operatorCatalogIconElement" }
+    },
+    "flags": {
+      "required": ["OPERATOR_BACKED_SERVICE"]
     }
   },
   {