import React from 'react' ; import { i18n } from '@kbn/i18n' ; import { EuiToolTip , EuiText } from '@elastic/eui' ; import { asDuration } from '../../../../common/utils/formatters' ; interface Props { count : number ; durationSum : number ; } function CompositeSpanDurationSummaryItem ( { count , durationSum } ) { const avgDuration = durationSum / count ; return ( < EuiToolTip content = { i18n . translate ( 'xpack.apm.compositeSpanDurationLabel' , { defaultMessage : 'Average duration' , } ) } > < EuiText > { i18n . translate ( 'xpack.apm.compositeSpanCallsLabel' , { defaultMessage : `, {count} calls, on avg. {duration}` , values : { count , duration : asDuration ( avgDuration ) , } , } ) } < /EuiText> < /EuiToolTip>); } export { CompositeSpanDurationSummaryItem } ;