import React from 'react' ; import { EuiFlexGroup , EuiFlexItem } from '@elastic/eui' ; import { TruncatedContent } from '../../../../shared/truncate' ; import { SourceIcon } from '../../../components/shared/source_icon' ; import { ContentSource } from '../../../types' ; const MAX_LENGTH = 28 ; interface SourceOptionItemProps { source : ContentSource ; } export const SourceOptionItem = ( { source } ) => ( < EuiFlexGroup gutterSize = "m" justifyContent = "flexStart" alignItems = "center" responsive = { false } > < EuiFlexItem grow = { false } > < SourceIcon { ... source } size = "s" / > < /EuiFlexItem> < EuiFlexItem grow = { false } > < TruncatedContent tooltipType = "title" content = { source . name } length = { MAX_LENGTH } / > < /EuiFlexItem> < /EuiFlexGroup>);