maxmustermann/kibana
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

[APM] Make environment & kuery required (#108338)

Browse source
This commit is contained in:
Dario Gieselaar 2021-08-13 15:50:14 +02:00 committed by GitHub
parent 3c75b1faf5
commit a474a63a7f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
207 changed files with 1176 additions and 533 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
packages/kbn-io-ts-utils/src/index.ts
View file

@ -13,3 +13,4 @@ export { isoToEpochRt } from './iso_to_epoch_rt';
export { toNumberRt } from './to_number_rt';
export { toBooleanRt } from './to_boolean_rt';
export { toJsonSchema } from './to_json_schema';
export { nonEmptyStringRt } from './non_empty_string_rt';

19
packages/kbn-io-ts-utils/src/non_empty_string_rt/index.test.ts Normal file
View file

@ -0,0 +1,19 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/
import { nonEmptyStringRt } from './';
import { isLeft, isRight } from 'fp-ts/lib/Either';
describe('nonEmptyStringRt', () => {
it('fails on empty strings', () => {
expect(isLeft(nonEmptyStringRt.decode(''))).toBe(true);
});
it('passes non-empty strings', () => {
expect(isRight(nonEmptyStringRt.decode('foo'))).toBe(true);
});
});

22
packages/kbn-io-ts-utils/src/non_empty_string_rt/index.ts Normal file
View file

@ -0,0 +1,22 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0 and the Server Side Public License, v 1; you may not use this file except
* in compliance with, at your election, the Elastic License 2.0 or the Server
* Side Public License, v 1.
*/
import * as t from 'io-ts';
// from https://github.com/gcanti/io-ts-types/blob/master/src/NonEmptyString.ts
export interface NonEmptyStringBrand {
readonly NonEmptyString: unique symbol;
}
export type NonEmptyString = t.Branded<string, NonEmptyStringBrand>;
export const nonEmptyStringRt = t.brand(
t.string,
(str): str is NonEmptyString => str.length > 0,
'NonEmptyString'
);

38
packages/kbn-typed-react-router-config/src/create_router.test.tsx
View file

@ -61,6 +61,7 @@ describe('createRouter', () => {
params: t.type({
query: t.type({
aggregationType: t.string,
kuery: t.string,
}),
}),
},
@ -112,7 +113,7 @@ describe('createRouter', () => {
},
});
history.push('/traces?rangeFrom=now-15m&rangeTo=now&aggregationType=avg');
history.push('/traces?rangeFrom=now-15m&rangeTo=now&aggregationType=avg&kuery=');
const topTracesParams = router.getParams('/traces', history.location);
@ -122,6 +123,7 @@ describe('createRouter', () => {
rangeFrom: 'now-15m',
rangeTo: 'now',
aggregationType: 'avg',
kuery: '',
},
});
@ -156,6 +158,22 @@ describe('createRouter', () => {
maxNumNodes: 3,
},
});
history.push(
'/traces?rangeFrom=now-15m&rangeTo=now&aggregationType=avg&kuery=service.name%3A%22metricbeat%22'
);
const topTracesParams = router.getParams('/traces', history.location);
expect(topTracesParams).toEqual({
path: {},
query: {
rangeFrom: 'now-15m',
rangeTo: 'now',
aggregationType: 'avg',
kuery: 'service.name:"metricbeat"',
},
});
});
it('throws an error if the given path does not match any routes', () => {
@ -280,10 +298,26 @@ describe('createRouter', () => {
query: {
rangeTo: 'now',
aggregationType: 'avg',
kuery: '',
},
});
expect(href).toEqual('/traces?aggregationType=avg&rangeFrom=now-30m&rangeTo=now');
expect(href).toEqual('/traces?aggregationType=avg&kuery=&rangeFrom=now-30m&rangeTo=now');
});
it('encodes query parameters', () => {
const href = router.link('/traces', {
// @ts-ignore
query: {
rangeTo: 'now',
aggregationType: 'avg',
kuery: 'service.name:"metricbeat"',
},
});
expect(href).toEqual(
'/traces?aggregationType=avg&kuery=service.name%3A%22metricbeat%22&rangeFrom=now-30m&rangeTo=now'
);
});
});
});

13
packages/kbn-typed-react-router-config/src/create_router.ts
View file

@ -79,7 +79,7 @@ export function createRouter<TRoutes extends Route[]>(routes: TRoutes): Router<T
const decoded = deepExactRt(route.params).decode(
merge({}, route.defaults ?? {}, {
path: matchedRoute.match.params,
query: qs.parse(location.search),
query: qs.parse(location.search, { decode: true }),
})
);
@ -151,10 +151,13 @@ export function createRouter<TRoutes extends Route[]>(routes: TRoutes): Router<T
throw new Error(PathReporter.report(validation).join('\n'));
}
return qs.stringifyUrl({
url: path,
query: paramsWithRouteDefaults.query,
});
return qs.stringifyUrl(
{
url: path,
query: paramsWithRouteDefaults.query,
},
{ encode: true }
);
};
return {

16
packages/kbn-typed-react-router-config/src/types/index.ts
View file

@ -24,7 +24,7 @@ export interface RouteMatch<TRoute extends Route = Route> {
params: TRoute extends {
params: t.Type<any>;
}
? t.OutputOf<TRoute['params']>
? t.TypeOf<TRoute['params']>
: {};
};
}
@ -107,9 +107,11 @@ type TypeOfMatches<TRouteMatches extends RouteMatch[]> = TRouteMatches extends [
(TNextRouteMatches extends RouteMatch[] ? TypeOfMatches<TNextRouteMatches> : {})
: {};
export type TypeOf<TRoutes extends Route[], TPath extends PathsOf<TRoutes>> = TypeOfMatches<
Match<TRoutes, TPath>
>;
export type TypeOf<
TRoutes extends Route[],
TPath extends PathsOf<TRoutes>,
TWithDefaultOutput extends boolean = true
> = TypeOfMatches<Match<TRoutes, TPath>> & (TWithDefaultOutput extends true ? DefaultOutput : {});
export type TypeAsArgs<TObject> = keyof TObject extends never
? []
@ -126,15 +128,15 @@ export interface Router<TRoutes extends Route[]> {
getParams<TPath extends PathsOf<TRoutes>>(
path: TPath,
location: Location
): OutputOf<TRoutes, TPath>;
): TypeOf<TRoutes, TPath>;
getParams<TPath extends PathsOf<TRoutes>, TOptional extends boolean>(
path: TPath,
location: Location,
optional: TOptional
): TOptional extends true ? OutputOf<TRoutes, TPath> | undefined : OutputOf<TRoutes, TPath>;
): TOptional extends true ? TypeOf<TRoutes, TPath> | undefined : TypeOf<TRoutes, TPath>;
link<TPath extends PathsOf<TRoutes>>(
path: TPath,
...args: TypeAsArgs<TypeOf<TRoutes, TPath>>
...args: TypeAsArgs<TypeOf<TRoutes, TPath, false>>
): string;
getRoutePath(route: Route): string;
}

9
x-pack/plugins/apm/common/environment_filter_values.ts
View file

