github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-06-28 11:05:39 -04:00
Code Issues Projects Releases Packages Wiki Activity

[Snapshot Restore] Disable steps when form is invalid (#76540)

Browse source
This commit is contained in:
Alison Goryachev 2020-09-14 08:51:16 -04:00 • committed by GitHub
parent fde34b129a
commit ebf877b91f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 7 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

9
x-pack/plugins/snapshot_restore/public/application/components/policy_form/navigation.tsx
View file

@ -11,12 +11,14 @@ interface Props {
currentStep: number; currentStep: number;
maxCompletedStep: number; maxCompletedStep: number;
updateCurrentStep: (step: number) => void; updateCurrentStep: (step: number) => void;
isFormValid: boolean;
} }
export const PolicyNavigation: React.FunctionComponent<Props> = ({ export const PolicyNavigation: React.FunctionComponent<Props> = ({
currentStep, currentStep,
maxCompletedStep, maxCompletedStep,
updateCurrentStep, updateCurrentStep,
isFormValid,
}) => { }) => {
const { i18n } = useServices(); const { i18n } = useServices();
@ -27,6 +29,7 @@ export const PolicyNavigation: React.FunctionComponent<Props> = ({
}), }),
isComplete: maxCompletedStep >= 1, isComplete: maxCompletedStep >= 1,
isSelected: currentStep === 1, isSelected: currentStep === 1,
disabled: !isFormValid && currentStep !== 1,
onClick: () => updateCurrentStep(1), onClick: () => updateCurrentStep(1),
}, },
{ {
@ -35,7 +38,7 @@ export const PolicyNavigation: React.FunctionComponent<Props> = ({
}), }),
isComplete: maxCompletedStep >= 2, isComplete: maxCompletedStep >= 2,
isSelected: currentStep === 2, isSelected: currentStep === 2,
disabled: maxCompletedStep < 1, disabled: maxCompletedStep < 1 || (!isFormValid && currentStep !== 2),
onClick: () => updateCurrentStep(2), onClick: () => updateCurrentStep(2),
}, },
{ {
@ -44,7 +47,7 @@ export const PolicyNavigation: React.FunctionComponent<Props> = ({
}), }),
isComplete: maxCompletedStep >= 3, isComplete: maxCompletedStep >= 3,
isSelected: currentStep === 3, isSelected: currentStep === 3,
disabled: maxCompletedStep < 2, disabled: maxCompletedStep < 2 || (!isFormValid && currentStep !== 3),
onClick: () => updateCurrentStep(3), onClick: () => updateCurrentStep(3),
}, },
{ {
@ -53,7 +56,7 @@ export const PolicyNavigation: React.FunctionComponent<Props> = ({
}), }),
isComplete: maxCompletedStep >= 3, isComplete: maxCompletedStep >= 3,
isSelected: currentStep === 4, isSelected: currentStep === 4,
disabled: maxCompletedStep < 3, disabled: maxCompletedStep < 3 || (!isFormValid && currentStep !== 4),
onClick: () => updateCurrentStep(4), onClick: () => updateCurrentStep(4),
}, },
]; ];

1
x-pack/plugins/snapshot_restore/public/application/components/policy_form/policy_form.tsx
View file

@ -130,6 +130,7 @@ export const PolicyForm: React.FunctionComponent<Props> = ({
currentStep={currentStep} currentStep={currentStep}
maxCompletedStep={maxCompletedStep} maxCompletedStep={maxCompletedStep}
updateCurrentStep={updateCurrentStep} updateCurrentStep={updateCurrentStep}
isFormValid={validation.isValid}
/> />
<EuiSpacer size="l" /> <EuiSpacer size="l" />
<EuiForm> <EuiForm>