Skip to content

Commit 2f60d2a

Browse files
ammont82ammont82
authored
MGMT-16967: Modify tooltip text for CNV and MCE to inform user that can also select LVMS (#2503)
* Modify tooltip text for CNV and MCE to inform user that can also select LVMS * Creating functions to obtain texts for Lvms and Odf operators
1 parent ef74347 commit 2f60d2a

File tree

6 files changed

+95
-40
lines changed

6 files changed

+95
-40
lines changed

Diff for: ‎libs/ui-lib/lib/ocm/components/clusterConfiguration/operators/CnvCheckbox.tsx

+22-3
Original file line numberDiff line numberDiff line change
@@ -19,9 +19,11 @@ const CNV_FIELD_NAME = 'useContainerNativeVirtualization';
1919
const CnvLabel = ({
2020
clusterId,
2121
disabledReason,
22+
isVersionEqualsOrMajorThan4_15,
2223
}: {
2324
clusterId: ClusterOperatorProps['clusterId'];
2425
disabledReason?: string;
26+
isVersionEqualsOrMajorThan4_15: boolean;
2527
}) => {
2628
return (
2729
<>
@@ -31,7 +33,12 @@ const CnvLabel = ({
3133
<PopoverIcon
3234
component={'a'}
3335
headerContent="Additional requirements"
34-
bodyContent={<CnvHostRequirements clusterId={clusterId} />}
36+
bodyContent={
37+
<CnvHostRequirements
38+
clusterId={clusterId}
39+
isVersionEqualsOrMajorThan4_15={isVersionEqualsOrMajorThan4_15}
40+
/>
41+
}
3542
/>
3643
</>
3744
);
@@ -50,7 +57,13 @@ const CnvHelperText = () => {
5057
);
5158
};
5259

53-
const CnvCheckbox = ({ clusterId }: ClusterOperatorProps) => {
60+
const CnvCheckbox = ({
61+
clusterId,
62+
isVersionEqualsOrMajorThan4_15,
63+
}: {
64+
clusterId: ClusterOperatorProps['clusterId'];
65+
isVersionEqualsOrMajorThan4_15: boolean;
66+
}) => {
5467
const fieldId = getFieldId(CNV_FIELD_NAME, 'input');
5568

5669
const featureSupportLevel = useNewFeatureSupportLevel();
@@ -70,7 +83,13 @@ const CnvCheckbox = ({ clusterId }: ClusterOperatorProps) => {
7083
<FormGroup isInline fieldId={fieldId}>
7184
<OcmCheckboxField
7285
name={CNV_FIELD_NAME}
73-
label={<CnvLabel clusterId={clusterId} disabledReason={disabledReason} />}
86+
label={
87+
<CnvLabel
88+
clusterId={clusterId}
89+
disabledReason={disabledReason}
90+
isVersionEqualsOrMajorThan4_15={isVersionEqualsOrMajorThan4_15}
91+
/>
92+
}
7493
helperText={<CnvHelperText />}
7594
isDisabled={!!disabledReason}
7695
/>

Diff for: ‎libs/ui-lib/lib/ocm/components/clusterConfiguration/operators/CnvHostRequirements.tsx

+10-8
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,15 @@ import { useClusterPreflightRequirements } from '../../../hooks';
55
import { ErrorState, LoadingState, OPERATOR_NAME_CNV, RenderIf } from '../../../../common';
66
import { Cluster } from '@openshift-assisted/types/assisted-installer-service';
77
import { selectIsCurrentClusterSNO } from '../../../store/slices/current-cluster/selectors';
8+
import { getOdfLvmsText } from './utils';
89

9-
const CnvHostRequirements = ({ clusterId }: { clusterId: Cluster['id'] }) => {
10+
const CnvHostRequirements = ({
11+
clusterId,
12+
isVersionEqualsOrMajorThan4_15,
13+
}: {
14+
clusterId: Cluster['id'];
15+
isVersionEqualsOrMajorThan4_15: boolean;
16+
}) => {
1017
const { preflightRequirements, error, isLoading } = useClusterPreflightRequirements(clusterId);
1118
const isSingleNode = useSelector(selectIsCurrentClusterSNO);
1219

@@ -23,7 +30,7 @@ const CnvHostRequirements = ({ clusterId }: { clusterId: Cluster['id'] }) => {
2330

2431
const workerRequirements = cnvRequirements?.requirements?.worker?.quantitative;
2532
const masterRequirements = cnvRequirements?.requirements?.master?.quantitative;
26-
33+
const odfLvmsText = getOdfLvmsText(isSingleNode, isVersionEqualsOrMajorThan4_15);
2734
return (
2835
<>
2936
<List>
@@ -48,12 +55,7 @@ const CnvHostRequirements = ({ clusterId }: { clusterId: Cluster['id'] }) => {
4855
? ` and ${masterRequirements?.diskSizeGb} storage space`
4956
: ''}
5057
</ListItem>
51-
<RenderIf condition={!isSingleNode}>
52-
<ListItem>
53-
OpenShift Data Foundation (recommended for full functionality) or another persistent
54-
storage service
55-
</ListItem>
56-
</RenderIf>
58+
<ListItem>{odfLvmsText}</ListItem>
5759
</List>
5860
</>
5961
);

Diff for: ‎libs/ui-lib/lib/ocm/components/clusterConfiguration/operators/MceCheckbox.tsx

+40-20
Original file line numberDiff line numberDiff line change
@@ -4,27 +4,36 @@ import { ExternalLinkAltIcon } from '@patternfly/react-icons/dist/js/icons/exter
44
import { getFieldId, PopoverIcon, MCE_LINK } from '../../../../common';
55
import { OcmCheckboxField } from '../../ui/OcmFormFields';
66
import { useNewFeatureSupportLevel } from '../../../../common/components/newFeatureSupportLevels';
7+
import { useSelector } from 'react-redux';
8+
import { selectIsCurrentClusterSNO } from '../../../store/slices/current-cluster/selectors';
9+
import { getOdfLvmsText } from './utils';
710

811
const MCE_FIELD_NAME = 'useMultiClusterEngine';
912

10-
const MceLabel = ({ disabledReason }: { disabledReason?: string }) => (
11-
<>
12-
<Tooltip hidden={!disabledReason} content={disabledReason}>
13-
<span>Install multicluster engine </span>
14-
</Tooltip>
15-
<PopoverIcon
16-
id={MCE_FIELD_NAME}
17-
component={'a'}
18-
headerContent="Additional requirements"
19-
bodyContent={
20-
<>
21-
OpenShift Data Foundation (recommended for creating additional on-premise clusters) or
22-
another persistent storage service
23-
</>
24-
}
25-
/>
26-
</>
27-
);
13+
const MceLabel = ({
14+
disabledReason,
15+
isVersionEqualsOrMajorThan4_15,
16+
isSNO,
17+
}: {
18+
disabledReason?: string;
19+
isVersionEqualsOrMajorThan4_15: boolean;
20+
isSNO: boolean;
21+
}) => {
22+
const odfLvmsText = getOdfLvmsText(isSNO, isVersionEqualsOrMajorThan4_15);
23+
return (
24+
<>
25+
<Tooltip hidden={!disabledReason} content={disabledReason}>
26+
<span>Install multicluster engine </span>
27+
</Tooltip>
28+
<PopoverIcon
29+
id={MCE_FIELD_NAME}
30+
component={'a'}
31+
headerContent="Additional requirements"
32+
bodyContent={<>{odfLvmsText}</>}
33+
/>
34+
</>
35+
);
36+
};
2837

2938
const MceHelperText = () => {
3039
return (
@@ -39,15 +48,26 @@ const MceHelperText = () => {
3948
);
4049
};
4150

42-
const MceCheckbox = () => {
51+
const MceCheckbox = ({
52+
isVersionEqualsOrMajorThan4_15,
53+
}: {
54+
isVersionEqualsOrMajorThan4_15: boolean;
55+
}) => {
56+
const isSNO = useSelector(selectIsCurrentClusterSNO);
4357
const featureSupportLevelContext = useNewFeatureSupportLevel();
4458
const fieldId = getFieldId(MCE_FIELD_NAME, 'input');
4559
const disabledReason = featureSupportLevelContext.getFeatureDisabledReason('MCE');
4660
return (
4761
<FormGroup isInline fieldId={fieldId}>
4862
<OcmCheckboxField
4963
name={MCE_FIELD_NAME}
50-
label={<MceLabel disabledReason={disabledReason} />}
64+
label={
65+
<MceLabel
66+
disabledReason={disabledReason}
67+
isVersionEqualsOrMajorThan4_15={isVersionEqualsOrMajorThan4_15}
68+
isSNO={isSNO}
69+
/>
70+
}
5171
isDisabled={!!disabledReason}
5272
helperText={<MceHelperText />}
5373
/>

Diff for: ‎libs/ui-lib/lib/ocm/components/clusterConfiguration/operators/OdfCheckbox.tsx

+9-7
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { useState } from 'react';
2-
import { FormGroup, Tooltip } from '@patternfly/react-core';
2+
import { FormGroup, HelperText, HelperTextItem, Tooltip } from '@patternfly/react-core';
33
import { ExternalLinkAltIcon } from '@patternfly/react-icons/dist/js/icons/external-link-alt-icon';
44
import {
55
getFieldId,
@@ -34,12 +34,14 @@ const OdfLabel = ({ disabledReason }: { disabledReason?: string }) => (
3434

3535
const OdfHelperText = () => {
3636
return (
37-
<>
38-
Persistent software-defined storage for hybrid applications.{' '}
39-
<a href={ODF_LINK} target="_blank" rel="noopener noreferrer">
40-
{'Learn more'} <ExternalLinkAltIcon />
41-
</a>
42-
</>
37+
<HelperText>
38+
<HelperTextItem variant="indeterminate">
39+
Persistent software-defined storage for hybrid applications.{' '}
40+
<a href={ODF_LINK} target="_blank" rel="noopener noreferrer">
41+
{'Learn more'} <ExternalLinkAltIcon />
42+
</a>
43+
</HelperTextItem>
44+
</HelperText>
4345
);
4446
};
4547

Diff for: ‎libs/ui-lib/lib/ocm/components/clusterConfiguration/operators/utils.tsx

+12
Original file line numberDiff line numberDiff line change
@@ -24,3 +24,15 @@ export const getActualLVMOperatorName = ({
2424

2525
return operator;
2626
};
27+
28+
export const getOdfLvmsText = (isSingleNode: boolean, OPCVersionGreaterThan4_15: boolean) => {
29+
if (OPCVersionGreaterThan4_15) {
30+
return 'OpenShift Data Foundation (recommended for creating additional on-premise clusters), Logical Volume Manager Storage or another persistent storage service';
31+
} else {
32+
if (isSingleNode) {
33+
return 'Logical Volume Manager Storage or another persistent storage service';
34+
} else {
35+
return 'OpenShift Data Foundation (recommended for creating additional on-premise clusters) or another persistent storage service';
36+
}
37+
}
38+
};

Diff for: ‎libs/ui-lib/lib/ocm/components/clusterWizard/OperatorsStep.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -21,10 +21,10 @@ export const OperatorsStep = (props: ClusterOperatorProps) => {
2121
<ClusterWizardStepHeader>Operators</ClusterWizardStepHeader>
2222
</StackItem>
2323
<StackItem>
24-
<CnvCheckbox {...props} />
24+
<CnvCheckbox {...props} isVersionEqualsOrMajorThan4_15={isVersionEqualsOrMajorThan4_15} />
2525
</StackItem>
2626
<StackItem>
27-
<MceCheckbox />
27+
<MceCheckbox isVersionEqualsOrMajorThan4_15={isVersionEqualsOrMajorThan4_15} />
2828
</StackItem>
2929
{isVersionEqualsOrMajorThan4_15 ? (
3030
<>

0 commit comments

Comments
 (0)