Skip to content

Commit b03c0d1

Browse files
avivturcursoragent
andauthored
Add Technology Preview labels for TP features in 2.12 (#2423)
Add TechPreviewLabel to HyperV and EC2 provider type options in the create provider form and provider list. Add TechPreviewLabel to AAP hook details and customization scripts section in plan details. Remove the label from OVA upload section which is no longer Tech Preview. Resolves: MTV-5531 Signed-off-by: Aviv Turgeman <aturgema@redhat.com> Co-authored-by: Cursor <cursoragent@cursor.com>
1 parent 873def8 commit b03c0d1

7 files changed

Lines changed: 63 additions & 34 deletions

File tree

src/plans/details/tabs/Automation/components/ScriptsSection/ScriptsSection.tsx

Lines changed: 18 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,14 @@ import { isPlanEditable } from 'src/plans/details/components/PlanStatus/utils/ut
44

55
import { DetailsItem } from '@components/DetailItems/DetailItem';
66
import SectionHeadingWithEdit from '@components/headers/SectionHeadingWithEdit';
7+
import TechPreviewLabel from '@components/PreviewLabels/TechPreviewLabel';
78
import type { IoK8sApiCoreV1ConfigMap, V1beta1Plan } from '@forklift-ui/types';
89
import {
910
getGroupVersionKindForModel,
1011
ResourceLink,
1112
useOverlay,
1213
} from '@openshift-console/dynamic-plugin-sdk';
13-
import { Content, DescriptionList, Flex } from '@patternfly/react-core';
14+
import { Content, DescriptionList, Flex, FlexItem } from '@patternfly/react-core';
1415
import { ConfigMapModel } from '@utils/constants';
1516
import { getNamespace } from '@utils/crds/common/selectors';
1617
import { isEmpty } from '@utils/helpers';
@@ -37,15 +38,22 @@ const ScriptsSection: FC<ScriptsSectionProps> = ({ configMap, plan, scripts }) =
3738

3839
return (
3940
<Flex direction={{ default: 'column' }}>
40-
<SectionHeadingWithEdit
41-
editable={planEditable}
42-
title={t('Customization scripts')}
43-
onClick={() => {
44-
launchOverlay(ScriptEdit, { configMap, plan, scripts });
45-
}}
46-
data-testid="scripts-section-edit-button"
47-
headingLevel="h3"
48-
/>
41+
<Flex alignItems={{ default: 'alignItemsCenter' }} spaceItems={{ default: 'spaceItemsSm' }}>
42+
<FlexItem>
43+
<SectionHeadingWithEdit
44+
editable={planEditable}
45+
title={t('Customization scripts')}
46+
onClick={() => {
47+
launchOverlay(ScriptEdit, { configMap, plan, scripts });
48+
}}
49+
data-testid="scripts-section-edit-button"
50+
headingLevel="h3"
51+
/>
52+
</FlexItem>
53+
<FlexItem>
54+
<TechPreviewLabel />
55+
</FlexItem>
56+
</Flex>
4957
{hasScripts && configMap ? (
5058
<>
5159
<DescriptionList>

src/plans/details/tabs/Hooks/components/HookSection/AapHookDetails.tsx

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
import type { FC } from 'react';
22

33
import { DetailsItem } from '@components/DetailItems/DetailItem';
4+
import TechPreviewLabel from '@components/PreviewLabels/TechPreviewLabel';
45
import type { V1beta1Hook, V1beta1HookSpecAap } from '@forklift-ui/types';
6+
import { Flex, FlexItem } from '@patternfly/react-core';
57
import { getAnnotation } from '@utils/crds/common/selectors';
68
import { useForkliftTranslation } from '@utils/i18n';
79
import { ANNOTATION_AAP_JOB_TEMPLATE_NAME } from '@utils/types/aap';
@@ -20,7 +22,17 @@ const AapHookDetails: FC<AapHookDetailsProps> = ({ aap, hook }) => {
2022
<DetailsItem
2123
testId="hook-type-detail-item"
2224
title={t('Hook type')}
23-
content={t('Ansible Automation Platform')}
25+
content={
26+
<Flex
27+
spaceItems={{ default: 'spaceItemsSm' }}
28+
alignItems={{ default: 'alignItemsCenter' }}
29+
>
30+
<FlexItem>{t('Ansible Automation Platform')}</FlexItem>
31+
<FlexItem>
32+
<TechPreviewLabel />
33+
</FlexItem>
34+
</Flex>
35+
}
2436
/>
2537
<DetailsItem
2638
testId="aap-job-template-id-detail-item"

src/providers/create/fields/ProviderTypeField.tsx

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@ import { useController } from 'react-hook-form';
33

44
import { FormGroupWithHelpText } from '@components/common/FormGroupWithHelpText/FormGroupWithHelpText';
55
import Select from '@components/common/Select';
6-
import { SelectList, SelectOption } from '@patternfly/react-core';
6+
import TechPreviewLabel from '@components/PreviewLabels/TechPreviewLabel';
7+
import { Flex, FlexItem, SelectList, SelectOption } from '@patternfly/react-core';
78
import { getInputValidated } from '@utils/form';
89
import { useClusterIsAwsPlatform } from '@utils/hooks/useClusterIsAwsPlatform';
910
import { useIsDarkTheme } from '@utils/hooks/useIsDarkTheme';
@@ -67,7 +68,19 @@ const ProviderTypeField: FC = () => {
6768
icon={option.icon}
6869
data-testid={`provider-type-option-${option.value}`}
6970
>
70-
{option.label}
71+
{option.techPreview ? (
72+
<Flex
73+
spaceItems={{ default: 'spaceItemsSm' }}
74+
alignItems={{ default: 'alignItemsCenter' }}
75+
>
76+
<FlexItem>{option.label}</FlexItem>
77+
<FlexItem>
78+
<TechPreviewLabel />
79+
</FlexItem>
80+
</Flex>
81+
) : (
82+
option.label
83+
)}
7184
</SelectOption>
7285
))}
7386
</SelectList>

src/providers/create/utils/getProviderTypeOptions.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ type ProviderTypeOption = {
1616
description: string;
1717
icon: ReactElement;
1818
label: string;
19+
techPreview?: boolean;
1920
value: string;
2021
};
2122

@@ -29,6 +30,7 @@ export const getProviderTypeOptions = (
2930
description: t('Migrate Amazon EC2 instances to OpenShift Virtualization'),
3031
icon: ec2Logo,
3132
label: t('Amazon EC2'),
33+
techPreview: true,
3234
value: PROVIDER_TYPES.ec2,
3335
},
3436
]
@@ -57,6 +59,7 @@ export const getProviderTypeOptions = (
5759
description: t('Microsoft Hyper-V virtualization platform. Supports migration via SMB share.'),
5860
icon: hypervLogo,
5961
label: t('Microsoft Hyper-V'),
62+
techPreview: true,
6063
value: PROVIDER_TYPES.hyperv,
6164
},
6265
{

src/providers/details/tabs/Details/components/DetailsSection/UploadFilesSection.tsx

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,7 @@ import { PROVIDER_TYPES } from 'src/providers/utils/constants';
33

44
import SectionHeading from '@components/headers/SectionHeading';
55
import OvaFileUploader from '@components/OvaFileUploader/OvaFileUploader';
6-
import TechPreviewLabel from '@components/PreviewLabels/TechPreviewLabel';
7-
import { Flex, PageSection } from '@patternfly/react-core';
6+
import { PageSection } from '@patternfly/react-core';
87
import { isEmpty } from '@utils/helpers';
98
import { useForkliftTranslation } from '@utils/i18n';
109

@@ -24,19 +23,7 @@ const UploadFilesSection: FC<DetailsSectionProps> = ({ data }) => {
2423

2524
return (
2625
<PageSection hasBodyWrapper={false} className="forklift-page-section--details">
27-
<SectionHeading
28-
text={
29-
<Flex
30-
alignItems={{ default: 'alignItemsCenter' }}
31-
direction={{ default: 'row' }}
32-
gap={{ default: 'gapSm' }}
33-
>
34-
{t('Upload local OVA file')}
35-
<TechPreviewLabel />
36-
</Flex>
37-
}
38-
testId="ova-upload-section-heading"
39-
/>
26+
<SectionHeading text={t('Upload local OVA file')} testId="ova-upload-section-heading" />
4027
<OvaFileUploader provider={provider} />
4128
</PageSection>
4229
);
Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,22 @@
11
import type { FC } from 'react';
22
import { getResourceFieldValue } from 'src/components/common/FilterGroup/matchers';
3+
import TechPreviewLabel from 'src/components/PreviewLabels/TechPreviewLabel';
34
import { TableLabelCell } from 'src/components/TableCell/TableLabelCell';
45
import type { CellProps } from 'src/providers/list/components/CellProps';
5-
import type { PROVIDER_TYPES } from 'src/providers/utils/constants';
6+
import { isTechPreviewProvider, type PROVIDER_TYPES } from 'src/providers/utils/constants';
67
import { getIsOnlySource } from 'src/providers/utils/helpers/getIsTarget';
78
import { PROVIDERS } from 'src/utils/enums';
89
import { useForkliftTranslation } from 'src/utils/i18n';
910

1011
import { SOURCE_LABEL_COLOR, SOURCE_LABEL_TEXT } from './utils/constants';
1112

12-
/**
13-
* TypeCell component, used for displaying the type of a resource.
14-
* @param {CellProps} props - The props for the component.
15-
* @returns {JSX.Element} - The rendered component.
16-
*/
1713
export const TypeCell: FC<CellProps> = ({ data, fields }) => {
1814
const { t } = useForkliftTranslation();
1915

2016
const { provider } = data;
2117
const type = getResourceFieldValue(data, 'type', fields);
2218
const isSource = getIsOnlySource(provider);
19+
const isTechPreview = isTechPreviewProvider(type as string);
2320

2421
return (
2522
<TableLabelCell
@@ -28,6 +25,7 @@ export const TypeCell: FC<CellProps> = ({ data, fields }) => {
2825
labelColor={SOURCE_LABEL_COLOR}
2926
>
3027
{PROVIDERS?.[type as keyof typeof PROVIDER_TYPES] ?? ''}
28+
{isTechPreview && <TechPreviewLabel />}
3129
</TableLabelCell>
3230
);
3331
};

src/providers/utils/constants.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,14 @@ export const PROVIDER_TYPES = {
3636

3737
export type ProviderTypes = (typeof PROVIDER_TYPES)[keyof typeof PROVIDER_TYPES];
3838

39+
const TECH_PREVIEW_PROVIDER_TYPES: readonly ProviderTypes[] = [
40+
PROVIDER_TYPES.ec2,
41+
PROVIDER_TYPES.hyperv,
42+
] as const;
43+
44+
export const isTechPreviewProvider = (type: string): boolean =>
45+
TECH_PREVIEW_PROVIDER_TYPES.includes(type as ProviderTypes);
46+
3947
export enum VSphereEndpointType {
4048
ESXi = 'esxi',
4149
vCenter = 'vcenter',

0 commit comments

Comments
 (0)