import React , { FC } from 'react' ; import { EuiLoadingSpinner , EuiSpacer } from '@elastic/eui' ; import { CalloutMessage } from '../../../../../../../common/constants/validation' ; import { Callout } from '../../../../../components/callout' ; import { ANALYTICS_STEPS } from '../../page' ; import { ContinueButton } from '../continue_button' ; interface Props { setCurrentStep : React . Dispatch < React . SetStateAction < ANALYTICS_STEPS > > ; checksInProgress : boolean ; validationMessages : CalloutMessage [ ] ; } export const ValidationStep = ( { checksInProgress , validationMessages , setCurrentStep , } ) => { const callouts = validationMessages . map ( ( m , i ) => < Callout key = { `${ m . id }_${ i }` } { ... m } />); return ( < > { checksInProgress && < EuiLoadingSpinner size = "xl" / > } { ! checksInProgress && ( < > { callouts } < EuiSpacer / > < ContinueButton isDisabled = { false } onClick = { ( ) => { setCurrentStep ( ANALYTICS_STEPS . CREATE ) ; } } /> < />)} < />); } ;