import React from 'react' ; import classNames from 'classnames' ; import { Result } from '../../../../types' ; import { SUBTITLE_LABEL } from './constants' ; interface SubtitleFieldProps { result : Result ; subtitleField : string | null ; subtitleFieldHover : boolean ; } export const SubtitleField = ( { result , subtitleField , subtitleFieldHover , } ) => ( < div data - test - subj = "SubtitleField" className = { classNames ( 'example-result-content__subtitle' , { 'example-result-field-hover' : subtitleFieldHover , } ) } > { subtitleField ? ( < div className = "eui-textTruncate" > { result [ subtitleField ] } < /div>) : (<span data-test-subj="DefaultSubtitleLabel" className="example-result-content-placeholder"> { SUBTITLE_LABEL } < / span > ) } < /div>);