diff --git a/frontend/packages/kubevirt-plugin/src/components/create-vm-wizard/create-vm-wizard-footer.scss b/frontend/packages/kubevirt-plugin/src/components/create-vm-wizard/create-vm-wizard-footer.scss index ffcc6ddfc02..277da489734 100644 --- a/frontend/packages/kubevirt-plugin/src/components/create-vm-wizard/create-vm-wizard-footer.scss +++ b/frontend/packages/kubevirt-plugin/src/components/create-vm-wizard/create-vm-wizard-footer.scss @@ -1,5 +1,4 @@ .kubevirt-create-vm-modal__footer-error { width: 100%; margin-bottom: 1em; - align-items: center; } diff --git a/frontend/packages/kubevirt-plugin/src/components/create-vm-wizard/create-vm-wizard-footer.tsx b/frontend/packages/kubevirt-plugin/src/components/create-vm-wizard/create-vm-wizard-footer.tsx index f38711becba..9c8110012dd 100644 --- a/frontend/packages/kubevirt-plugin/src/components/create-vm-wizard/create-vm-wizard-footer.tsx +++ b/frontend/packages/kubevirt-plugin/src/components/create-vm-wizard/create-vm-wizard-footer.tsx @@ -12,9 +12,10 @@ import { import * as _ from 'lodash'; import { Prompt } from 'react-router'; import { useShowErrorToggler } from '../../hooks/use-show-error-toggler'; -import { getDialogUIError } from '../../utils/strings'; +import { getDialogUIError, getSimpleDialogUIError } from '../../utils/strings'; import { ALL_VM_WIZARD_TABS, VMWizardProps, VMWizardTab } from './types'; import { + getStepError, hasStepAllRequiredFilled, isStepLocked, isStepValid, @@ -54,6 +55,8 @@ const CreateVMWizardFooterComponent: React.FC isStepLocked(stepData, id)); const isValid = isStepValid(stepData, activeStepID); + const hasStepAllRequired = hasStepAllRequiredFilled(stepData, activeStepID); + const stepError = getStepError(stepData, activeStepID); checkValidity(isValid); const isFirstStep = activeStepID === VMWizardTab.VM_SETTINGS; @@ -79,11 +82,17 @@ const CreateVMWizardFooterComponent: React.FC {!isValid && showError && ( + > + {stepError} + )} {!isLastStep && (