import React from 'react' ; import { FormattedMessage } from '@osd/i18n/react' ; import { EuiButton , EuiTextAlign } from '@elastic/eui' ; import { SearchResponse } from 'elasticsearch' ; import { getOverlays } from '../../services' ; import { toMountPoint } from '../../../../opensearch_dashboards_react/public' ; import { ShardFailureModal } from './shard_failure_modal' ; import { ShardFailureRequest } from './shard_failure_types' ; export interface ShardFailureOpenModalButtonProps { request : ShardFailureRequest ; response : SearchResponse < any > ; title : string ; } export default function ShardFailureOpenModalButton ( { request , response , title , } ) { function onClick ( ) { const modal = getOverlays ( ) . openModal ( toMountPoint ( < ShardFailureModal request = { request } response = { response } title = { title } onClose = { ( ) => modal . close ( ) } />), { className : 'shardFailureModal' , } ) ; } return ( < EuiTextAlign textAlign = "right" > < EuiButton color = "warning" size = "s" onClick = { onClick } data - test - subj = "openShardFailureModalBtn" > < FormattedMessage id = "data.search.searchSource.fetch.shardsFailedModal.showDetails" defaultMessage = "Show details" description = "Open the modal to show details" / > < /EuiButton> < /EuiTextAlign>); }