diff --git a/src/app.tsx b/src/app.tsx index f45babbf..12a1ef03 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -1,4 +1,4 @@ -import React, { useContext } from 'react'; +import React, { useContext, useEffect } from 'react'; import '@patternfly/react-core/dist/styles/base.css'; import { BrowserRouter as Router, useLocation } from 'react-router-dom'; import qs from 'query-string'; @@ -107,6 +107,12 @@ export const App = ({ config }: { config: Config }) => { const FeatureProvider = ({ children }) => { const location = useLocation(); const versionContext = useContext(VersionContext); + useEffect(() => { + if (!versionContext.versions) { + versionContext?.fetchVersions(); + } + }, [versionContext]); + const { appConfig } = useConfig(); let version = versionContext.versions?.mainVersion?.value; if (appConfig?.allowVersionOverride) { diff --git a/src/common/app_features.ts b/src/common/app_features.ts index b78451b3..4374edd6 100644 --- a/src/common/app_features.ts +++ b/src/common/app_features.ts @@ -8,7 +8,8 @@ export const APP_FEATURES = { engagementCardIcons: 'engagementCardIcons', dashboardDateSelector: 'dashboard-date-selector', engagementWriter: 'engagementWriter', - copyFrom: 'copyFrom' + copyFrom: 'copyFrom', + availabilityZone: 'availabilityZone', }; export type AppFeature = keyof typeof APP_FEATURES; diff --git a/src/common/human_readable_engagement_field.ts b/src/common/human_readable_engagement_field.ts index 22e93b72..c40c926d 100644 --- a/src/common/human_readable_engagement_field.ts +++ b/src/common/human_readable_engagement_field.ts @@ -13,6 +13,7 @@ export function getHumanReadableFieldName(field: string): string { location: `Location`, ocp_cloud_provider_name: 'Cloud Provider Name', ocp_cloud_provider_region: 'Cloud Provider Region', + ocp_cloud_provider_availability_zone: 'Cloud Provider Availability Zone', ocp_cluster_size: 'Cluster Size', ocp_persistent_storage_size: `Persistent Storage Size`, ocp_sub_domain: 'Subdomain', diff --git a/src/common/version_feature_factory.tsx b/src/common/version_feature_factory.tsx index 351fe590..108eb17c 100644 --- a/src/common/version_feature_factory.tsx +++ b/src/common/version_feature_factory.tsx @@ -5,7 +5,9 @@ export type FeatureVersionMap = { [key in AppFeature]?: string; }; -export const FEATURE_VERSION_MAP: FeatureVersionMap = {}; +export const FEATURE_VERSION_MAP: FeatureVersionMap = { + availabilityZone: 'v1.3.40', +}; const getSemverFromVersionString = (version: string = ''): string => { return semver.clean(version); diff --git a/src/components/engagement_data_cards/hosting_environment_card/availability_zone_tooltip.tsx b/src/components/engagement_data_cards/hosting_environment_card/availability_zone_tooltip.tsx new file mode 100644 index 00000000..c0e4e067 --- /dev/null +++ b/src/components/engagement_data_cards/hosting_environment_card/availability_zone_tooltip.tsx @@ -0,0 +1,44 @@ +import React from 'react'; +import { InfoCircleIcon } from '@patternfly/react-icons'; +import { Tooltip, TooltipPosition } from '@patternfly/react-core'; +import { EngagementFormConfig } from '../../../schemas/engagement_config'; +import { useEngagement } from '../../../context/engagement_context/engagement_hook'; + +export function AvailabilityZoneTooltip() { + const { engagementFormConfig } = useEngagement(); + + function createTooltipText(engagementFormConfig: EngagementFormConfig) { + let text = [
]; + (engagementFormConfig?.cloud_options?.availability_zones?.options ?? []).map( + (option: any, index: number) => { + return text.push(