chore: Update available features (#3977)

dbadura · web-flow · commit d083e75fd8cc · 2025-07-14T10:29:20.000+02:00
* update available features

* add another feature as enum

* use enum instead of string in other places

* clean code

* remove unncessary new line
diff --git a/src/components/App/useLoginWithKubeconfigID.ts b/src/components/App/useLoginWithKubeconfigID.ts
@@ -12,10 +12,13 @@ import {
 } from 'state/utils/getClustersInfo';
 import { TFunction } from 'i18next';
 import { useFeature } from 'hooks/useFeature';
-import { ConfigFeature } from 'state/types';
+import {
+  ClusterStorage,
+  ConfigFeature,
+  configFeaturesNames,
+} from 'state/types';
 import { removePreviousPath } from 'state/useAfterInitHook';
 import { configurationAtom } from 'state/configuration/configurationAtom';
-import { ClusterStorage } from 'state/types';
 import {
   KubeConfigMultipleState,
   multipleContexts,
@@ -155,7 +158,9 @@ const loadKubeconfigIdCluster = async (
 export type KubeconfigIdHandleState = 'not started' | 'loading' | 'done';
 
 export function useLoginWithKubeconfigID() {
-  const kubeconfigIdFeature = useFeature<KubeconfigIdFeature>('KUBECONFIG_ID');
+  const kubeconfigIdFeature = useFeature<KubeconfigIdFeature>(
+    configFeaturesNames.KUBECONFIG_ID,
+  );
   const configuration = useRecoilValue(configurationAtom);
   const clusters = useRecoilValue(clustersState);
   const [contextsState, setContextsState] = useRecoilState(multipleContexts);
@@ -238,7 +243,9 @@ export function useLoginWithKubeconfigID() {
 }
 
 export function useLoadDefaultKubeconfigId() {
-  const kubeconfigIdFeature = useFeature<KubeconfigIdFeature>('KUBECONFIG_ID')!;
+  const kubeconfigIdFeature = useFeature<KubeconfigIdFeature>(
+    configFeaturesNames.KUBECONFIG_ID,
+  )!;
   const clusters = useRecoilValue(clustersState);
   const { t } = useTranslation();
   const clusterInfo = useClustersInfo();
diff --git a/src/components/BusolaExtensions/BusolaExtensionDetails.js b/src/components/BusolaExtensions/BusolaExtensionDetails.js
@@ -20,16 +20,17 @@ import { useUrl } from 'hooks/useUrl';
 import {
   formatCurrentVersion,
   getLatestVersion,
+  getMigrationFunctions,
   getSupportedVersions,
   migrateToLatest,
-  getMigrationFunctions,
 } from '../../components/Extensibility/migration';
 import { SectionEditor } from './SectionEditor';
 
 import { BusolaExtensionEdit } from './BusolaExtensionEdit';
 import { SECTIONS } from './helpers';
 import { EXTENSION_VERSION_LABEL } from './constants';
 import { UI5Panel } from 'shared/components/UI5Panel/UI5Panel';
+import { configFeaturesNames } from 'state/types';
 
 export function BusolaExtensionDetails({ name, namespace }) {
   const { t } = useTranslation();
@@ -125,7 +126,9 @@ export function BusolaExtensionDetails({ name, namespace }) {
 
   const ExtensibilityVersion = configmap => {
     const { t } = useTranslation();
-    const { isEnabled: isExtensibilityEnabled } = useFeature('EXTENSIBILITY');
+    const { isEnabled: isExtensibilityEnabled } = useFeature(
+      configFeaturesNames.EXTENSIBILITY,
+    );
     const hasExtensibilityLabel =
       configmap?.metadata?.labels &&
       configmap?.metadata?.labels['busola.io/extension'] === 'resource';
diff --git a/src/components/Clusters/views/ClusterList.js b/src/components/Clusters/views/ClusterList.js
@@ -30,10 +30,11 @@ import { EmptyListComponent } from 'shared/components/EmptyListComponent/EmptyLi
 import { columnLayoutState } from 'state/columnLayoutAtom';
 import { showKymaCompanionState } from 'state/companion/showKymaCompanionAtom';
 import { Link } from 'shared/components/Link/Link';
+import { configFeaturesNames } from 'state/types';
 
 function ClusterList() {
-  const gardenerLoginFeature = useFeature('GARDENER_LOGIN');
-  const kubeconfigIdFeature = useFeature('KUBECONFIG_ID');
+  const gardenerLoginFeature = useFeature(configFeaturesNames.GARDENER_LOGIN);
+  const kubeconfigIdFeature = useFeature(configFeaturesNames.KUBECONFIG_ID);
   const loadDefaultKubeconfigId = useLoadDefaultKubeconfigId();
 
   const clustersInfo = useClustersInfo();
diff --git a/src/components/Clusters/views/ClusterOverview/ClusterDetails.js b/src/components/Clusters/views/ClusterOverview/ClusterDetails.js
@@ -13,10 +13,13 @@ import ResourceDetailsCard from 'shared/components/ResourceDetails/ResourceDetai
 import ClusterModulesCard from './ClusterModulesCard';
 import { ClusterStorageType } from '../ClusterStorageType';
 import { EMPTY_TEXT_PLACEHOLDER } from 'shared/constants';
+import { configFeaturesNames } from 'state/types';
 
 const GardenerProvider = () => {
   const { t } = useTranslation();
-  const showGardenerMetadata = useFeature('SHOW_GARDENER_METADATA')?.isEnabled;
+  const showGardenerMetadata = useFeature(
+    configFeaturesNames.SHOW_GARDENER_METADATA,
+  )?.isEnabled;
 
   const provider = useGetGardenerProvider({
     skip: !showGardenerMetadata,
diff --git a/src/components/Clusters/views/ClusterOverview/ClusterOverview.js b/src/components/Clusters/views/ClusterOverview/ClusterOverview.js
@@ -22,14 +22,15 @@ import BannerCarousel from 'components/Extensibility/components/FeaturedCard/Ban
 import { columnLayoutState } from 'state/columnLayoutAtom';
 
 import './ClusterOverview.scss';
+import { configFeaturesNames } from 'state/types';
 
 const Injections = React.lazy(() =>
   import('../../../Extensibility/ExtensibilityInjections'),
 );
 
 export function ClusterOverview() {
   const { t } = useTranslation();
-  const clusterValidation = useFeature('CLUSTER_VALIDATION');
+  const clusterValidation = useFeature(configFeaturesNames.CLUSTER_VALIDATION);
   const clustersInfo = useClustersInfo();
   const currentCluster = clustersInfo?.currentCluster;
   const notification = useNotification();
diff --git a/src/components/Clusters/views/ClusterOverview/useGetVersions.js b/src/components/Clusters/views/ClusterOverview/useGetVersions.js
@@ -2,10 +2,12 @@ import { useTranslation } from 'react-i18next';
 import { useGet } from 'shared/hooks/BackendAPI/useGet';
 import { getErrorMessage } from 'shared/utils/helpers';
 import { useFeature } from 'hooks/useFeature';
+import { configFeaturesNames } from 'state/types';
 
 export function useGetVersions() {
   const { t } = useTranslation();
-  const showKymaVersion = useFeature('SHOW_KYMA_VERSION')?.isEnabled;
+  const showKymaVersion = useFeature(configFeaturesNames.SHOW_KYMA_VERSION)
+    ?.isEnabled;
 
   const {
     data: k8sVersion,
diff --git a/src/components/Extensibility/ExtensibilityList.js b/src/components/Extensibility/ExtensibilityList.js
@@ -28,6 +28,7 @@ import { createPortal } from 'react-dom';
 import YamlUploadDialog from 'resources/Namespaces/YamlUpload/YamlUploadDialog';
 
 import '../../web-components/eventListenerTracker';
+import { configFeaturesNames } from 'state/types';
 
 export const ExtensibilityListCore = ({
   resMetaData,
@@ -149,7 +150,7 @@ const ExtensibilityList = ({ overrideResMetadata, ...props }) => {
   const resMetaData = overrideResMetadata || defaultResMetadata;
   const { urlPath, defaultPlaceholder } = resMetaData?.general ?? {};
   const { isEnabled: isExtensibilityCustomComponentsEnabled } = useFeature(
-    'EXTENSIBILITY_CUSTOM_COMPONENTS',
+    configFeaturesNames.EXTENSIBILITY_CUSTOM_COMPONENTS,
   );
 
   useEffect(() => {
diff --git a/src/components/Extensibility/components/Wizard.js b/src/components/Extensibility/components/Wizard.js
@@ -9,12 +9,15 @@ import { useGetTranslation } from 'components/Extensibility/helpers';
 import { useTranslation } from 'react-i18next';
 import { useEventListener } from 'hooks/useEventListener';
 import { createPortal } from 'react-dom';
+import { configFeaturesNames } from 'state/types';
 
 export function Wizard({ value, structure, singleRootResource }) {
   const { t: tExt } = useGetTranslation();
   const { t } = useTranslation();
   const [showWizard, setShowWizard] = useState(false);
-  const { isEnabled: isWizardEnabled } = useFeature('EXTENSIBILITY_WIZARD');
+  const { isEnabled: isWizardEnabled } = useFeature(
+    configFeaturesNames.EXTENSIBILITY_WIZARD,
+  );
   const wizardName = structure?.wizard || '';
 
   const handleCloseWithEscape = e => {
diff --git a/src/components/Gardener/GardenerLogin.tsx b/src/components/Gardener/GardenerLogin.tsx
@@ -8,6 +8,7 @@ import { KubeconfigOIDCAuth } from 'types';
 import { GardenerLoginFeature } from './GardenerLoginFeature';
 import { useGardenerLogin } from './useGardenerLoginFunction';
 import { parseOIDCparams } from 'components/Clusters/components/oidc-params';
+import { configFeaturesNames } from 'state/types';
 
 export default function GardenerLogin() {
   const [token, setToken] = useState('');
@@ -16,7 +17,9 @@ export default function GardenerLogin() {
 
   const { t } = useTranslation();
 
-  const gardenerFeature = useFeature<GardenerLoginFeature>('GARDENER_LOGIN');
+  const gardenerFeature = useFeature<GardenerLoginFeature>(
+    configFeaturesNames.GARDENER_LOGIN,
+  );
   const navigate = useNavigate();
   const performGardenerLogin = useGardenerLogin(setReport);
 
diff --git a/src/components/Gardener/useMakeGardenerLoginRoute.tsx b/src/components/Gardener/useMakeGardenerLoginRoute.tsx
@@ -1,11 +1,12 @@
 import { useFeature } from 'hooks/useFeature';
 import React from 'react';
 import { Route } from 'react-router';
+import { configFeaturesNames } from 'state/types';
 
 const GardenerLogin = React.lazy(() => import('./GardenerLogin'));
 
 export function useMakeGardenerLoginRoute() {
-  const gardenerLoginFeature = useFeature('GARDENER_LOGIN');
+  const gardenerLoginFeature = useFeature(configFeaturesNames.GARDENER_LOGIN);
 
   return () => {
     if (gardenerLoginFeature.isEnabled) {
diff --git a/src/components/KymaModules/KymaModulesList.js b/src/components/KymaModules/KymaModulesList.js
@@ -16,12 +16,13 @@ import { checkSelectedModule } from './support';
 import { useRecoilValue } from 'recoil';
 import { columnLayoutState } from 'state/columnLayoutAtom';
 import { useFeature } from 'hooks/useFeature';
+import { configFeaturesNames } from 'state/types';
 
 export default function KymaModulesList({ namespaced }) {
   const { t } = useTranslation();
   const layoutState = useRecoilValue(columnLayoutState);
   const { isEnabled: isCommunityModulesEnabled } = useFeature(
-    'COMMUNITY_MODULES',
+    configFeaturesNames.COMMUNITY_MODULES,
   );
 
   const {
diff --git a/src/components/Preferences/ProtectedSettings.tsx b/src/components/Preferences/ProtectedSettings.tsx
@@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next';
 import { useRecoilState } from 'recoil';
 
 import { disableResourceProtectionState } from 'state/preferences/disableResourceProtectionAtom';
+import { configFeaturesNames } from 'state/types';
 
 export default function ProtectedSettings() {
   const { t } = useTranslation();
@@ -12,8 +13,9 @@ export default function ProtectedSettings() {
     setDisableResourceProtection,
   ] = useRecoilState(disableResourceProtectionState);
 
-  const protectedResourcesEnabled = useFeature('PROTECTED_RESOURCES')
-    ?.isEnabled;
+  const protectedResourcesEnabled = useFeature(
+    configFeaturesNames.PROTECTED_RESOURCES,
+  )?.isEnabled;
 
   if (!protectedResourcesEnabled) return null;
 
diff --git a/src/components/Preferences/ResourceValidation/ResourceValidationSettings.tsx b/src/components/Preferences/ResourceValidation/ResourceValidationSettings.tsx
@@ -14,14 +14,15 @@ import { ValidationFeatureConfig } from 'state/validationEnabledSchemasAtom';
 import { UI5Panel } from 'shared/components/UI5Panel/UI5Panel';
 
 import './ResourceValidationSettings.scss';
+import { configFeaturesNames } from 'state/types';
 
 export default function ResourceValidationSettings() {
   const { t } = useTranslation();
   const [validateResources, setValidateResources] = useRecoilState(
     validateResourcesState,
   );
   const validationFeature = useFeature(
-    'RESOURCE_VALIDATION',
+    configFeaturesNames.RESOURCE_VALIDATION,
   ) as ValidationFeatureConfig;
 
   const {
diff --git a/src/header/Header.tsx b/src/header/Header.tsx
@@ -2,9 +2,9 @@ import { useRef, useState } from 'react';
 import { useRecoilState, useRecoilValue } from 'recoil';
 import {
   Avatar,
+  ListItemStandard,
   ShellBar,
   ShellBarItem,
-  ListItemStandard,
   ToggleButton,
 } from '@ui5/webcomponents-react';
 
@@ -45,7 +45,9 @@ export function Header() {
   const cluster = useRecoilValue(clusterState);
   const clusters = useRecoilValue(clustersState);
 
-  const { isEnabled: isKymaCompanionEnabled } = useFeature('KYMA_COMPANION');
+  const { isEnabled: isKymaCompanionEnabled } = useFeature(
+    configFeaturesNames.KYMA_COMPANION,
+  );
   const [showCompanion, setShowCompanion] = useRecoilState(
     showKymaCompanionState,
   );
diff --git a/src/header/SidebarMenu/useGetHelpLinks.ts b/src/header/SidebarMenu/useGetHelpLinks.ts
@@ -1,6 +1,6 @@
 import { useFeature } from 'hooks/useFeature';
 import { useTranslation } from 'react-i18next';
-import { ConfigFeature } from 'state/types';
+import { ConfigFeature, configFeaturesNames } from 'state/types';
 
 export type GetHelpLink = {
   label: string;
@@ -13,8 +13,9 @@ interface GetHelpLinksFeature extends ConfigFeature {
 
 export const useGetHelpLinks = (): GetHelpLink[] => {
   const { t, i18n } = useTranslation();
-  const getHelpLinksConfig = useFeature<GetHelpLinksFeature>('GET_HELP_LINKS')
-    ?.config;
+  const getHelpLinksConfig = useFeature<GetHelpLinksFeature>(
+    configFeaturesNames.GET_HELP_LINKS,
+  )?.config;
 
   if (!getHelpLinksConfig) return [];
 
diff --git a/src/header/SidebarMenu/useGetLegalLinks.ts b/src/header/SidebarMenu/useGetLegalLinks.ts
@@ -1,6 +1,6 @@
 import { useFeature } from 'hooks/useFeature';
 import { useTranslation } from 'react-i18next';
-import { ConfigFeature } from 'state/types';
+import { ConfigFeature, configFeaturesNames } from 'state/types';
 
 export type LegalLink = {
   label: string;
@@ -13,7 +13,9 @@ interface LegalLinksFeature extends ConfigFeature {
 
 export const useGetLegalLinks = (): LegalLink[] => {
   const { t, i18n } = useTranslation();
-  const legalLinksConfig = useFeature<LegalLinksFeature>('LEGAL_LINKS')?.config;
+  const legalLinksConfig = useFeature<LegalLinksFeature>(
+    configFeaturesNames.LEGAL_LINKS,
+  )?.config;
 
   if (!legalLinksConfig) return [];
 
diff --git a/src/hooks/useSentry.js b/src/hooks/useSentry.js
@@ -1,6 +1,7 @@
-import { useState, useEffect } from 'react';
+import { useEffect, useState } from 'react';
 import * as Sentry from '@sentry/react';
 import { useFeature } from './useFeature';
+import { configFeaturesNames } from 'state/types';
 
 const initSentry = dsn => {
   try {
@@ -23,7 +24,7 @@ const initSentry = dsn => {
 
 export function useSentry() {
   const [dsn, setDsn] = useState(null);
-  const feature = useFeature('SENTRY');
+  const feature = useFeature(configFeaturesNames.SENTRY);
 
   useEffect(() => {
     try {
diff --git a/src/hooks/useVersionWarning.ts b/src/hooks/useVersionWarning.ts
@@ -1,8 +1,9 @@
-import { apiGroupState } from './../state/discoverability/apiGroupsSelector';
+import { apiGroupState } from 'state/discoverability/apiGroupsSelector';
 import { useEffect } from 'react';
 import { useFeature } from 'hooks/useFeature';
 import * as Sentry from '@sentry/react';
 import { useRecoilValue } from 'recoil';
+import { configFeaturesNames } from 'state/types';
 
 export function useVersionWarning({
   resourceUrl,
@@ -12,7 +13,9 @@ export function useVersionWarning({
   resourceType: string;
 }) {
   const apiGroups = useRecoilValue(apiGroupState);
-  const { isEnabled: isTrackingEnabled } = useFeature('SENTRY');
+  const { isEnabled: isTrackingEnabled } = useFeature(
+    configFeaturesNames.SENTRY,
+  );
 
   useEffect(() => {
     if (!isTrackingEnabled) return;
diff --git a/src/shared/components/ResourceGraph/ResourceGraph.tsx b/src/shared/components/ResourceGraph/ResourceGraph.tsx
@@ -8,7 +8,7 @@ import { MemoizedGraphviz } from './GraphvizComponent';
 import { ErrorBoundary } from 'shared/components/ErrorBoundary/ErrorBoundary';
 import { buildGraph } from 'shared/components/ResourceGraph/buildGraph';
 import { Spinner } from 'shared/components/Spinner/Spinner';
-import { useMinWidth, TABLET } from 'hooks/useMinWidth';
+import { TABLET, useMinWidth } from 'hooks/useMinWidth';
 import { SaveGraphControls } from './SaveGraphControls';
 import { DetailsCard } from './DetailsCard/DetailsCard';
 import { EMPTY_TEXT_PLACEHOLDER } from 'shared/constants';
@@ -19,6 +19,7 @@ import { Toolbar } from '@ui5/webcomponents-react-compat/dist/components/Toolbar
 import { ToolbarSpacer } from '@ui5/webcomponents-react-compat/dist/components/ToolbarSpacer/index.js';
 
 import './ResourceGraph.scss';
+import { configFeaturesNames } from 'state/types';
 
 function ResourceGraph({
   resource,
@@ -86,7 +87,7 @@ function ResourceGraph({
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [hasBeenInView]);
-  if (!useFeature('VISUAL_RESOURCES')?.isEnabled) {
+  if (!useFeature(configFeaturesNames.VISUAL_RESOURCES)?.isEnabled) {
     return EMPTY_TEXT_PLACEHOLDER;
   }
 
@@ -137,4 +138,5 @@ function ResourceGraph({
     </Panel>
   );
 }
+
 export default ResourceGraph;
diff --git a/src/shared/hooks/useGetHiddenNamespaces.ts b/src/shared/hooks/useGetHiddenNamespaces.ts
@@ -1,5 +1,5 @@
 import { useFeature } from 'hooks/useFeature';
-import { ConfigFeature } from 'state/types';
+import { ConfigFeature, configFeaturesNames } from 'state/types';
 import { useMemo } from 'react';
 
 interface HiddenNamespacesFeature extends ConfigFeature {
@@ -10,7 +10,7 @@ interface HiddenNamespacesFeature extends ConfigFeature {
 
 export const useGetHiddenNamespaces = (): string[] => {
   const hiddenNamespacesConfig = useFeature<HiddenNamespacesFeature>(
-    'HIDDEN_NAMESPACES',
+    configFeaturesNames.HIDDEN_NAMESPACES,
   );
 
   const hiddenNamespaces = useMemo(() => {
diff --git a/src/shared/hooks/useProtectedResources.js b/src/shared/hooks/useProtectedResources.js
diff --git a/src/shared/hooks/useSidecarInjection.js b/src/shared/hooks/useSidecarInjection.js
diff --git a/src/state/navigation/allNodesSelector.ts b/src/state/navigation/allNodesSelector.ts
diff --git a/src/state/navigation/availableNodesSelector.ts b/src/state/navigation/availableNodesSelector.ts
diff --git a/src/state/navigation/extensionsAtom.ts b/src/state/navigation/extensionsAtom.ts
diff --git a/src/state/navigation/sidebarNavigationNodesSelector.ts b/src/state/navigation/sidebarNavigationNodesSelector.ts
diff --git a/src/state/types.ts b/src/state/types.ts
diff --git a/src/state/validationEnabledSchemasAtom.ts b/src/state/validationEnabledSchemasAtom.ts