@ -7,9 +7,10 @@
import { i18n } from '@kbn/i18n';
import { SERVICE_ENVIRONMENT } from './elasticsearch_fieldnames';
import { Environment } from './environment_rt';
const ENVIRONMENT_ALL_VALUE = 'ENVIRONMENT_ALL';
const ENVIRONMENT_NOT_DEFINED_VALUE = 'ENVIRONMENT_NOT_DEFINED';
const ENVIRONMENT_ALL_VALUE = 'ENVIRONMENT_ALL' as const;
const ENVIRONMENT_NOT_DEFINED_VALUE = 'ENVIRONMENT_NOT_DEFINED' as const;
export function getEnvironmentLabel(environment: string) {
if (!environment || environment === ENVIRONMENT_NOT_DEFINED_VALUE) {
@ -59,7 +60,7 @@ export function getNextEnvironmentUrlParam({
currentEnvironmentUrlParam,
}: {
requestedEnvironment?: string;
currentEnvironmentUrlParam?: string;
currentEnvironmentUrlParam: Environment;
}) {
const normalizedRequestedEnvironment =
requestedEnvironment || ENVIRONMENT_NOT_DEFINED.value;
@ -67,7 +68,7 @@ export function getNextEnvironmentUrlParam({
currentEnvironmentUrlParam || ENVIRONMENT_ALL.value;
if (normalizedRequestedEnvironment === normalizedQueryEnvironment) {
return currentEnvironmentUrlParam;
return currentEnvironmentUrlParam || ENVIRONMENT_ALL.value;
}
return ENVIRONMENT_ALL.value;

22
x-pack/plugins/apm/common/environment_rt.ts Normal file
View file

@ -0,0 +1,22 @@
/*
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
* or more contributor license agreements. Licensed under the Elastic License
* 2.0; you may not use this file except in compliance with the Elastic License
* 2.0.
*/
import * as t from 'io-ts';
import { nonEmptyStringRt } from '@kbn/io-ts-utils';
import {
ENVIRONMENT_ALL,
ENVIRONMENT_NOT_DEFINED,
} from './environment_filter_values';
export const environmentRt = t.type({
environment: t.union([
t.literal(ENVIRONMENT_NOT_DEFINED.value),
t.literal(ENVIRONMENT_ALL.value),
nonEmptyStringRt,
]),
});
export type Environment = t.TypeOf<typeof environmentRt>['environment'];

4
x-pack/plugins/apm/common/search_strategies/correlations/types.ts
View file

@ -19,8 +19,8 @@ export interface ResponseHit {
}
export interface SearchServiceParams {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
serviceName?: string;
transactionName?: string;
transactionType?: string;

4
x-pack/plugins/apm/common/utils/environment_query.test.ts
View file

@ -10,9 +10,9 @@ import { ENVIRONMENT_NOT_DEFINED } from '../environment_filter_values';
import { environmentQuery } from './environment_query';
describe('environmentQuery', () => {
describe('when environment is undefined', () => {
describe('when environment is an empty string', () => {
it('returns an empty query', () => {
expect(environmentQuery()).toEqual([]);
expect(environmentQuery('')).toEqual([]);
});
});

2
x-pack/plugins/apm/common/utils/environment_query.ts
View file

@ -13,7 +13,7 @@ import {
} from '../environment_filter_values';
export function environmentQuery(
environment?: string
environment: string
): QueryDslQueryContainer[] {
if (!environment || environment === ENVIRONMENT_ALL.value) {
return [];

2
x-pack/plugins/apm/ftr_e2e/cypress/integration/read_only_user/home.spec.ts
View file

@ -48,7 +48,7 @@ describe('Home page', () => {
it('includes services with only metric documents', () => {
cy.visit(
`${serviceInventoryHref}&kuery=not%2520(processor.event%2520%253A%2522transaction%2522%2520)`
`${serviceInventoryHref}&kuery=not%20(processor.event%3A%22transaction%22)`
);
cy.contains('opbeans-python');
cy.contains('opbeans-java');

3
x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/index.tsx
View file

@ -34,6 +34,7 @@ import {
import { TRANSACTION_PAGE_LOAD } from '../../../../../common/transaction_types';
import { useIndexPattern } from './use_index_pattern';
import { environmentQuery } from './queries';
import { ENVIRONMENT_ALL } from '../../../../../common/environment_filter_values';
const filterNames: UxLocalUIFilterName[] = [
'location',
@ -71,7 +72,7 @@ function LocalUIFilters() {
const getFilters = useMemo(() => {
const dataFilters: ESFilter[] = [
...RUM_DATA_FILTERS,
...environmentQuery(environment),
...environmentQuery(environment || ENVIRONMENT_ALL.value),
];
if (serviceName) {
dataFilters.push({

2
x-pack/plugins/apm/public/components/app/RumDashboard/LocalUIFilters/queries.ts
View file

@ -15,7 +15,7 @@ import {
type QueryDslQueryContainer = ESFilter;
export function environmentQuery(
environment?: string
environment: string
): QueryDslQueryContainer[] {
if (!environment || environment === ENVIRONMENT_ALL.value) {
return [];

2
x-pack/plugins/apm/public/components/app/TraceLink/get_redirect_to_trace_page_url.ts
View file

@ -20,7 +20,7 @@ export const getRedirectToTracePageUrl = ({
format({
pathname: `/traces`,
query: {
kuery: encodeURIComponent(`${TRACE_ID} : "${traceId}"`),
kuery: `${TRACE_ID} : "${traceId}"`,
rangeFrom,
rangeTo,
},

2
x-pack/plugins/apm/public/components/app/TraceLink/trace_link.test.tsx
View file

@ -97,7 +97,7 @@ describe('TraceLink', () => {
const component = shallow(<TraceLink />);
expect(component.prop('to')).toEqual(
'/traces?kuery=trace.id%2520%253A%2520%2522123%2522&rangeFrom=now-24h&rangeTo=now'
'/traces?kuery=trace.id%20%3A%20%22123%22&rangeFrom=now-24h&rangeTo=now'
);
});
});

5
x-pack/plugins/apm/public/components/app/backend_detail_overview/backend_detail_dependencies_table.tsx
View file

@ -20,11 +20,11 @@ import { DependenciesTableServiceMapLink } from '../../shared/dependencies_table
export function BackendDetailDependenciesTable() {
const {
urlParams: { start, end, environment, comparisonEnabled, comparisonType },
urlParams: { start, end, comparisonEnabled, comparisonType },
} = useUrlParams();
const {
query: { rangeFrom, rangeTo, kuery },
query: { rangeFrom, rangeTo, kuery, environment },
} = useApmParams('/backends/:backendName/overview');
const router = useApmRouter();
@ -34,6 +34,7 @@ export function BackendDetailDependenciesTable() {
rangeFrom,
rangeTo,
environment,
kuery,
},
});

7
x-pack/plugins/apm/public/components/app/backend_detail_overview/backend_error_rate_chart.tsx
View file

@ -8,7 +8,6 @@ import React, { useMemo } from 'react';
import { i18n } from '@kbn/i18n';
import { asPercent } from '../../../../common/utils/formatters';
import { useApmBackendContext } from '../../../context/apm_backend/use_apm_backend_context';
import { useUrlParams } from '../../../context/url_params_context/use_url_params';
import { useComparison } from '../../../hooks/use_comparison';
import { useFetcher } from '../../../hooks/use_fetcher';
import { useTimeRange } from '../../../hooks/use_time_range';
@ -31,15 +30,11 @@ export function BackendFailedTransactionRateChart({
const theme = useTheme();
const {
query: { rangeFrom, rangeTo },
query: { kuery, environment, rangeFrom, rangeTo },
} = useApmParams('/backends/:backendName/overview');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });
const {
urlParams: { kuery, environment },
} = useUrlParams();
const { offset, comparisonChartTheme } = useComparison();
const { data, status } = useFetcher(

7
x-pack/plugins/apm/public/components/app/backend_detail_overview/backend_latency_chart.tsx
View file

@ -8,7 +8,6 @@ import React, { useMemo } from 'react';
import { i18n } from '@kbn/i18n';
import { getDurationFormatter } from '../../../../common/utils/formatters';
import { useApmBackendContext } from '../../../context/apm_backend/use_apm_backend_context';
import { useUrlParams } from '../../../context/url_params_context/use_url_params';
import { useComparison } from '../../../hooks/use_comparison';
import { useFetcher } from '../../../hooks/use_fetcher';
import { useTimeRange } from '../../../hooks/use_time_range';
@ -27,15 +26,11 @@ export function BackendLatencyChart({ height }: { height: number }) {
const theme = useTheme();
const {
query: { rangeFrom, rangeTo },
query: { rangeFrom, rangeTo, kuery, environment },
} = useApmParams('/backends/:backendName/overview');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });
const {
urlParams: { kuery, environment },
} = useUrlParams();
const { offset, comparisonChartTheme } = useComparison();
const { data, status } = useFetcher(

7
x-pack/plugins/apm/public/components/app/backend_detail_overview/backend_throughput_chart.tsx
View file

@ -8,7 +8,6 @@ import React, { useMemo } from 'react';
import { i18n } from '@kbn/i18n';
import { asTransactionRate } from '../../../../common/utils/formatters';
import { useApmBackendContext } from '../../../context/apm_backend/use_apm_backend_context';
import { useUrlParams } from '../../../context/url_params_context/use_url_params';
import { useComparison } from '../../../hooks/use_comparison';
import { useFetcher } from '../../../hooks/use_fetcher';
import { useTimeRange } from '../../../hooks/use_time_range';
@ -23,15 +22,11 @@ export function BackendThroughputChart({ height }: { height: number }) {
const theme = useTheme();
const {
query: { rangeFrom, rangeTo },
query: { rangeFrom, rangeTo, kuery, environment },
} = useApmParams('/backends/:backendName/overview');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });
const {
urlParams: { kuery, environment },
} = useUrlParams();
const { offset, comparisonChartTheme } = useComparison();
const { data, status } = useFetcher(

8
x-pack/plugins/apm/public/components/app/backend_detail_overview/index.tsx
View file

@ -27,7 +27,7 @@ import { BackendDetailTemplate } from '../../routing/templates/backend_detail_te
export function BackendDetailOverview() {
const {
path: { backendName },
query: { rangeFrom, rangeTo },
query: { rangeFrom, rangeTo, environment, kuery },
} = useApmParams('/backends/:backendName/overview');
const apmRouter = useApmRouter();
@ -35,7 +35,9 @@ export function BackendDetailOverview() {
useBreadcrumb([
{
title: BackendInventoryTitle,
href: apmRouter.link('/backends', { query: { rangeFrom, rangeTo } }),
href: apmRouter.link('/backends', {
query: { rangeFrom, rangeTo, environment, kuery },
}),
},
{
title: backendName,
@ -44,6 +46,8 @@ export function BackendDetailOverview() {
query: {
rangeFrom,
rangeTo,
environment,
kuery,
},
}),
},

5
x-pack/plugins/apm/public/components/app/backend_inventory/backend_inventory_dependencies_table/index.tsx
View file

@ -21,11 +21,11 @@ import { useUiTracker } from '../../../../../../observability/public';
export function BackendInventoryDependenciesTable() {
const {
urlParams: { start, end, environment, comparisonEnabled, comparisonType },
urlParams: { start, end, comparisonEnabled, comparisonType },
} = useUrlParams();
const {
query: { rangeFrom, rangeTo, kuery },
query: { rangeFrom, rangeTo, environment, kuery },
} = useApmParams('/backends');
const router = useApmRouter();
@ -37,6 +37,7 @@ export function BackendInventoryDependenciesTable() {
rangeFrom,
rangeTo,
environment,
kuery,
},
});

14
x-pack/plugins/apm/public/components/app/correlations/error_correlations.tsx
View file

@ -22,6 +22,7 @@ import { useUiTracker } from '../../../../../observability/public';
import { useApmServiceContext } from '../../../context/apm_service/use_apm_service_context';
import { useUrlParams } from '../../../context/url_params_context/use_url_params';
import { useLocalStorage } from '../../../hooks/useLocalStorage';
import { useApmParams } from '../../../hooks/use_apm_params';
import { FETCH_STATUS, useFetcher } from '../../../hooks/use_fetcher';
import { useTheme } from '../../../hooks/use_theme';
import { APIReturnType } from '../../../services/rest/createCallApmApi';
@ -53,14 +54,7 @@ export function ErrorCorrelations({ onClose }: Props) {
const { serviceName } = useApmServiceContext();
const { urlParams } = useUrlParams();
const {
environment,
kuery,
transactionName,
transactionType,
start,
end,
} = urlParams;
const { transactionName, transactionType, start, end } = urlParams;
const { defaultFieldNames } = useFieldNames();
const [fieldNames, setFieldNames] = useLocalStorage(
`apm.correlations.errors.fields:${serviceName}`,
@ -68,6 +62,10 @@ export function ErrorCorrelations({ onClose }: Props) {
);
const hasFieldNames = fieldNames.length > 0;
const {
query: { environment, kuery },
} = useApmParams('/services/:serviceName');
const { data: overallData, status: overallStatus } = useFetcher(
(callApmApi) => {
if (start && end) {

37
x-pack/plugins/apm/public/components/app/correlations/index.tsx
View file

@ -40,16 +40,14 @@ import {
IStickyProperty,
StickyProperties,
} from '../../shared/sticky_properties';
import {
getEnvironmentLabel,
getNextEnvironmentUrlParam,
} from '../../../../common/environment_filter_values';
import { getEnvironmentLabel } from '../../../../common/environment_filter_values';
import {
SERVICE_ENVIRONMENT,
SERVICE_NAME,
TRANSACTION_NAME,
} from '../../../../common/elasticsearch_fieldnames';
import { useApmServiceContext } from '../../../context/apm_service/use_apm_service_context';
import { useApmParams } from '../../../hooks/use_apm_params';
const errorRateTab = {
key: 'errorRate',
@ -73,6 +71,10 @@ export function Correlations() {
const { urlParams } = useUrlParams();
const { serviceName } = useApmServiceContext();
const {
query: { environment },
} = useApmParams('/services/:serviceName');
const history = useHistory();
const [isFlyoutVisible, setIsFlyoutVisible] = useState(false);
const [currentTab, setCurrentTab] = useState(latencyCorrelationsTab.key);
@ -89,13 +91,8 @@ export function Correlations() {
useTrackMetric({ ...metric, delay: 15000 });
const stickyProperties: IStickyProperty[] = useMemo(() => {
const nextEnvironment = getNextEnvironmentUrlParam({
requestedEnvironment: serviceName,
currentEnvironmentUrlParam: urlParams.environment,
});
const properties: IStickyProperty[] = [];
if (serviceName !== undefined && nextEnvironment !== undefined) {
if (serviceName !== undefined) {
properties.push({
label: i18n.translate('xpack.apm.correlations.serviceLabel', {
defaultMessage: 'Service',
@ -106,16 +103,14 @@ export function Correlations() {
});
}
if (urlParams.environment) {
properties.push({
label: i18n.translate('xpack.apm.correlations.environmentLabel', {
defaultMessage: 'Environment',
}),
fieldName: SERVICE_ENVIRONMENT,
val: getEnvironmentLabel(urlParams.environment),
width: '20%',
});
}
properties.push({
label: i18n.translate('xpack.apm.correlations.environmentLabel', {
defaultMessage: 'Environment',
}),
fieldName: SERVICE_ENVIRONMENT,
val: getEnvironmentLabel(environment),
width: '20%',
});
if (urlParams.transactionName) {
properties.push({
@ -129,7 +124,7 @@ export function Correlations() {
}
return properties;
}, [serviceName, urlParams.environment, urlParams.transactionName]);
}, [serviceName, environment, urlParams.transactionName]);
return (
<>

15
x-pack/plugins/apm/public/components/app/correlations/latency_correlations.tsx
View file

@ -31,6 +31,7 @@ import { useFieldNames } from './use_field_names';
import { useLocalStorage } from '../../../hooks/useLocalStorage';
import { useUiTracker } from '../../../../../observability/public';
import { useApmServiceContext } from '../../../context/apm_service/use_apm_service_context';
import { useApmParams } from '../../../hooks/use_apm_params';
type OverallLatencyApiResponse = NonNullable<
APIReturnType<'GET /api/apm/correlations/latency/overall_distribution'>
@ -51,15 +52,13 @@ export function LatencyCorrelations({ onClose }: Props) {
] = useState<SelectedSignificantTerm | null>(null);
const { serviceName } = useApmServiceContext();
const { urlParams } = useUrlParams();
const {
environment,
kuery,
transactionName,
transactionType,
start,
end,
} = urlParams;
query: { kuery, environment },
} = useApmParams('/services/:serviceName');
const { urlParams } = useUrlParams();
const { transactionName, transactionType, start, end } = urlParams;
const { defaultFieldNames } = useFieldNames();
const [fieldNames, setFieldNames] = useLocalStorage(
`apm.correlations.latency.fields:${serviceName}`,

8
x-pack/plugins/apm/public/components/app/error_group_details/index.tsx
View file

@ -94,14 +94,14 @@ function ErrorGroupHeader({
export function ErrorGroupDetails() {
const { urlParams } = useUrlParams();
const { environment, kuery, start, end } = urlParams;
const { start, end } = urlParams;
const { serviceName } = useApmServiceContext();
const apmRouter = useApmRouter();
const {
path: { groupId },
query: { rangeFrom, rangeTo },
query: { rangeFrom, rangeTo, environment, kuery },
} = useApmParams('/services/:serviceName/errors/:groupId');
useBreadcrumb({
@ -114,6 +114,8 @@ export function ErrorGroupDetails() {
query: {
rangeFrom,
rangeTo,
environment,
kuery,
},
}),
});
@ -144,6 +146,8 @@ export function ErrorGroupDetails() {
const { errorDistributionData } = useErrorGroupDistributionFetcher({
serviceName,
groupId,
environment,
kuery,
});
if (!errorGroupData || !errorDistributionData) {

2
x-pack/plugins/apm/public/components/app/error_group_overview/index.tsx
View file

@ -36,6 +36,8 @@ export function ErrorGroupOverview() {
const { errorDistributionData } = useErrorGroupDistributionFetcher({
serviceName,
groupId: undefined,
environment,
kuery,
});
const { data: errorGroupListData } = useFetcher(

29
x-pack/plugins/apm/public/components/app/service_inventory/index.tsx
View file

@ -14,6 +14,7 @@ import { useAnomalyDetectionJobsContext } from '../../../context/anomaly_detecti
import { useApmPluginContext } from '../../../context/apm_plugin/use_apm_plugin_context';
import { useUrlParams } from '../../../context/url_params_context/use_url_params';
import { useLocalStorage } from '../../../hooks/useLocalStorage';
import { useApmParams } from '../../../hooks/use_apm_params';
import { FETCH_STATUS, useFetcher } from '../../../hooks/use_fetcher';
import { useFallbackToTransactionsFetcher } from '../../../hooks/use_fallback_to_transactions_fetcher';
import { AggregatedTransactionsCallout } from '../../shared/aggregated_transactions_callout';
@ -35,16 +36,15 @@ const initialData = {
let hasDisplayedToast = false;
function useServicesFetcher() {
function useServicesFetcher({
environment,
kuery,
}: {
environment: string;
kuery: string;
}) {
const {
urlParams: {
environment,
kuery,
start,
end,
comparisonEnabled,
comparisonType,
},
urlParams: { start, end, comparisonEnabled, comparisonType },
} = useUrlParams();
const { core } = useApmPluginContext();
const upgradeAssistantHref = useUpgradeAssistantHref();
@ -155,13 +155,20 @@ function useServicesFetcher() {
export function ServiceInventory() {
const { core } = useApmPluginContext();
const { fallbackToTransactions } = useFallbackToTransactionsFetcher();
const {
query: { environment, kuery },
} = useApmParams('/services');
const { fallbackToTransactions } = useFallbackToTransactionsFetcher({
kuery,
});
const {
mainStatisticsData,
mainStatisticsStatus,
comparisonData,
isLoading,
} = useServicesFetcher();
} = useServicesFetcher({ environment, kuery });
const {
anomalyDetectionJobsData,

3
x-pack/plugins/apm/public/components/app/service_inventory/service_list/service_list.test.tsx
View file

@ -13,6 +13,7 @@ import { MockApmPluginContextWrapper } from '../../../../context/apm_plugin/mock
import { mockMoment, renderWithTheme } from '../../../../utils/testHelpers';
import { getServiceColumns, ServiceList } from './';
import { items } from './__fixtures__/service_api_mock_data';
import { ENVIRONMENT_ALL } from '../../../../../common/environment_filter_values';
function Wrapper({ children }: { children?: ReactNode }) {
return (
@ -47,6 +48,8 @@ describe('ServiceList', () => {
const query = {
rangeFrom: 'now-15m',
rangeTo: 'now',
environment: ENVIRONMENT_ALL.value,
kuery: '',
};
const service: any = {

8
x-pack/plugins/apm/public/components/app/service_logs/index.tsx
View file

@ -21,11 +21,17 @@ import {
HOSTNAME,
POD_NAME,
} from '../../../../common/elasticsearch_fieldnames';
import { useApmParams } from '../../../hooks/use_apm_params';
export function ServiceLogs() {
const { serviceName } = useApmServiceContext();
const {
urlParams: { environment, kuery, start, end },
query: { environment, kuery },
} = useApmParams('/services/:serviceName/logs');
const {
urlParams: { start, end },
} = useUrlParams();
const { data, status } = useFetcher(

11
x-pack/plugins/apm/public/components/app/service_map/Popover/Popover.stories.tsx
View file

@ -12,6 +12,7 @@ import React from 'react';
import { MemoryRouter } from 'react-router-dom';
import { Popover } from '.';
import { createKibanaReactContext } from '../../../../../../../../src/plugins/kibana_react/public';
import { ENVIRONMENT_ALL } from '../../../../../common/environment_filter_values';
import { MockApmPluginContextWrapper } from '../../../../context/apm_plugin/mock_apm_plugin_context';
import { MockUrlParamsContextProvider } from '../../../../context/url_params_context/mock_url_params_context_provider';
import { createCallApmApi } from '../../../../services/rest/createCallApmApi';
@ -97,7 +98,7 @@ const stories: Meta<Args> = {
export default stories;
export const Backend: Story<Args> = () => {
return <Popover />;
return <Popover environment={ENVIRONMENT_ALL.value} kuery="" />;
};
Backend.args = {
nodeData: {
@ -110,7 +111,7 @@ Backend.args = {
};
export const BackendWithLongTitle: Story<Args> = () => {
return <Popover />;
return <Popover environment={ENVIRONMENT_ALL.value} kuery="" />;
};
BackendWithLongTitle.args = {
nodeData: {
@ -124,14 +125,14 @@ BackendWithLongTitle.args = {
};
export const ExternalsList: Story<Args> = () => {
return <Popover />;
return <Popover environment={ENVIRONMENT_ALL.value} kuery="" />;
};
ExternalsList.args = {
nodeData: exampleGroupedConnectionsData,
};
export const Resource: Story<Args> = () => {
return <Popover />;
return <Popover environment={ENVIRONMENT_ALL.value} kuery="" />;
};
Resource.args = {
nodeData: {
@ -144,7 +145,7 @@ Resource.args = {
};
export const Service: Story<Args> = () => {
return <Popover />;
return <Popover environment={ENVIRONMENT_ALL.value} kuery="" />;
};
Service.args = {
nodeData: {

4
x-pack/plugins/apm/public/components/app/service_map/Popover/backend_contents.tsx
View file

@ -20,11 +20,11 @@ import { FETCH_STATUS, useFetcher } from '../../../../hooks/use_fetcher';
import { ApmRoutes } from '../../../routing/apm_route_config';
import { StatsList } from './stats_list';
export function BackendContents({ nodeData }: ContentsProps) {
export function BackendContents({ nodeData, environment }: ContentsProps) {
const { query } = useApmParams('/*');
const apmRouter = useApmRouter();
const {
urlParams: { environment, start, end },
urlParams: { start, end },
} = useUrlParams();
const backendName = nodeData.label;

13
x-pack/plugins/apm/public/components/app/service_map/Popover/index.tsx
View file

@ -26,6 +26,7 @@ import {
SERVICE_NAME,
SPAN_TYPE,
} from '../../../../../common/elasticsearch_fieldnames';
import { Environment } from '../../../../../common/environment_rt';
import { useTheme } from '../../../../hooks/use_theme';
import { CytoscapeContext } from '../Cytoscape';
import { getAnimationOptions, popoverWidth } from '../cytoscape_options';
@ -53,14 +54,22 @@ function getContentsComponent(selectedNodeData: cytoscape.NodeDataDefinition) {
export interface ContentsProps {
nodeData: cytoscape.NodeDataDefinition;
environment: Environment;
kuery: string;
onFocusClick: (event: MouseEvent<HTMLAnchorElement>) => void;
}
interface PopoverProps {
focusedServiceName?: string;
environment: Environment;
kuery: string;
}
export function Popover({ focusedServiceName }: PopoverProps) {
export function Popover({
focusedServiceName,
environment,
kuery,
}: PopoverProps) {
const theme = useTheme();
const cy = useContext(CytoscapeContext);
const [selectedNode, setSelectedNode] = useState<
@ -171,6 +180,8 @@ export function Popover({ focusedServiceName }: PopoverProps) {
<ContentsComponent
onFocusClick={onFocusClick}
nodeData={selectedNodeData}
environment={environment}
kuery={kuery}
/>
</EuiFlexGroup>
</EuiPopover>

16
x-pack/plugins/apm/public/components/app/service_map/Popover/service_contents.tsx
View file

@ -13,20 +13,20 @@ import React from 'react';
import { useApmParams } from '../../../../hooks/use_apm_params';
import type { ContentsProps } from '.';
import { NodeStats } from '../../../../../common/service_map';
import { useUrlParams } from '../../../../context/url_params_context/use_url_params';
import { useApmRouter } from '../../../../hooks/use_apm_router';
import { FETCH_STATUS, useFetcher } from '../../../../hooks/use_fetcher';
import { AnomalyDetection } from './anomaly_detection';
import { StatsList } from './stats_list';
import { useTimeRange } from '../../../../hooks/use_time_range';
export function ServiceContents({ onFocusClick, nodeData }: ContentsProps) {
export function ServiceContents({
onFocusClick,
nodeData,
environment,
kuery,
}: ContentsProps) {
const apmRouter = useApmRouter();
const {
urlParams: { environment },
} = useUrlParams();
const { query } = useApmParams('/*');
if (
@ -65,12 +65,12 @@ export function ServiceContents({ onFocusClick, nodeData }: ContentsProps) {
const detailsUrl = apmRouter.link('/services/:serviceName', {
path: { serviceName },
query: { rangeFrom, rangeTo },
query: { rangeFrom, rangeTo, environment, kuery },
});
const focusUrl = apmRouter.link('/services/:serviceName/service-map', {
path: { serviceName },
query: { rangeFrom, rangeTo },
query: { rangeFrom, rangeTo, environment, kuery },
});
const { serviceAnomalyStats } = nodeData;

28
x-pack/plugins/apm/public/components/app/service_map/index.test.tsx
View file

@ -18,6 +18,7 @@ import * as useFetcherModule from '../../../hooks/use_fetcher';
import { ServiceMap } from '.';
import { UrlParamsProvider } from '../../../context/url_params_context/url_params_context';
import { Router } from 'react-router-dom';
import { ENVIRONMENT_ALL } from '../../../../common/environment_filter_values';
const history = createMemoryHistory();
@ -69,9 +70,12 @@ describe('ServiceMap', () => {
describe('with no license', () => {
it('renders null', async () => {
expect(
await render(<ServiceMap />, {
wrapper: createWrapper(null),
}).queryByTestId('ServiceMap')
await render(
<ServiceMap environment={ENVIRONMENT_ALL.value} kuery="" />,
{
wrapper: createWrapper(null),
}
).queryByTestId('ServiceMap')
).not.toBeInTheDocument();
});
});
@ -79,9 +83,12 @@ describe('ServiceMap', () => {
describe('with an expired license', () => {
it('renders the license banner', async () => {
expect(
await render(<ServiceMap />, {
wrapper: createWrapper(expiredLicense),
}).findAllByText(/Platinum/)
await render(
<ServiceMap environment={ENVIRONMENT_ALL.value} kuery="" />,
{
wrapper: createWrapper(expiredLicense),
}
).findAllByText(/Platinum/)
).toHaveLength(1);
});
});
@ -96,9 +103,12 @@ describe('ServiceMap', () => {
});
expect(
await render(<ServiceMap />, {
wrapper: createWrapper(activeLicense),
}).findAllByText(/No services available/)
await render(
<ServiceMap environment={ENVIRONMENT_ALL.value} kuery="" />,
{
wrapper: createWrapper(activeLicense),
}
).findAllByText(/No services available/)
).toHaveLength(1);
});
});

35
x-pack/plugins/apm/public/components/app/service_map/index.tsx
View file

@ -32,6 +32,8 @@ import { TimeoutPrompt } from './timeout_prompt';
import { useRefDimensions } from './useRefDimensions';
import { SearchBar } from '../../shared/search_bar';
import { useServiceName } from '../../../hooks/use_service_name';
import { useApmParams } from '../../../hooks/use_apm_params';
import { Environment } from '../../../../common/environment_rt';
function PromptContainer({ children }: { children: ReactNode }) {
return (
@ -63,9 +65,30 @@ function LoadingSpinner() {
);
}
export function ServiceMap() {
export function ServiceMapHome() {
const {
query: { environment, kuery },
} = useApmParams('/service-map');
return <ServiceMap environment={environment} kuery={kuery} />;
}
export function ServiceMapServiceDetail() {
const {
query: { environment, kuery },
} = useApmParams('/services/:serviceName/service-map');
return <ServiceMap environment={environment} kuery={kuery} />;
}
export function ServiceMap({
environment,
kuery,
}: {
environment: Environment;
kuery: string;
}) {
const theme = useTheme();
const license = useLicenseContext();
const { urlParams } = useUrlParams();
const serviceName = useServiceName();
@ -77,7 +100,7 @@ export function ServiceMap() {
return;
}
const { start, end, environment } = urlParams;
const { start, end } = urlParams;
if (start && end) {
return callApmApi({
isCachable: false,
@ -93,7 +116,7 @@ export function ServiceMap() {
});
}
},
[license, serviceName, urlParams]
[license, serviceName, environment, urlParams]
);
const { ref, height } = useRefDimensions();
@ -154,7 +177,11 @@ export function ServiceMap() {
<Controls />
{serviceName && <EmptyBanner />}
{status === FETCH_STATUS.LOADING && <LoadingSpinner />}
<Popover focusedServiceName={serviceName} />
<Popover
focusedServiceName={serviceName}
environment={environment}
kuery={kuery}
/>
</Cytoscape>
</div>
</EuiPanel>

7
x-pack/plugins/apm/public/components/app/service_metrics/index.tsx
View file

@ -9,13 +9,20 @@ import { EuiFlexGrid, EuiFlexItem, EuiPanel, EuiSpacer } from '@elastic/eui';
import React from 'react';
import { ChartPointerEventContextProvider } from '../../../context/chart_pointer_event/chart_pointer_event_context';
import { useUrlParams } from '../../../context/url_params_context/use_url_params';
import { useApmParams } from '../../../hooks/use_apm_params';
import { useServiceMetricChartsFetcher } from '../../../hooks/use_service_metric_charts_fetcher';
import { MetricsChart } from '../../shared/charts/metrics_chart';
export function ServiceMetrics() {
const { urlParams } = useUrlParams();
const {
query: { environment, kuery },
} = useApmParams('/services/:serviceName/metrics');
const { data, status } = useServiceMetricChartsFetcher({
serviceNodeName: undefined,
environment,
kuery,
});
const { start, end } = urlParams;

10
x-pack/plugins/apm/public/components/app/service_node_metrics/index.tsx
View file

@ -47,7 +47,7 @@ const Truncate = euiStyled.span`
export function ServiceNodeMetrics() {
const {
urlParams: { kuery, start, end },
urlParams: { start, end },
} = useUrlParams();
const { agentName, serviceName } = useApmServiceContext();
@ -58,6 +58,8 @@ export function ServiceNodeMetrics() {
query,
} = useApmParams('/services/:serviceName/nodes/:serviceNodeName/metrics');
const { environment, kuery } = query;
useBreadcrumb({
title: getServiceNodeName(serviceNodeName),
href: apmRouter.link(
@ -72,7 +74,11 @@ export function ServiceNodeMetrics() {
),
});
const { data } = useServiceMetricChartsFetcher({ serviceNodeName });
const { data } = useServiceMetricChartsFetcher({
serviceNodeName,
kuery,
environment,
});
const { data: { host, containerId } = INITIAL_DATA, status } = useFetcher(
(callApmApi) => {

10
x-pack/plugins/apm/public/components/app/service_node_overview/index.tsx
View file

@ -19,6 +19,7 @@ import {
} from '../../../../common/utils/formatters';
import { useApmServiceContext } from '../../../context/apm_service/use_apm_service_context';
import { useUrlParams } from '../../../context/url_params_context/use_url_params';
import { useApmParams } from '../../../hooks/use_apm_params';
import { useFetcher } from '../../../hooks/use_fetcher';
import { truncate, unit } from '../../../utils/style';
import { ServiceNodeMetricOverviewLink } from '../../shared/Links/apm/ServiceNodeMetricOverviewLink';
@ -34,7 +35,11 @@ const ServiceNodeName = euiStyled.div`
function ServiceNodeOverview() {
const {
urlParams: { kuery, start, end },
query: { environment, kuery },
} = useApmParams('/services/:serviceName/nodes');
const {
urlParams: { start, end },
} = useUrlParams();
const { serviceName } = useApmServiceContext();
@ -52,13 +57,14 @@ function ServiceNodeOverview() {
},
query: {
kuery,
environment,
start,
end,
},
},
});
},
[kuery, serviceName, start, end]
[kuery, environment, serviceName, start, end]
);
const items = data?.serviceNodes ?? [];

35
x-pack/plugins/apm/public/components/app/service_overview/index.tsx
View file

@ -20,6 +20,7 @@ import { ServiceOverviewErrorsTable } from './service_overview_errors_table';
import { ServiceOverviewInstancesChartAndTable } from './service_overview_instances_chart_and_table';
import { ServiceOverviewThroughputChart } from './service_overview_throughput_chart';
import { TransactionsTable } from '../../shared/transactions_table';
import { useApmParams } from '../../../hooks/use_apm_params';
import { useFallbackToTransactionsFetcher } from '../../../hooks/use_fallback_to_transactions_fetcher';
import { AggregatedTransactionsCallout } from '../../shared/aggregated_transactions_callout';
@ -30,8 +31,13 @@ import { AggregatedTransactionsCallout } from '../../shared/aggregated_transacti
export const chartHeight = 288;
export function ServiceOverview() {
const { fallbackToTransactions } = useFallbackToTransactionsFetcher();
const { agentName, serviceName } = useApmServiceContext();
const {
query: { environment, kuery },
} = useApmParams('/services/:serviceName/overview');
const { fallbackToTransactions } = useFallbackToTransactionsFetcher({
kuery,
});
// The default EuiFlexGroup breaks at 768, but we want to break at 992, so we
// observe the window width and set the flex directions of rows accordingly
@ -41,7 +47,10 @@ export function ServiceOverview() {
const isIosAgent = isIosAgentName(agentName);
return (
<AnnotationsContextProvider>
<AnnotationsContextProvider
serviceName={serviceName}
environment={environment}
>
<ChartPointerEventContextProvider>
<EuiFlexGroup direction="column" gutterSize="s">
{fallbackToTransactions && (
@ -51,7 +60,11 @@ export function ServiceOverview() {
)}
<EuiFlexItem>
<EuiPanel hasBorder={true}>
<LatencyChart height={200} />
<LatencyChart
height={200}
environment={environment}
kuery={kuery}
/>
</EuiPanel>
</EuiFlexItem>
<EuiFlexItem>
@ -61,11 +74,15 @@ export function ServiceOverview() {
responsive={false}
>
<EuiFlexItem grow={3}>
<ServiceOverviewThroughputChart height={chartHeight} />
<ServiceOverviewThroughputChart
height={chartHeight}
environment={environment}
kuery={kuery}
/>
</EuiFlexItem>
<EuiFlexItem grow={7}>
<EuiPanel hasBorder={true}>
<TransactionsTable />
<TransactionsTable kuery={kuery} environment={environment} />
</EuiPanel>
</EuiFlexItem>
</EuiFlexGroup>
@ -81,6 +98,8 @@ export function ServiceOverview() {
<TransactionErrorRateChart
height={chartHeight}
showAnnotations={false}
kuery={kuery}
environment={environment}
/>
</EuiFlexItem>
)}
@ -98,7 +117,11 @@ export function ServiceOverview() {
responsive={false}
>
<EuiFlexItem grow={3}>
<TransactionBreakdownChart showAnnotations={false} />
<TransactionBreakdownChart
showAnnotations={false}
environment={environment}
kuery={environment}
/>
</EuiFlexItem>
{!isRumAgent && (
<EuiFlexItem grow={7}>

3
x-pack/plugins/apm/public/components/app/service_overview/service_overview_dependencies_table/index.tsx
View file

@ -26,7 +26,6 @@ export function ServiceOverviewDependenciesTable() {
urlParams: {
start,
end,
environment,
comparisonEnabled,
comparisonType,
latencyAggregationType,
@ -35,7 +34,7 @@ export function ServiceOverviewDependenciesTable() {
const {
query,
query: { kuery, rangeFrom, rangeTo },
query: { environment, kuery, rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/*');
const { offset } = getTimeRangeComparison({

14
x-pack/plugins/apm/public/components/app/service_overview/service_overview_errors_table/index.tsx
View file

@ -24,6 +24,7 @@ import { TableFetchWrapper } from '../../../shared/table_fetch_wrapper';
import { getTimeRangeComparison } from '../../../shared/time_comparison/get_time_range_comparison';
import { OverviewTableContainer } from '../../../shared/overview_table_container';
import { getColumns } from './get_column';
import { useApmParams } from '../../../../hooks/use_apm_params';
interface Props {
serviceName: string;
@ -57,14 +58,7 @@ const INITIAL_STATE_DETAILED_STATISTICS: ErrorGroupDetailedStatistics = {
export function ServiceOverviewErrorsTable({ serviceName }: Props) {
const {
urlParams: {
environment,
kuery,
start,
end,
comparisonType,
comparisonEnabled,
},
urlParams: { start, end, comparisonType, comparisonEnabled },
} = useUrlParams();
const { transactionType } = useApmServiceContext();
const [tableOptions, setTableOptions] = useState<{
@ -88,6 +82,10 @@ export function ServiceOverviewErrorsTable({ serviceName }: Props) {
const { pageIndex, sort } = tableOptions;
const { direction, field } = sort;
const {
query: { environment, kuery },
} = useApmParams('/services/:serviceName/overview');
const { data = INITIAL_STATE_MAIN_STATISTICS, status } = useFetcher(
(callApmApi) => {
if (!start || !end || !transactionType) {

7
x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_chart_and_table.tsx
View file

@ -11,6 +11,7 @@ import React, { useState } from 'react';
import uuid from 'uuid';
import { useApmServiceContext } from '../../../context/apm_service/use_apm_service_context';
import { useUrlParams } from '../../../context/url_params_context/use_url_params';
import { useApmParams } from '../../../hooks/use_apm_params';
import { FETCH_STATUS, useFetcher } from '../../../hooks/use_fetcher';
import { APIReturnType } from '../../../services/rest/createCallApmApi';
import { InstancesLatencyDistributionChart } from '../../shared/charts/instances_latency_distribution_chart';
@ -68,10 +69,12 @@ export function ServiceOverviewInstancesChartAndTable({
const { pageIndex, sort } = tableOptions;
const { direction, field } = sort;
const {
query: { environment, kuery },
} = useApmParams('/services/:serviceName/overview');
const {
urlParams: {
environment,
kuery,
latencyAggregationType,
start,
end,

13
x-pack/plugins/apm/public/components/app/service_overview/service_overview_throughput_chart.tsx
View file

@ -33,20 +33,17 @@ const INITIAL_STATE = {
export function ServiceOverviewThroughputChart({
height,
environment,
kuery,
}: {
height?: number;
environment: string;
kuery: string;
}) {
const theme = useTheme();
const {
urlParams: {
environment,
kuery,
start,
end,
comparisonEnabled,
comparisonType,
},
urlParams: { start, end, comparisonEnabled, comparisonType },
} = useUrlParams();
const { transactionType, serviceName } = useApmServiceContext();

4
x-pack/plugins/apm/public/components/app/service_profiling/index.tsx
View file

@ -25,11 +25,11 @@ export function ServiceProfiling() {
const { serviceName } = useApmServiceContext();
const {
query: { environment },
query: { environment, kuery },
} = useApmParams('/services/:serviceName/profiling');
const {
urlParams: { kuery, start, end },
urlParams: { start, end },
} = useUrlParams();
const { data = DEFAULT_DATA } = useFetcher(

4
x-pack/plugins/apm/public/components/app/service_profiling/service_profiling_flamegraph.tsx
View file

@ -129,8 +129,8 @@ export function ServiceProfilingFlamegraph({
end,
}: {
serviceName: string;
environment?: string;
kuery?: string;
environment: string;
kuery: string;
valueType?: ProfilingValueType;
start?: string;
end?: string;

11
x-pack/plugins/apm/public/components/app/trace_overview/index.tsx
View file

@ -8,6 +8,7 @@
import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
import React from 'react';
import { useUrlParams } from '../../../context/url_params_context/use_url_params';
import { useApmParams } from '../../../hooks/use_apm_params';
import { FETCH_STATUS, useFetcher } from '../../../hooks/use_fetcher';
import { APIReturnType } from '../../../services/rest/createCallApmApi';
import { SearchBar } from '../../shared/search_bar';
@ -21,9 +22,15 @@ const DEFAULT_RESPONSE: TracesAPIResponse = {
};
export function TraceOverview() {
const { fallbackToTransactions } = useFallbackToTransactionsFetcher();
const {
urlParams: { environment, kuery, start, end },
query: { environment, kuery },
} = useApmParams('/traces');
const { fallbackToTransactions } = useFallbackToTransactionsFetcher({
kuery,
});
const {
urlParams: { start, end },
} = useUrlParams();
const { status, data = DEFAULT_RESPONSE } = useFetcher(
(callApmApi) => {

11
x-pack/plugins/apm/public/components/app/transaction_details/index.tsx
View file

@ -49,7 +49,11 @@ export function TransactionDetails() {
const {
distributionData,
distributionStatus,
} = useTransactionDistributionFetcher({ transactionName });
} = useTransactionDistributionFetcher({
transactionName,
environment: query.environment,
kuery: query.kuery,
});
useBreadcrumb({
title: transactionName,
@ -100,7 +104,10 @@ export function TransactionDetails() {
<EuiSpacer size="m" />
<ChartPointerEventContextProvider>
<TransactionCharts />
<TransactionCharts
kuery={query.kuery}
environment={query.environment}
/>
</ChartPointerEventContextProvider>
<EuiHorizontalRule size="full" margin="l" />

5
x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/MaybeViewTraceLink.tsx
View file

@ -13,16 +13,19 @@ import { useUrlParams } from '../../../../context/url_params_context/use_url_par
import { Transaction as ITransaction } from '../../../../../typings/es_schemas/ui/transaction';
import { TransactionDetailLink } from '../../../shared/Links/apm/transaction_detail_link';
import { IWaterfall } from './waterfall_container/Waterfall/waterfall_helpers/waterfall_helpers';
import { Environment } from '../../../../../common/environment_rt';
export const MaybeViewTraceLink = ({
transaction,
waterfall,
environment,
}: {
transaction: ITransaction;
waterfall: IWaterfall;
environment: Environment;
}) => {
const {
urlParams: { environment, latencyAggregationType },
urlParams: { latencyAggregationType },
} = useUrlParams();
const viewFullTraceButtonLabel = i18n.translate(

6
x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/index.tsx
View file

@ -26,6 +26,7 @@ import { TransactionActionMenu } from '../../../shared/transaction_action_menu/T
import { MaybeViewTraceLink } from './MaybeViewTraceLink';
import { TransactionTabs } from './TransactionTabs';
import { IWaterfall } from './waterfall_container/Waterfall/waterfall_helpers/waterfall_helpers';
import { useApmParams } from '../../../../hooks/use_apm_params';
type DistributionApiResponse = APIReturnType<'GET /api/apm/services/{serviceName}/transactions/charts/distribution'>;
@ -49,6 +50,10 @@ export function WaterfallWithSummary({
const history = useHistory();
const [sampleActivePage, setSampleActivePage] = useState(0);
const {
query: { environment },
} = useApmParams('/services/:serviceName/transactions/view');
useEffect(() => {
setSampleActivePage(0);
}, [traceSamples]);
@ -116,6 +121,7 @@ export function WaterfallWithSummary({
<MaybeViewTraceLink
transaction={entryTransaction}
waterfall={waterfall}
environment={environment}
/>
</EuiFlexGroup>
</EuiFlexItem>

5
x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/span_flyout/sticky_span_properties.tsx
View file

@ -56,7 +56,10 @@ export function StickySpanProperties({ span, transaction }: Props) {
val: (
<ServiceLink
agentName={transaction.agent.name}
query={{ ...query, environment: nextEnvironment }}
query={{
...query,
environment: nextEnvironment,
}}
serviceName={transaction.service.name}
/>
),

4
x-pack/plugins/apm/public/components/app/transaction_details/waterfall_with_summary/waterfall_container/Waterfall/waterfall_item.tsx
View file

@ -220,9 +220,7 @@ export function WaterfallItem({
<ErrorOverviewLink
serviceName={item.doc.service.name}
query={{
kuery: encodeURIComponent(
`${TRACE_ID} : "${item.doc.trace.id}" and transaction.id : "${item.doc.transaction.id}"`
),
kuery: `${TRACE_ID} : "${item.doc.trace.id}" and transaction.id : "${item.doc.transaction.id}"`,
}}
color="danger"
style={{ textDecoration: 'none' }}

13
x-pack/plugins/apm/public/components/app/transaction_overview/index.tsx
View file

@ -12,6 +12,7 @@ import { useLocation } from 'react-router-dom';
import { useApmServiceContext } from '../../../context/apm_service/use_apm_service_context';
import { IUrlParams } from '../../../context/url_params_context/types';
import { useUrlParams } from '../../../context/url_params_context/use_url_params';
import { useApmParams } from '../../../hooks/use_apm_params';
import { useFallbackToTransactionsFetcher } from '../../../hooks/use_fallback_to_transactions_fetcher';
import { AggregatedTransactionsCallout } from '../../shared/aggregated_transactions_callout';
import { TransactionCharts } from '../../shared/charts/transaction_charts';
@ -42,7 +43,13 @@ function getRedirectLocation({
}
export function TransactionOverview() {
const { fallbackToTransactions } = useFallbackToTransactionsFetcher();
const {
query: { environment, kuery },
} = useApmParams('/services/:serviceName/transactions');
const { fallbackToTransactions } = useFallbackToTransactionsFetcher({
kuery,
});
const location = useLocation();
const { urlParams } = useUrlParams();
const { transactionType, serviceName } = useApmServiceContext();
@ -68,13 +75,15 @@ export function TransactionOverview() {
<EuiSpacer size="s" />
</>
)}
<TransactionCharts />
<TransactionCharts kuery={kuery} environment={environment} />
<EuiSpacer size="s" />
<EuiPanel hasBorder={true}>
<TransactionsTable
hideViewTransactionsLink
numberOfTransactionsPerPage={25}
showAggregationAccurateCallout
environment={environment}
kuery={kuery}
/>
</EuiPanel>
</>

14
x-pack/plugins/apm/public/components/routing/home/index.tsx
View file

@ -9,11 +9,13 @@ import { Outlet } from '@kbn/typed-react-router-config';
import * as t from 'io-ts';
import React from 'react';
import { Redirect } from 'react-router-dom';
import { ENVIRONMENT_ALL } from '../../../../common/environment_filter_values';
import { environmentRt } from '../../../../common/environment_rt';
import { BackendDetailOverview } from '../../app/backend_detail_overview';
import { BackendInventory } from '../../app/backend_inventory';
import { Breadcrumb } from '../../app/breadcrumb';
import { ServiceInventory } from '../../app/service_inventory';
import { ServiceMap } from '../../app/service_map';
import { ServiceMapHome } from '../../app/service_map';
import { TraceOverview } from '../../app/trace_overview';
import { ApmMainTemplate } from '../templates/apm_main_template';
@ -55,13 +57,11 @@ export const home = {
element: <Outlet />,
params: t.type({
query: t.intersection([
t.partial({
environment: t.string,
kuery: t.string,
}),
environmentRt,
t.type({
rangeFrom: t.string,
rangeTo: t.string,
kuery: t.string,
}),
]),
}),
@ -69,6 +69,8 @@ export const home = {
query: {
rangeFrom: 'now-15m',
rangeTo: 'now',
environment: ENVIRONMENT_ALL.value,
kuery: '',
},
},
children: [
@ -89,7 +91,7 @@ export const home = {
title: i18n.translate('xpack.apm.views.serviceMap.title', {
defaultMessage: 'Service Map',
}),
element: <ServiceMap />,
element: <ServiceMapHome />,
}),
{
path: '/backends',

12
x-pack/plugins/apm/public/components/routing/service_detail/index.tsx
View file

@ -8,6 +8,8 @@ import * as t from 'io-ts';
import { i18n } from '@kbn/i18n';
import React from 'react';
import { Outlet } from '@kbn/typed-react-router-config';
import { ENVIRONMENT_ALL } from '../../../../common/environment_filter_values';
import { environmentRt } from '../../../../common/environment_rt';
import { ServiceOverview } from '../../app/service_overview';
import { ApmServiceTemplate } from '../templates/apm_service_template';
import { RedirectToDefaultServiceRouteView } from './redirect_to_default_service_route_view';
@ -18,7 +20,7 @@ import { ErrorGroupDetails } from '../../app/error_group_details';
import { ServiceMetrics } from '../../app/service_metrics';
import { ServiceNodeOverview } from '../../app/service_node_overview';
import { ServiceNodeMetrics } from '../../app/service_node_metrics';
import { ServiceMap } from '../../app/service_map';
import { ServiceMapServiceDetail } from '../../app/service_map';
import { TransactionDetails } from '../../app/transaction_details';
import { ServiceProfiling } from '../../app/service_profiling';
import { ServiceDependencies } from '../../app/service_dependencies';
@ -69,17 +71,17 @@ export const serviceDetail = {
}),
t.type({
query: t.intersection([
environmentRt,
t.type({
rangeFrom: t.string,
rangeTo: t.string,
kuery: t.string,
}),
t.partial({
environment: t.string,
comparisonEnabled: t.string,
comparisonType: t.string,
latencyAggregationType: t.string,
transactionType: t.string,
kuery: t.string,
}),
]),
}),
@ -88,6 +90,8 @@ export const serviceDetail = {
query: {
rangeFrom: 'now-15m',
rangeTo: 'now',
kuery: '',
environment: ENVIRONMENT_ALL.value,
},
},
children: [
@ -229,7 +233,7 @@ export const serviceDetail = {
title: i18n.translate('xpack.apm.views.serviceMap.title', {
defaultMessage: 'Service Map',
}),
element: <ServiceMap />,
element: <ServiceMapServiceDetail />,
searchBarOptions: {
hidden: true,
},

5
x-pack/plugins/apm/public/components/shared/EnvironmentFilter/index.tsx
View file

@ -22,10 +22,9 @@ import { useApmParams } from '../../../hooks/use_apm_params';
function updateEnvironmentUrl(
history: History,
location: ReturnType<typeof useLocation>,
environment?: string
environment: string
) {
const nextEnvironmentQueryParam =
environment !== ENVIRONMENT_ALL.value ? environment : undefined;
const nextEnvironmentQueryParam = environment;
history.push({
...location,
search: fromQuery({

9
x-pack/plugins/apm/public/components/shared/charts/latency_chart/index.tsx
View file

@ -33,6 +33,8 @@ const ALERT_RULE_TYPE_ID: typeof ALERT_RULE_TYPE_ID_TYPED = ALERT_RULE_TYPE_ID_N
interface Props {
height?: number;
kuery: string;
environment: string;
}
const options: Array<{ value: LatencyAggregationType; text: string }> = [
@ -45,7 +47,7 @@ function filterNil<T>(value: T | null | undefined): value is T {
return value != null;
}
export function LatencyChart({ height }: Props) {
export function LatencyChart({ height, kuery, environment }: Props) {
const history = useHistory();
const theme = useTheme();
const comparisonChartTheme = getComparisonChartTheme(theme);
@ -56,7 +58,10 @@ export function LatencyChart({ height }: Props) {
const {
latencyChartsData,
latencyChartsStatus,
} = useTransactionLatencyChartsFetcher();
} = useTransactionLatencyChartsFetcher({
kuery,
environment,
});
const {
currentPeriod,

9
x-pack/plugins/apm/public/components/shared/charts/latency_chart/latency_chart.stories.tsx
View file

@ -24,6 +24,7 @@ import { StoryContext } from '@storybook/react';
import React, { ComponentType } from 'react';
import { MemoryRouter, Route } from 'react-router-dom';
import { KibanaContextProvider } from '../../../../../../../../src/plugins/kibana_react/public';
import { ENVIRONMENT_ALL } from '../../../../../common/environment_filter_values';
import { LatencyAggregationType } from '../../../../../common/latency_aggregation_types';
import {
ApmPluginContext,
@ -119,7 +120,9 @@ export default {
};
export function Example(_args: Args) {
return <LatencyChart height={300} />;
return (
<LatencyChart height={300} environment={ENVIRONMENT_ALL.value} kuery="" />
);
}
Example.args = {
alertsResponse: {
@ -801,7 +804,9 @@ Example.args = {
};
export function NoData(_args: Args) {
return <LatencyChart height={300} />;
return (
<LatencyChart height={300} environment={ENVIRONMENT_ALL.value} kuery="" />
);
}
NoData.args = {
alertsResponse: { alerts: [] },

6
x-pack/plugins/apm/public/components/shared/charts/transaction_breakdown_chart/index.tsx
View file

@ -15,11 +15,15 @@ import { BreakdownChart } from '../breakdown_chart';
export function TransactionBreakdownChart({
height,
showAnnotations = true,
environment,
kuery,
}: {
height?: number;
showAnnotations?: boolean;
environment: string;
kuery: string;
}) {
const { data, status } = useTransactionBreakdown();
const { data, status } = useTransactionBreakdown({ environment, kuery });
const { annotations } = useAnnotationsContext();
const { timeseries } = data;

10
x-pack/plugins/apm/public/components/shared/charts/transaction_breakdown_chart/use_transaction_breakdown.ts
View file

@ -9,9 +9,15 @@ import { useFetcher } from '../../../../hooks/use_fetcher';
import { useUrlParams } from '../../../../context/url_params_context/use_url_params';
import { useApmServiceContext } from '../../../../context/apm_service/use_apm_service_context';
export function useTransactionBreakdown() {
export function useTransactionBreakdown({
kuery,
environment,
}: {
kuery: string;
environment: string;
}) {
const {
urlParams: { environment, kuery, start, end, transactionName },
urlParams: { start, end, transactionName },
} = useUrlParams();
const { transactionType, serviceName } = useApmServiceContext();

27
x-pack/plugins/apm/public/components/shared/charts/transaction_charts/index.tsx
View file

@ -14,20 +14,29 @@ import { LatencyChart } from '../latency_chart';
import { TransactionBreakdownChart } from '../transaction_breakdown_chart';
import { TransactionErrorRateChart } from '../transaction_error_rate_chart/';
export function TransactionCharts() {
export function TransactionCharts({
kuery,
environment,
}: {
kuery: string;
environment: string;
}) {
return (
<>
<AnnotationsContextProvider>
<AnnotationsContextProvider environment={environment}>
<ChartPointerEventContextProvider>
<EuiFlexGrid columns={2} gutterSize="s">
<EuiFlexItem data-cy={`transaction-duration-charts`}>
<EuiPanel hasBorder={true}>
<LatencyChart />
<LatencyChart kuery={kuery} environment={environment} />
</EuiPanel>
</EuiFlexItem>
<EuiFlexItem style={{ flexShrink: 1 }}>
<ServiceOverviewThroughputChart />
<ServiceOverviewThroughputChart
environment={environment}
kuery={kuery}
/>
</EuiFlexItem>
</EuiFlexGrid>
@ -35,10 +44,16 @@ export function TransactionCharts() {
<EuiFlexGrid columns={2} gutterSize="s">
<EuiFlexItem>
<TransactionErrorRateChart />
<TransactionErrorRateChart
kuery={kuery}
environment={environment}
/>
</EuiFlexItem>
<EuiFlexItem>
<TransactionBreakdownChart />
<TransactionBreakdownChart
kuery={kuery}
environment={environment}
/>
</EuiFlexItem>
</EuiFlexGrid>
</ChartPointerEventContextProvider>

6
x-pack/plugins/apm/public/components/shared/charts/transaction_error_rate_chart/index.tsx
View file

@ -29,6 +29,8 @@ function yLabelFormat(y?: number | null) {
interface Props {
height?: number;
showAnnotations?: boolean;
kuery: string;
environment: string;
}
type ErrorRate = APIReturnType<'GET /api/apm/services/{serviceName}/transactions/charts/error_rate'>;
@ -49,12 +51,12 @@ const INITIAL_STATE: ErrorRate = {
export function TransactionErrorRateChart({
height,
showAnnotations = true,
environment,
kuery,
}: Props) {
const theme = useTheme();
const {
urlParams: {
environment,
kuery,
start,
end,
transactionName,

5
x-pack/plugins/apm/public/components/shared/kuery_bar/get_bool_filter.ts
View file

@ -13,6 +13,7 @@ import {
TRANSACTION_NAME,
TRANSACTION_TYPE,
} from '../../../../common/elasticsearch_fieldnames';
import { ENVIRONMENT_ALL } from '../../../../common/environment_filter_values';
import { UIProcessorEvent } from '../../../../common/processor_event';
import { environmentQuery } from '../../../../common/utils/environment_query';
import { IUrlParams } from '../../../context/url_params_context/types';
@ -21,11 +22,13 @@ export function getBoolFilter({
groupId,
processorEvent,
serviceName,
environment,
urlParams,
}: {
groupId?: string;
processorEvent?: UIProcessorEvent;
serviceName?: string;
environment?: string;
urlParams: IUrlParams;
}) {
const boolFilter: ESFilter[] = [];
@ -36,7 +39,7 @@ export function getBoolFilter({
});
}
boolFilter.push(...environmentQuery(urlParams.environment));
boolFilter.push(...environmentQuery(environment ?? ENVIRONMENT_ALL.value));
if (urlParams.transactionType) {
boolFilter.push({

9
x-pack/plugins/apm/public/components/shared/kuery_bar/index.tsx
View file

@ -35,10 +35,12 @@ function convertKueryToEsQuery(kuery: string, indexPattern: IndexPattern) {
}
export function KueryBar(props: { prepend?: React.ReactNode | string }) {
const { path } = useApmParams('/*');
const { path, query } = useApmParams('/*');
const serviceName = 'serviceName' in path ? path.serviceName : undefined;
const groupId = 'groupId' in path ? path.groupId : undefined;
const environment = 'environment' in query ? query.environment : undefined;
const kuery = 'kuery' in query ? query.kuery : undefined;
const history = useHistory();
const [state, setState] = useState<State>({
@ -97,6 +99,7 @@ export function KueryBar(props: { prepend?: React.ReactNode | string }) {
groupId,
processorEvent,
serviceName,
environment,
urlParams,
}),
query: inputValue,
@ -137,7 +140,7 @@ export function KueryBar(props: { prepend?: React.ReactNode | string }) {
...location,
search: fromQuery({
...toQuery(location.search),
kuery: encodeURIComponent(inputValue.trim()),
kuery: inputValue.trim(),
}),
});
} catch (e) {
@ -148,7 +151,7 @@ export function KueryBar(props: { prepend?: React.ReactNode | string }) {
return (
<Typeahead
isLoading={state.isLoadingSuggestions}
initialValue={urlParams.kuery}
initialValue={kuery}
onChange={onChange}
onSubmit={onSubmit}
suggestions={state.suggestions}

2
x-pack/plugins/apm/public/components/shared/kuery_bar/utils.ts
View file

@ -23,6 +23,6 @@ export function pushNewItemToKueryBar({
const newItem = `${key} :"${value}"`;
const nextKuery = isEmpty(kuery) ? newItem : `${kuery} and ${newItem}`;
push(history, {
query: { kuery: encodeURIComponent(nextKuery) },
query: { kuery: nextKuery },
});
}

6
x-pack/plugins/apm/public/components/shared/transactions_table/index.tsx
View file

@ -59,12 +59,16 @@ interface Props {
hideViewTransactionsLink?: boolean;
numberOfTransactionsPerPage?: number;
showAggregationAccurateCallout?: boolean;
environment: string;
kuery: string;
}
export function TransactionsTable({
hideViewTransactionsLink = false,
numberOfTransactionsPerPage = 5,
showAggregationAccurateCallout = false,
environment,
kuery,
}: Props) {
const [tableOptions, setTableOptions] = useState<{
pageIndex: number;
@ -88,8 +92,6 @@ export function TransactionsTable({
latencyAggregationType,
comparisonType,
comparisonEnabled,
environment,
kuery,
},
} = useUrlParams();

11
x-pack/plugins/apm/public/context/annotations/annotations_context.tsx
View file

@ -7,7 +7,6 @@
import React, { createContext } from 'react';
import { Annotation } from '../../../common/annotations';
import { useApmParams } from '../../hooks/use_apm_params';
import { useFetcher } from '../../hooks/use_fetcher';
import { useUrlParams } from '../url_params_context/use_url_params';
@ -19,15 +18,15 @@ const INITIAL_STATE = { annotations: [] };
export function AnnotationsContextProvider({
children,
environment,
serviceName,
}: {
children: React.ReactNode;
environment: string;
serviceName?: string;
}) {
const { path } = useApmParams('/*');
const serviceName = 'serviceName' in path ? path.serviceName : undefined;
const {
urlParams: { environment, start, end },
urlParams: { start, end },
} = useUrlParams();
const { data = INITIAL_STATE } = useFetcher(

7
x-pack/plugins/apm/public/context/apm_service/apm_service_context.tsx
View file

@ -50,7 +50,12 @@ export function ApmServiceContextProvider({
agentName,
});
const { alerts } = useServiceAlertsFetcher({ serviceName, transactionType });
const { alerts } = useServiceAlertsFetcher({
serviceName,
transactionType,
environment: query.environment,
kuery: query.kuery,
});
return (
<APMServiceContext.Provider

6
x-pack/plugins/apm/public/context/apm_service/use_service_alerts_fetcher.tsx
View file

@ -13,16 +13,20 @@ import type { APMServiceAlert } from './apm_service_context';
export function useServiceAlertsFetcher({
serviceName,
transactionType,
environment,
kuery,
}: {
serviceName?: string;
transactionType?: string;
environment: string;
kuery: string;
}) {
const {
plugins: { observability },
} = useApmPluginContext();
const {
urlParams: { start, end, environment },
urlParams: { start, end },
} = useUrlParams();
const experimentalAlertsEnabled = observability.isAlertingExperienceEnabled();

8
x-pack/plugins/apm/public/hooks/use_apm_params.ts
View file

@ -5,21 +5,21 @@
* 2.0.
*/
import { OutputOf, PathsOf, useParams } from '@kbn/typed-react-router-config';
import { TypeOf, PathsOf, useParams } from '@kbn/typed-react-router-config';
import { ApmRoutes } from '../components/routing/apm_route_config';
export function useApmParams<TPath extends PathsOf<ApmRoutes>>(
path: TPath,
optional: true
): OutputOf<ApmRoutes, TPath> | undefined;
): TypeOf<ApmRoutes, TPath> | undefined;
export function useApmParams<TPath extends PathsOf<ApmRoutes>>(
path: TPath
): OutputOf<ApmRoutes, TPath>;
): TypeOf<ApmRoutes, TPath>;
export function useApmParams(
path: string,
optional?: true
): OutputOf<ApmRoutes, PathsOf<ApmRoutes>> | undefined {
): TypeOf<ApmRoutes, PathsOf<ApmRoutes>> | undefined {
return useParams(path, optional);
}

6
x-pack/plugins/apm/public/hooks/use_error_group_distribution_fetcher.tsx
View file

@ -11,12 +11,16 @@ import { useFetcher } from './use_fetcher';
export function useErrorGroupDistributionFetcher({
serviceName,
groupId,
kuery,
environment,
}: {
serviceName: string;
groupId: string | undefined;
kuery: string;
environment: string;
}) {
const {
urlParams: { environment, kuery, start, end },
urlParams: { start, end },
} = useUrlParams();
const { data } = useFetcher(
(callApmApi) => {

4
x-pack/plugins/apm/public/hooks/use_fallback_to_transactions_fetcher.tsx
View file

@ -8,9 +8,9 @@
import { useUrlParams } from '../context/url_params_context/use_url_params';
import { useFetcher } from './use_fetcher';
export function useFallbackToTransactionsFetcher() {
export function useFallbackToTransactionsFetcher({ kuery }: { kuery: string }) {
const {
urlParams: { kuery, start, end },
urlParams: { start, end },
} = useUrlParams();
const { data = { fallbackToTransactions: false } } = useFetcher(
(callApmApi) => {

6
x-pack/plugins/apm/public/hooks/use_service_metric_charts_fetcher.ts
View file

@ -17,11 +17,15 @@ const INITIAL_DATA: MetricsChartsByAgentAPIResponse = {
export function useServiceMetricChartsFetcher({
serviceNodeName,
kuery,
environment,
}: {
serviceNodeName: string | undefined;
kuery: string;
environment: string;
}) {
const {
urlParams: { environment, kuery, start, end },
urlParams: { start, end },
} = useUrlParams();
const { agentName, serviceName } = useApmServiceContext();

6
x-pack/plugins/apm/public/hooks/use_transaction_distribution_fetcher.ts
View file

@ -24,13 +24,17 @@ const INITIAL_DATA = {
export function useTransactionDistributionFetcher({
transactionName,
kuery,
environment,
}: {
transactionName: string;
kuery: string;
environment: string;
}) {
const { serviceName, transactionType } = useApmServiceContext();
const {
urlParams: { environment, kuery, start, end, transactionId, traceId },
urlParams: { start, end, transactionId, traceId },
} = useUrlParams();
const history = useHistory();

10
x-pack/plugins/apm/public/hooks/use_transaction_latency_chart_fetcher.ts
View file

@ -13,13 +13,17 @@ import { getLatencyChartSelector } from '../selectors/latency_chart_selectors';
import { useTheme } from './use_theme';
import { getTimeRangeComparison } from '../components/shared/time_comparison/get_time_range_comparison';
export function useTransactionLatencyChartsFetcher() {
export function useTransactionLatencyChartsFetcher({
kuery,
environment,
}: {
kuery: string;
environment: string;
}) {
const { transactionType, serviceName } = useApmServiceContext();
const theme = useTheme();
const {
urlParams: {
environment,
kuery,
start,
end,
transactionName,

1
x-pack/plugins/apm/scripts/optimize-tsconfig/optimize.js
View file

@ -38,6 +38,7 @@ async function prepareBaseTsConfig() {
compilerOptions: {
...config.compilerOptions,
incremental: false,
composite: false,
},
include: [],
},

4
x-pack/plugins/apm/server/lib/backends/get_error_rate_charts_for_backend.ts
View file

@ -30,8 +30,8 @@ export async function getErrorRateChartsForBackend({
setup: Setup;
start: number;
end: number;
environment?: string;
kuery?: string;
environment: string;
kuery: string;
offset?: string;
}) {
const { apmEventClient } = setup;

4
x-pack/plugins/apm/server/lib/backends/get_latency_charts_for_backend.ts
View file

@ -30,8 +30,8 @@ export async function getLatencyChartsForBackend({
setup: Setup;
start: number;
end: number;
environment?: string;
kuery?: string;
environment: string;
kuery: string;
offset?: string;
}) {
const { apmEventClient } = setup;

4
x-pack/plugins/apm/server/lib/backends/get_throughput_charts_for_backend.ts
View file

@ -29,8 +29,8 @@ export async function getThroughputChartsForBackend({
setup: Setup;
start: number;
end: number;
environment?: string;
kuery?: string;
environment: string;
kuery: string;
offset?: string;
}) {
const { apmEventClient } = setup;

4
x-pack/plugins/apm/server/lib/backends/get_top_backends.ts
View file

@ -25,9 +25,9 @@ export async function getTopBackends({
start: number;
end: number;
numBuckets: number;
environment?: string;
environment: string;
offset?: string;
kuery?: string;
kuery: string;
}) {
const statsItems = await getConnectionStats({
setup,

4
x-pack/plugins/apm/server/lib/backends/get_upstream_services_for_backend.ts
View file

@ -27,8 +27,8 @@ export async function getUpstreamServicesForBackend({
end: number;
backendName: string;
numBuckets: number;
kuery?: string;
environment?: string;
kuery: string;
environment: string;
offset?: string;
}) {
const statsItems = await getConnectionStats({

4
x-pack/plugins/apm/server/lib/correlations/get_filters.ts
View file

@ -19,8 +19,8 @@ import { ProcessorEvent } from '../../../common/processor_event';
export interface CorrelationsOptions {
setup: Setup & SetupTimeRange;
environment?: string;
kuery?: string;
environment: string;
kuery: string;
serviceName: string | undefined;
transactionType: string | undefined;
transactionName: string | undefined;

1
x-pack/plugins/apm/server/lib/errors/distribution/get_buckets.test.ts
View file

@ -28,6 +28,7 @@ describe('get buckets', () => {
environment: 'prod',
serviceName: 'myServiceName',
bucketSize: 10,
kuery: '',
setup: {
start: 1528113600000,
end: 1528977600000,

4
x-pack/plugins/apm/server/lib/errors/distribution/get_buckets.ts
View file

@ -23,8 +23,8 @@ export async function getBuckets({
bucketSize,
setup,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
serviceName: string;
groupId?: string;
bucketSize: number;

4
x-pack/plugins/apm/server/lib/errors/distribution/get_distribution.ts
View file

@ -20,8 +20,8 @@ export async function getErrorDistribution({
groupId,
setup,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
serviceName: string;
groupId?: string;
setup: Setup & SetupTimeRange;

5
x-pack/plugins/apm/server/lib/errors/distribution/queries.test.ts
View file

@ -10,6 +10,7 @@ import {
SearchParamsMock,
inspectSearchParams,
} from '../../../utils/test_helpers';
import { ENVIRONMENT_ALL } from '../../../../common/environment_filter_values';
describe('error distribution queries', () => {
let mock: SearchParamsMock;
@ -23,6 +24,8 @@ describe('error distribution queries', () => {
getErrorDistribution({
serviceName: 'serviceName',
setup,
environment: ENVIRONMENT_ALL.value,
kuery: '',
})
);
@ -35,6 +38,8 @@ describe('error distribution queries', () => {
serviceName: 'serviceName',
groupId: 'foo',
setup,
environment: ENVIRONMENT_ALL.value,
kuery: '',
})
);

4
x-pack/plugins/apm/server/lib/errors/get_error_group_sample.ts
View file

@ -24,8 +24,8 @@ export async function getErrorGroupSample({
groupId,
setup,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
serviceName: string;
groupId: string;
setup: Setup & SetupTimeRange;

4
x-pack/plugins/apm/server/lib/errors/get_error_groups.ts
View file

@ -26,8 +26,8 @@ export async function getErrorGroups({
sortDirection = 'desc',
setup,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
serviceName: string;
sortField?: string;
sortDirection?: 'asc' | 'desc';

7
x-pack/plugins/apm/server/lib/errors/queries.test.ts
View file

@ -11,6 +11,7 @@ import {
SearchParamsMock,
inspectSearchParams,
} from '../../utils/test_helpers';
import { ENVIRONMENT_ALL } from '../../../common/environment_filter_values';
describe('error queries', () => {
let mock: SearchParamsMock;
@ -25,6 +26,8 @@ describe('error queries', () => {
groupId: 'groupId',
serviceName: 'serviceName',
setup,
environment: ENVIRONMENT_ALL.value,
kuery: '',
})
);
@ -38,6 +41,8 @@ describe('error queries', () => {
sortField: 'foo',
serviceName: 'serviceName',
setup,
environment: ENVIRONMENT_ALL.value,
kuery: '',
})
);
@ -51,6 +56,8 @@ describe('error queries', () => {
sortField: 'latestOccurrenceAt',
serviceName: 'serviceName',
setup,
environment: ENVIRONMENT_ALL.value,
kuery: '',
})
);

2
x-pack/plugins/apm/server/lib/helpers/aggregated_transactions/get_fallback_to_transactions.ts
View file

@ -14,7 +14,7 @@ export async function getFallbackToTransactions({
kuery,
}: {
setup: Setup & Partial<SetupTimeRange>;
kuery?: string;
kuery: string;
}): Promise<boolean> {
const searchAggregatedTransactions =
config['xpack.apm.searchAggregatedTransactions'];

4
x-pack/plugins/apm/server/lib/helpers/aggregated_transactions/index.ts
View file

@ -24,7 +24,7 @@ export async function getHasAggregatedTransactions({
start?: number;
end?: number;
apmEventClient: APMEventClient;
kuery?: string;
kuery: string;
}) {
const response = await apmEventClient.search(
'get_has_aggregated_transactions',
@ -65,7 +65,7 @@ export async function getSearchAggregatedTransactions({
start?: number;
end?: number;
apmEventClient: APMEventClient;
kuery?: string;
kuery: string;
}): Promise<boolean> {
const searchAggregatedTransactions =
config['xpack.apm.searchAggregatedTransactions'];

4
x-pack/plugins/apm/server/lib/metrics/by_agent/default.ts
View file

@ -15,8 +15,8 @@ export async function getDefaultMetricsCharts({
serviceName,
setup,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
serviceName: string;
setup: Setup & SetupTimeRange;
}) {

4
x-pack/plugins/apm/server/lib/metrics/by_agent/java/gc/fetch_and_transform_gc_metrics.ts
View file

@ -33,8 +33,8 @@ export async function fetchAndTransformGcMetrics({
fieldName,
operationName,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
setup: Setup & SetupTimeRange;
serviceName: string;
serviceNodeName?: string;

4
x-pack/plugins/apm/server/lib/metrics/by_agent/java/gc/get_gc_rate_chart.ts
View file

@ -38,8 +38,8 @@ function getGcRateChart({
serviceName,
serviceNodeName,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
setup: Setup & SetupTimeRange;
serviceName: string;
serviceNodeName?: string;

4
x-pack/plugins/apm/server/lib/metrics/by_agent/java/gc/get_gc_time_chart.ts
View file

@ -38,8 +38,8 @@ function getGcTimeChart({
serviceName,
serviceNodeName,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
setup: Setup & SetupTimeRange;
serviceName: string;
serviceNodeName?: string;

4
x-pack/plugins/apm/server/lib/metrics/by_agent/java/heap_memory/index.ts
View file

@ -59,8 +59,8 @@ export function getHeapMemoryChart({
serviceName,
serviceNodeName,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
setup: Setup & SetupTimeRange;
serviceName: string;
serviceNodeName?: string;

4
x-pack/plugins/apm/server/lib/metrics/by_agent/java/index.ts
View file

@ -22,8 +22,8 @@ export function getJavaMetricsCharts({
serviceName,
serviceNodeName,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
setup: Setup & SetupTimeRange;
serviceName: string;
serviceNodeName?: string;

4
x-pack/plugins/apm/server/lib/metrics/by_agent/java/non_heap_memory/index.ts
View file

@ -56,8 +56,8 @@ export async function getNonHeapMemoryChart({
serviceName,
serviceNodeName,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
setup: Setup & SetupTimeRange;
serviceName: string;
serviceNodeName?: string;

4
x-pack/plugins/apm/server/lib/metrics/by_agent/java/thread_count/index.ts
View file

@ -48,8 +48,8 @@ export async function getThreadCountChart({
serviceName,
serviceNodeName,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
setup: Setup & SetupTimeRange;
serviceName: string;
serviceNodeName?: string;

4
x-pack/plugins/apm/server/lib/metrics/by_agent/shared/cpu/index.ts
View file

@ -59,8 +59,8 @@ export function getCPUChartData({
serviceName,
serviceNodeName,
}: {
environment?: string;
kuery?: string;
environment: string;
kuery: string;
setup: Setup & SetupTimeRange;
serviceName: string;
serviceNodeName?: string;

Some files were not shown because too many files have changed in this diff Show more