diff --git a/public/resources/en/dashboard.json b/public/resources/en/dashboard.json index 9c5bf4eb49..c4c8af36dc 100644 --- a/public/resources/en/dashboard.json +++ b/public/resources/en/dashboard.json @@ -9,8 +9,9 @@ "enabledFeatures": "Enabled features", "experimental": "Experimental", "preview": "Preview", - "infoEnabledFeatures": "Something about what enabled features are.", - "infoDisabledFeatures": "Something about what disabled features are.", + "supported": "Supported", + "infoEnabledFeatures": "Shows enabled preview and experimental features.", + "infoDisabledFeatures": "Shows all disabled features.", "disabledFeatures": "Disabled features", "adminUiVersion": "<0 className=\"pf-u-mr-md\">Admin UI version{{version}}", "providerInfo": "Provider info", diff --git a/src/dashboard/Dashboard.tsx b/src/dashboard/Dashboard.tsx index 3e205a4f58..5d14426899 100644 --- a/src/dashboard/Dashboard.tsx +++ b/src/dashboard/Dashboard.tsx @@ -1,7 +1,7 @@ import { useMemo } from "react"; import { useHistory } from "react-router-dom"; import { Trans, useTranslation } from "react-i18next"; -import { xor } from "lodash-es"; +import { union, filter } from "lodash-es"; import { Brand, Card, @@ -73,18 +73,17 @@ const Dashboard = () => { const history = useHistory(); const localeSort = useLocaleSort(); - const enabledFeatures = useMemo( - () => - localeSort( - xor( - serverInfo.profileInfo?.disabledFeatures, - serverInfo.profileInfo?.experimentalFeatures, - serverInfo.profileInfo?.previewFeatures - ), - (item) => item - ), - [serverInfo.profileInfo] - ); + const isDeprecatedFeature = (feature: string) => + disabledFeatures.includes(feature); + + const isExperimentalFeature = (feature: string) => + serverInfo.profileInfo?.experimentalFeatures?.includes(feature); + + const isPreviewFeature = (feature: string) => + serverInfo.profileInfo?.previewFeatures?.includes(feature); + + const isSupportedFeature = (feature: string) => + !isExperimentalFeature(feature) && !isPreviewFeature(feature); const disabledFeatures = useMemo( () => @@ -95,11 +94,22 @@ const Dashboard = () => { [serverInfo.profileInfo] ); - const isExperimentalFeature = (feature: string) => - serverInfo.profileInfo?.experimentalFeatures?.includes(feature); - - const isPreviewFeature = (feature: string) => - serverInfo.profileInfo?.previewFeatures?.includes(feature); + const enabledFeatures = useMemo( + () => + localeSort( + filter( + union( + serverInfo.profileInfo?.experimentalFeatures, + serverInfo.profileInfo?.previewFeatures + ), + (feature) => { + return !isDeprecatedFeature(feature); + } + ), + (item) => item + ), + [serverInfo.profileInfo] + ); if (Object.keys(serverInfo).length === 0) { return ; @@ -186,7 +196,7 @@ const Dashboard = () => { {enabledFeatures.map((feature) => ( - + {feature}{" "} {isExperimentalFeature(feature) ? (