import React , { FC } from 'react' ; import { EuiForm } from '@elastic/eui' ; import { CreateAnalyticsStepProps } from '../../../analytics_management/hooks/use_create_analytics_form' ; import { ConfigurationStepDetails } from './configuration_step_details' ; import { ConfigurationStepForm } from './configuration_step_form' ; import { ANALYTICS_STEPS } from '../../page' ; export interface ConfigurationStepProps extends CreateAnalyticsStepProps { isClone : boolean ; } export const ConfigurationStep = ( { actions , state , setCurrentStep , step , stepActivated , isClone , } ) => { const showForm = step === ANALYTICS_STEPS . CONFIGURATION ; const showDetails = step !== ANALYTICS_STEPS . CONFIGURATION && stepActivated === true ; const dataTestSubj = `mlAnalyticsCreateJobWizardConfigurationStep${ showForm ? ' active' : '' }${ showDetails ? ' summary' : '' }` ; return ( < EuiForm className = "mlDataFrameAnalyticsCreateForm" data - test - subj = { dataTestSubj } > { showForm && ( < ConfigurationStepForm actions = { actions } isClone = { isClone } state = { state } setCurrentStep = { setCurrentStep } / > ) } { showDetails && < ConfigurationStepDetails setCurrentStep = { setCurrentStep } state = { state } / > } < /EuiForm>); } ;