import React from 'react' ; import { EuiCallOut } from '@elastic/eui' ; import { EuiButtonTo } from '../../react_router_helpers' ; import { SCHEMA_ERRORS_TITLE , SCHEMA_ERRORS_DESCRIPTION , SCHEMA_ERRORS_BUTTON } from './constants' ; interface Props { viewErrorsPath : string ; } export const SchemaErrorsCallout = ( { viewErrorsPath } ) => ( < EuiCallOut color = "danger" iconType = "alert" title = { SCHEMA_ERRORS_TITLE } data - test - subj = "schemaErrorsCallout" > < p > { SCHEMA_ERRORS_DESCRIPTION } < /p> < EuiButtonTo to = { viewErrorsPath } color = "danger" fill size = "s" data - test - subj = "viewErrorsButton" > { SCHEMA_ERRORS_BUTTON } < /EuiButtonTo> < /EuiCallOut>);