import React from 'react' ; import { ServiceNameFilter } from '../url_filter/service_name_filter' ; import { useFetcher } from '../../../../hooks/use_fetcher' ; import { RUM_AGENT_NAMES } from '../../../../../common/agent_name' ; import { useLegacyUrlParams } from '../../../../context/url_params_context/use_url_params' ; export function WebApplicationSelect ( ) { const { urlParams : { start , end } , } = useLegacyUrlParams ( ) ; const { data , status } = useFetcher ( ( callApmApi ) => { if ( start && end ) { return callApmApi ( { endpoint : 'GET /internal/apm/ux/services' , params : { query : { start , end , uiFilters : JSON . stringify ( { agentName : RUM_AGENT_NAMES } ) , } , } , } ) ; } } , [ start , end ] ) ; const rumServiceNames = data ?. rumServices ?? [ ] ; return ( < ServiceNameFilter loading = { status !== 'success' } serviceNames = { rumServiceNames } / > ) ; }