import { EuiLink } from '@elastic/eui' ; import React from 'react' ; import { useAgentDetails } from './use_agent_details' ; import { PLUGIN_ID } from '../../../fleet/common' ; import { pagePathGetters } from '../../../fleet/public' ; import { useKibana } from '../common/lib/kibana' ; interface AgentIdToNameProps { agentId : string ; } const AgentIdToNameComponent = ( { agentId } ) => { const getUrlForApp = useKibana ( ) . services . application . getUrlForApp ; const { data } = useAgentDetails ( { agentId , skip : ! agentId } ) ; return ( < EuiLink className = "eui-textTruncate" href = { getUrlForApp ( PLUGIN_ID , { path : pagePathGetters . agent_details ( { agentId } ) [ 1 ] , } ) } target = "_blank" > { data ?. local_metadata . host . name ?? agentId } < /EuiLink>); } ; export const AgentIdToName = React . memo ( AgentIdToNameComponent ) ;