[APM] closes #34781 by rendering a different set of service navigation tabs when a rum agent is detected (#35124) (#35378)

This commit is contained in:
Oliver Gupte 2019-04-19 15:53:04 -07:00 committed by GitHub
parent 3536e17b6b
commit 8db119d292
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 39 additions and 37 deletions

View file

@ -17,50 +17,48 @@ interface TabsProps {
transactionTypes: string[];
urlParams: IUrlParams;
location: Location;
isRumAgent?: boolean;
}
export class ServiceDetailTabs extends React.Component<TabsProps> {
public render() {
const { transactionTypes, urlParams, location } = this.props;
const { transactionTypes, urlParams, location, isRumAgent } = this.props;
const { serviceName } = urlParams;
const headTransactionType = transactionTypes[0];
const tabs = [
{
name: i18n.translate('xpack.apm.serviceDetails.transactionsTabLabel', {
defaultMessage: 'Transactions'
}),
path: headTransactionType
? `/${serviceName}/transactions/${headTransactionType}`
: `/${serviceName}/transactions`,
routePath: `/${serviceName}/transactions/:transactionType?`,
render: () => (
<TransactionOverview
urlParams={urlParams}
serviceTransactionTypes={transactionTypes}
/>
)
},
{
name: i18n.translate('xpack.apm.serviceDetails.errorsTabLabel', {
defaultMessage: 'Errors'
}),
path: `/${serviceName}/errors`,
render: () => {
return (
<ErrorGroupOverview urlParams={urlParams} location={location} />
);
}
},
{
name: i18n.translate('xpack.apm.serviceDetails.metricsTabLabel', {
defaultMessage: 'Metrics'
}),
path: `/${serviceName}/metrics`,
render: () => (
<ServiceMetrics urlParams={urlParams} location={location} />
)
const transactionsTab = {
name: i18n.translate('xpack.apm.serviceDetails.transactionsTabLabel', {
defaultMessage: 'Transactions'
}),
path: headTransactionType
? `/${serviceName}/transactions/${headTransactionType}`
: `/${serviceName}/transactions`,
routePath: `/${serviceName}/transactions/:transactionType?`,
render: () => (
<TransactionOverview
urlParams={urlParams}
serviceTransactionTypes={transactionTypes}
/>
)
};
const errorsTab = {
name: i18n.translate('xpack.apm.serviceDetails.errorsTabLabel', {
defaultMessage: 'Errors'
}),
path: `/${serviceName}/errors`,
render: () => {
return <ErrorGroupOverview urlParams={urlParams} location={location} />;
}
];
};
const metricsTab = {
name: i18n.translate('xpack.apm.serviceDetails.metricsTabLabel', {
defaultMessage: 'Metrics'
}),
path: `/${serviceName}/metrics`,
render: () => <ServiceMetrics urlParams={urlParams} location={location} />
};
const tabs = isRumAgent
? [transactionsTab, errorsTab]
: [transactionsTab, errorsTab, metricsTab];
return <HistoryTabs tabs={tabs} />;
}

View file

@ -14,6 +14,7 @@ import { IUrlParams } from '../../../store/urlParams';
import { FilterBar } from '../../shared/FilterBar';
import { ServiceDetailTabs } from './ServiceDetailTabs';
import { ServiceIntegrations } from './ServiceIntegrations';
import { isRumAgentName } from '../../../../common/agent_name';
interface Props {
urlParams: IUrlParams;
@ -31,6 +32,8 @@ export function ServiceDetailsView({ urlParams, location }: Props) {
return null;
}
const isRumAgent = isRumAgentName(serviceDetailsData.agentName || '');
return (
<React.Fragment>
<EuiFlexGroup justifyContent="spaceBetween">
@ -55,6 +58,7 @@ export function ServiceDetailsView({ urlParams, location }: Props) {
location={location}
urlParams={urlParams}
transactionTypes={serviceDetailsData.types}
isRumAgent={isRumAgent}
/>
</React.Fragment>
);