import { EuiHeaderLink } from '@elastic/eui' ; import { i18n } from '@kbn/i18n' ; import React from 'react' ; import { useKibana } from '../../../../../../../src/plugins/kibana_react/public' ; import { enableInspectEsQueries , useInspectorContext , } from '../../../../../observability/public' ; import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_context' ; export function InspectorHeaderLink ( ) { const { inspector } = useApmPluginContext ( ) ; const { inspectorAdapters } = useInspectorContext ( ) ; const { services : { uiSettings } , } = useKibana ( ) ; const isInspectorEnabled = uiSettings ?. get < boolean > ( enableInspectEsQueries ) ; const inspect = ( ) => { inspector . open ( inspectorAdapters ) ; } ; if ( ! isInspectorEnabled ) { return null ; } return ( < EuiHeaderLink color = "primary" onClick = { inspect } > { i18n . translate ( 'xpack.apm.inspectButtonText' , { defaultMessage : 'Inspect' , } ) } < /EuiHeaderLink>); }