import React , { Fragment } from 'react' ; import { FormattedMessage } from '@kbn/i18n-react' ; import { EuiDescriptionList , EuiSpacer , EuiTitle } from '@elastic/eui' ; import { ReadonlyRepository } from '../../../../../../../common/types' ; interface Props { repository : ReadonlyRepository ; } export const ReadonlyDetails = ( { repository } ) => { const { settings : { url } , } = repository ; const listItems = [ { title : ( < FormattedMessage id = "xpack.snapshotRestore.repositoryDetails.typeReadonly.urlLabel" defaultMessage = "URL" / > ) , description : url , } , ] ; return ( < Fragment > < EuiTitle size = "s" > < h3 > < FormattedMessage id = "xpack.snapshotRestore.repositoryDetails.settingsTitle" defaultMessage = "Settings" / > < /h3> < /EuiTitle> < EuiSpacer size = "s" / > < EuiDescriptionList textStyle = "reverse" listItems = { listItems } / > < /Fragment>); } ;