Skip to content

Commit b75af32

Browse files
openshift-merge-bot[bot]openshift-merge-bot[bot]
authored
Merge pull request #4060 from mayarub/89616-refactor-maya
CNV-89616: Refactor create vm wizard - Part 1: copy the existing folder
2 parents 9de4b40 + 36face7 commit b75af32

191 files changed

Lines changed: 9999 additions & 0 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎src/views/virtualmachines/creation-wizard-new/VMCreationWizard.tsx‎

Lines changed: 187 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,187 @@
1+
import React, { FC, useEffect, useRef } from 'react';
2+
3+
import {
4+
logVMCreationStarted,
5+
mapWizardStepToCreationMethodTelemetry,
6+
} from '@kubevirt-utils/extensions/telemetry/vm-creation';
7+
import { useIsAdmin } from '@kubevirt-utils/hooks/useIsAdmin';
8+
import { useKubevirtTranslation } from '@kubevirt-utils/hooks/useKubevirtTranslation';
9+
import { getValidNamespace } from '@kubevirt-utils/utils/utils';
10+
import useClusterParam from '@multicluster/hooks/useClusterParam';
11+
import { useActiveNamespace } from '@openshift-console/dynamic-plugin-sdk';
12+
import { Wizard, WizardHeader, WizardStep } from '@patternfly/react-core';
13+
import DefaultWizardFooter from '@virtualmachines/creation-wizard-new/components/DefaultWizardFooter';
14+
import useCloseWizard from '@virtualmachines/creation-wizard-new/hooks/useCloseWizard';
15+
import { useSyncDeploymentDetails } from '@virtualmachines/creation-wizard-new/hooks/useSyncDeploymentDetails';
16+
import useVMGenerationNavItem from '@virtualmachines/creation-wizard-new/hooks/useVMGenerationNavItem';
17+
import useWizardStepValidation from '@virtualmachines/creation-wizard-new/hooks/useWizardStepValidation';
18+
import useVMWizardStore from '@virtualmachines/creation-wizard-new/state/vm-wizard-store/useVMWizardStore';
19+
import CloneSourceStep from '@virtualmachines/creation-wizard-new/steps/CloneSourceStep/CloneSourceStep';
20+
import CustomizationStep from '@virtualmachines/creation-wizard-new/steps/CustomizationStep/CustomizationStep';
21+
import DeploymentDetailsStepFooter from '@virtualmachines/creation-wizard-new/steps/DeploymentDetailsStep/components/DeploymentDetailsStepFooter';
22+
import BootSourceStep from '@virtualmachines/creation-wizard-new/steps/InstanceTypesSteps/BootSourceStep/BootSourceStep';
23+
import ComputeResourcesStepFooter from '@virtualmachines/creation-wizard-new/steps/InstanceTypesSteps/ComputeResourcesStep/components/ComputeResourcesStepFooter';
24+
import ComputeResourcesStep from '@virtualmachines/creation-wizard-new/steps/InstanceTypesSteps/ComputeResourcesStep/ComputeResourcesStep';
25+
import GuestOSStep from '@virtualmachines/creation-wizard-new/steps/InstanceTypesSteps/GuestOSStep/GuestOSStep';
26+
import ReviewAndCreateStepFooter from '@virtualmachines/creation-wizard-new/steps/ReviewAndCreateStep/components/ReviewAndCreateStepFooter';
27+
import ReviewAndCreateStep from '@virtualmachines/creation-wizard-new/steps/ReviewAndCreateStep/ReviewAndCreateStep';
28+
import TemplateStepFooter from '@virtualmachines/creation-wizard-new/steps/TemplateStep/components/TemplateStepFooter';
29+
import TemplateStep from '@virtualmachines/creation-wizard-new/steps/TemplateStep/TemplateStep';
30+
import { VMWizardStep } from '@virtualmachines/creation-wizard-new/utils/constants';
31+
import {
32+
isCloneCreationMethod,
33+
isInstanceTypeCreationMethod,
34+
isTemplateCreationMethod,
35+
} from '@virtualmachines/creation-wizard-new/utils/utils';
36+
37+
import TemplatesDrawerWrapper from './components/TemplatesDrawerWrapper';
38+
import DeploymentDetailsStep from './steps/DeploymentDetailsStep/DeploymentDetailsStep';
39+
40+
import './Wizard.scss';
41+
42+
const VMCreationWizard: FC = () => {
43+
const { t } = useKubevirtTranslation();
44+
const {
45+
creationMethod,
46+
initializeVMCreationWizardValues,
47+
markStepVisited,
48+
resetWizardState,
49+
setTemplatesDrawerIsOpen,
50+
} = useVMWizardStore();
51+
const syncDeploymentDetails = useSyncDeploymentDetails();
52+
const { isNextDisabledForStep, isStepDisabled } = useWizardStepValidation();
53+
const { navItemWithVMGeneration } = useVMGenerationNavItem(creationMethod);
54+
const clusterParam = useClusterParam();
55+
const hasInitialized = useRef(false);
56+
const hasLoggedCreationStarted = useRef(false);
57+
const closeWizard = useCloseWizard();
58+
const isAdmin = useIsAdmin();
59+
const [activeNamespace] = useActiveNamespace();
60+
const namespace = getValidNamespace(activeNamespace);
61+
62+
useEffect(() => {
63+
if (!hasInitialized.current) {
64+
setTemplatesDrawerIsOpen(false);
65+
initializeVMCreationWizardValues({ cluster: clusterParam, isAdmin, namespace });
66+
hasInitialized.current = true;
67+
}
68+
69+
return () => resetWizardState();
70+
}, [
71+
clusterParam,
72+
isAdmin,
73+
namespace,
74+
resetWizardState,
75+
setTemplatesDrawerIsOpen,
76+
initializeVMCreationWizardValues,
77+
]);
78+
79+
const isInstanceTypeMethod = isInstanceTypeCreationMethod(creationMethod);
80+
const isCloneMethod = isCloneCreationMethod(creationMethod);
81+
const isTemplateMethod = isTemplateCreationMethod(creationMethod);
82+
83+
return (
84+
<TemplatesDrawerWrapper>
85+
<Wizard
86+
onStepChange={(_, currentStep, prevStep) => {
87+
syncDeploymentDetails(currentStep, prevStep);
88+
if (currentStep?.id !== VMWizardStep.TEMPLATE) setTemplatesDrawerIsOpen(false);
89+
if (currentStep?.id) markStepVisited(String(currentStep.id));
90+
91+
const creationMethodTelemetry = mapWizardStepToCreationMethodTelemetry(
92+
String(currentStep?.id),
93+
);
94+
if (!hasLoggedCreationStarted.current && creationMethodTelemetry) {
95+
hasLoggedCreationStarted.current = true;
96+
logVMCreationStarted(creationMethodTelemetry);
97+
}
98+
}}
99+
className="vm-creation-wizard"
100+
header={<WizardHeader isCloseHidden title={t('Create VirtualMachine')} />}
101+
onClose={closeWizard}
102+
title={t('Create VirtualMachine')}
103+
>
104+
<WizardStep
105+
footer={<DeploymentDetailsStepFooter />}
106+
id={VMWizardStep.DEPLOYMENT_DETAILS}
107+
name={t('Deployment details')}
108+
>
109+
<DeploymentDetailsStep />
110+
</WizardStep>
111+
<WizardStep
112+
footer={{
113+
isNextDisabled: isNextDisabledForStep(VMWizardStep.GUEST_OS),
114+
}}
115+
id={VMWizardStep.GUEST_OS}
116+
isDisabled={isStepDisabled(VMWizardStep.GUEST_OS)}
117+
isHidden={!isInstanceTypeMethod}
118+
name={t('Guest OS')}
119+
>
120+
<GuestOSStep />
121+
</WizardStep>
122+
<WizardStep
123+
footer={{
124+
isNextDisabled: isNextDisabledForStep(VMWizardStep.BOOT_SOURCE),
125+
}}
126+
id={VMWizardStep.BOOT_SOURCE}
127+
isDisabled={isStepDisabled(VMWizardStep.BOOT_SOURCE)}
128+
isHidden={!isInstanceTypeMethod}
129+
name={t('Boot source')}
130+
>
131+
<BootSourceStep />
132+
</WizardStep>
133+
<WizardStep
134+
footer={<ComputeResourcesStepFooter />}
135+
id={VMWizardStep.COMPUTE_RESOURCES}
136+
isDisabled={isStepDisabled(VMWizardStep.COMPUTE_RESOURCES)}
137+
isHidden={!isInstanceTypeMethod}
138+
name={t('Compute resources')}
139+
>
140+
<ComputeResourcesStep />
141+
</WizardStep>
142+
143+
<WizardStep
144+
footer={<TemplateStepFooter />}
145+
id={VMWizardStep.TEMPLATE}
146+
isDisabled={isStepDisabled(VMWizardStep.TEMPLATE)}
147+
isHidden={!isTemplateMethod}
148+
name={t('Template')}
149+
>
150+
<TemplateStep />
151+
</WizardStep>
152+
<WizardStep
153+
footer={<DefaultWizardFooter />}
154+
id={VMWizardStep.CUSTOMIZATION}
155+
isDisabled={isStepDisabled(VMWizardStep.CUSTOMIZATION)}
156+
isHidden={isCloneMethod}
157+
name={t('Customization')}
158+
navItem={navItemWithVMGeneration}
159+
>
160+
<CustomizationStep />
161+
</WizardStep>
162+
<WizardStep
163+
footer={{
164+
isNextDisabled: isNextDisabledForStep(VMWizardStep.CLONE),
165+
}}
166+
id={VMWizardStep.CLONE}
167+
isDisabled={isStepDisabled(VMWizardStep.CLONE)}
168+
isHidden={!isCloneMethod}
169+
name={t('Source')}
170+
>
171+
<CloneSourceStep />
172+
</WizardStep>
173+
<WizardStep
174+
footer={<ReviewAndCreateStepFooter />}
175+
id={VMWizardStep.REVIEW_AND_CREATE}
176+
isDisabled={isStepDisabled(VMWizardStep.REVIEW_AND_CREATE)}
177+
name={t('Review and create')}
178+
navItem={navItemWithVMGeneration}
179+
>
180+
<ReviewAndCreateStep />
181+
</WizardStep>
182+
</Wizard>
183+
</TemplatesDrawerWrapper>
184+
);
185+
};
186+
187+
export default VMCreationWizard;

‎src/views/virtualmachines/creation-wizard-new/Wizard.scss‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
.vm-wizard-body {
2+
display: flex;
3+
flex-direction: column;
4+
min-height: 0;
5+
6+
.co-m-page__body {
7+
height: 100%;
8+
}
9+
}
10+
11+
.vm-wizard-footer {
12+
padding: var(--pf-t--global--spacer--lg);
13+
border-top: var(--pf-t--global--border--width--regular) solid
14+
var(--pf-t--global--border--color--default);
15+
position: sticky;
16+
bottom: 0;
17+
width: 100%;
18+
background: var(--pf-v6-c-page__main-section--BackgroundColor);
19+
z-index: 1000;
20+
}
21+
22+
.vm-creation-wizard {
23+
.pf-v6-c-wizard__footer .pf-v6-c-action-list {
24+
justify-content: flex-start;
25+
}
26+
}
27+
28+
.wizard-header {
29+
.pf-l-split {
30+
justify-content: space-between;
31+
}
32+
}

0 commit comments

Comments
 (0)