github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 17:59:23 -04:00
Code Issues Projects Releases Packages Wiki Activity

[APM] Use full path in route definition (#111501)

Browse source
This commit is contained in:
Dario Gieselaar 2021-09-09 08:30:26 +02:00 • committed by GitHub
parent b324ca3115
commit 96bffbfaf8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
62 changed files with 304 additions and 222 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -43,17 +43,23 @@ describe('createRouter', () => {
}),
},
{
path: '/services/:serviceName',
path: '/services',
element: <></>,
params: t.type({
path: t.type({
serviceName: t.string,
}),
query: t.type({
transactionType: t.string,
environment: t.string,
}),
}),
children: [
{
element: <></>,
path: '/services/{serviceName}',
params: t.type({
path: t.type({
serviceName: t.string,
}),
query: t.type({
transactionType: t.string,
environment: t.string,
}),
}),
},
],
},
{
path: '/traces',
@ -131,7 +137,7 @@ describe('createRouter', () => {
'/services/opbeans-java?rangeFrom=now-15m&rangeTo=now&environment=production&transactionType=request'
);
const serviceOverviewParams = router.getParams('/services/:serviceName', history.location);
const serviceOverviewParams = router.getParams('/services/{serviceName}', history.location);
expect(serviceOverviewParams).toEqual({
path: {
@ -250,7 +256,7 @@ describe('createRouter', () => {
describe('link', () => {
it('returns a link for the given route', () => {
const serviceOverviewLink = router.link('/services/:serviceName', {
const serviceOverviewLink = router.link('/services/{serviceName}', {
path: { serviceName: 'opbeans-java' },
query: {
rangeFrom: 'now-15m',

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

@ -25,22 +25,24 @@ import { Route, Router } from './types';
const deepExactRt: typeof deepExactRtTyped = deepExactRtNonTyped;
const mergeRt: typeof mergeRtTyped = mergeRtNonTyped;
function toReactRouterPath(path: string) {
return path.replace(/(?:{([^\/]+)})/, ':$1');
}
export function createRouter<TRoutes extends Route[]>(routes: TRoutes): Router<TRoutes> {
const routesByReactRouterConfig = new Map<ReactRouterConfig, Route>();
const reactRouterConfigsByRoute = new Map<Route, ReactRouterConfig>();
const reactRouterConfigs = routes.map((route) => toReactRouterConfigRoute(route));
function toReactRouterConfigRoute(route: Route, prefix: string = ''): ReactRouterConfig {
const path = `${prefix}${route.path}`.replace(/\/{2,}/g, '/').replace(/\/$/, '') || '/';
function toReactRouterConfigRoute(route: Route): ReactRouterConfig {
const reactRouterConfig: ReactRouterConfig = {
component: () => route.element,
routes:
(route.children as Route[] | undefined)?.map((child) =>
toReactRouterConfigRoute(child, path)
) ?? [],
(route.children as Route[] | undefined)?.map((child) => toReactRouterConfigRoute(child)) ??
[],
exact: !route.children?.length,
path,
path: toReactRouterPath(route.path),
};
routesByReactRouterConfig.set(reactRouterConfig, route);
@ -71,11 +73,11 @@ export function createRouter<TRoutes extends Route[]>(routes: TRoutes): Router<T
for (const path of paths) {
const greedy = path.endsWith('/*') || args.length === 0;
matches = matchRoutesConfig(reactRouterConfigs, location.pathname);
matches = matchRoutesConfig(reactRouterConfigs, toReactRouterPath(location.pathname));
matchIndex = greedy
? matches.length - 1
: findLastIndex(matches, (match) => match.route.path === path);
: findLastIndex(matches, (match) => match.route.path === toReactRouterPath(path));
if (matchIndex !== -1) {
break;
@ -135,11 +137,12 @@ export function createRouter<TRoutes extends Route[]>(routes: TRoutes): Router<T
path = path
.split('/')
.map((part) => {
return part.startsWith(':') ? paramsWithBuiltInDefaults.path[part.split(':')[1]] : part;
const match = part.match(/(?:{([a-zA-Z]+)})/);
return match ? paramsWithBuiltInDefaults.path[match[1]] : part;
})
.join('/');
const matches = matchRoutesConfig(reactRouterConfigs, path);
const matches = matchRoutesConfig(reactRouterConfigs, toReactRouterPath(path));
if (!matches.length) {
throw new Error(`No matching route found for ${path}`);

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

@ -13,7 +13,97 @@ import { RequiredKeys, ValuesType } from 'utility-types';
// import { unconst } from '../unconst';
import { NormalizePath } from './utils';
export type PathsOf<TRoutes extends Route[]> = keyof MapRoutes<TRoutes> & string;
type PathsOfRoute<TRoute extends Route> =
| TRoute['path']
| (TRoute extends { children: Route[] }
? AppendPath<TRoute['path'], '/*'> | PathsOf<TRoute['children']>
: never);
export type PathsOf<TRoutes extends Route[]> = TRoutes extends []
? never
: TRoutes extends [Route]
? PathsOfRoute<TRoutes[0]>
: TRoutes extends [Route, Route]
? PathsOfRoute<TRoutes[0]> | PathsOfRoute<TRoutes[1]>
: TRoutes extends [Route, Route, Route]
? PathsOfRoute<TRoutes[0]> | PathsOfRoute<TRoutes[1]> | PathsOfRoute<TRoutes[2]>
: TRoutes extends [Route, Route, Route, Route]
?
| PathsOfRoute<TRoutes[0]>
| PathsOfRoute<TRoutes[1]>
| PathsOfRoute<TRoutes[2]>
| PathsOfRoute<TRoutes[3]>
: TRoutes extends [Route, Route, Route, Route, Route]
?
| PathsOfRoute<TRoutes[0]>
| PathsOfRoute<TRoutes[1]>
| PathsOfRoute<TRoutes[2]>
| PathsOfRoute<TRoutes[3]>
| PathsOfRoute<TRoutes[4]>
: TRoutes extends [Route, Route, Route, Route, Route, Route]
?
| PathsOfRoute<TRoutes[0]>
| PathsOfRoute<TRoutes[1]>
| PathsOfRoute<TRoutes[2]>
| PathsOfRoute<TRoutes[3]>
| PathsOfRoute<TRoutes[4]>
| PathsOfRoute<TRoutes[5]>
: TRoutes extends [Route, Route, Route, Route, Route, Route, Route]
?
| PathsOfRoute<TRoutes[0]>
| PathsOfRoute<TRoutes[1]>
| PathsOfRoute<TRoutes[2]>
| PathsOfRoute<TRoutes[3]>
| PathsOfRoute<TRoutes[4]>
| PathsOfRoute<TRoutes[5]>
| PathsOfRoute<TRoutes[6]>
: TRoutes extends [Route, Route, Route, Route, Route, Route, Route, Route]
?
| PathsOfRoute<TRoutes[0]>
| PathsOfRoute<TRoutes[1]>
| PathsOfRoute<TRoutes[2]>
| PathsOfRoute<TRoutes[3]>
| PathsOfRoute<TRoutes[4]>
| PathsOfRoute<TRoutes[5]>
| PathsOfRoute<TRoutes[6]>
| PathsOfRoute<TRoutes[7]>
: TRoutes extends [Route, Route, Route, Route, Route, Route, Route, Route, Route]
?
| PathsOfRoute<TRoutes[0]>
| PathsOfRoute<TRoutes[1]>
| PathsOfRoute<TRoutes[2]>
| PathsOfRoute<TRoutes[3]>
| PathsOfRoute<TRoutes[4]>
| PathsOfRoute<TRoutes[5]>
| PathsOfRoute<TRoutes[6]>
| PathsOfRoute<TRoutes[7]>
| PathsOfRoute<TRoutes[8]>
: TRoutes extends [Route, Route, Route, Route, Route, Route, Route, Route, Route, Route]
?
| PathsOfRoute<TRoutes[0]>
| PathsOfRoute<TRoutes[1]>
| PathsOfRoute<TRoutes[2]>
| PathsOfRoute<TRoutes[3]>
| PathsOfRoute<TRoutes[4]>
| PathsOfRoute<TRoutes[5]>
| PathsOfRoute<TRoutes[6]>
| PathsOfRoute<TRoutes[7]>
| PathsOfRoute<TRoutes[8]>
| PathsOfRoute<TRoutes[9]>
: TRoutes extends [Route, Route, Route, Route, Route, Route, Route, Route, Route, Route, Route]
?
| PathsOfRoute<TRoutes[0]>
| PathsOfRoute<TRoutes[1]>
| PathsOfRoute<TRoutes[2]>
| PathsOfRoute<TRoutes[3]>
| PathsOfRoute<TRoutes[4]>
| PathsOfRoute<TRoutes[5]>
| PathsOfRoute<TRoutes[6]>
| PathsOfRoute<TRoutes[7]>
| PathsOfRoute<TRoutes[8]>
| PathsOfRoute<TRoutes[9]>
| PathsOfRoute<TRoutes[10]>
: string;
export interface RouteMatch<TRoute extends Route = Route> {
route: TRoute;
@ -167,29 +257,17 @@ type MaybeUnion<T extends Record<string, any>, U extends Record<string, any>> =
[key in keyof U]: key extends keyof T ? T[key] | U[key] : U[key];
};
type MapRoute<
TRoute extends Route,
TPrefix extends string,
TParents extends Route[] = []
> = TRoute extends Route
type MapRoute<TRoute extends Route, TParents extends Route[] = []> = TRoute extends Route
? MaybeUnion<
{
[key in AppendPath<TPrefix, TRoute['path']>]: TRoute & { parents: TParents };
[key in TRoute['path']]: TRoute & { parents: TParents };
},
TRoute extends { children: Route[] }
? MaybeUnion<
MapRoutes<
TRoute['children'],
AppendPath<TPrefix, TRoute['path']>,
[...TParents, TRoute]
>,
MapRoutes<TRoute['children'], [...TParents, TRoute]>,
{
[key in AppendPath<TPrefix, AppendPath<TRoute['path'], '*'>>]: ValuesType<
MapRoutes<
TRoute['children'],
AppendPath<TPrefix, TRoute['path']>,
[...TParents, TRoute]
>
[key in AppendPath<TRoute['path'], '*'>]: ValuesType<
MapRoutes<TRoute['children'], [...TParents, TRoute]>
>;
}
>
@ -197,74 +275,68 @@ type MapRoute<
>
: {};
type MapRoutes<
TRoutes,
TPrefix extends string = '',
TParents extends Route[] = []
> = TRoutes extends [Route]
? MapRoute<TRoutes[0], TPrefix, TParents>
type MapRoutes<TRoutes, TParents extends Route[] = []> = TRoutes extends [Route]
? MapRoute<TRoutes[0], TParents>
: TRoutes extends [Route, Route]
? MapRoute<TRoutes[0], TPrefix, TParents> & MapRoute<TRoutes[1], TPrefix, TParents>
? MapRoute<TRoutes[0], TParents> & MapRoute<TRoutes[1], TParents>
: TRoutes extends [Route, Route, Route]
? MapRoute<TRoutes[0], TPrefix, TParents> &
MapRoute<TRoutes[1], TPrefix, TParents> &
MapRoute<TRoutes[2], TPrefix, TParents>
? MapRoute<TRoutes[0], TParents> & MapRoute<TRoutes[1], TParents> & MapRoute<TRoutes[2], TParents>
: TRoutes extends [Route, Route, Route, Route]
? MapRoute<TRoutes[0], TPrefix, TParents> &
MapRoute<TRoutes[1], TPrefix, TParents> &
MapRoute<TRoutes[2], TPrefix, TParents> &
MapRoute<TRoutes[3], TPrefix, TParents>
? MapRoute<TRoutes[0], TParents> &
MapRoute<TRoutes[1], TParents> &
MapRoute<TRoutes[2], TParents> &
MapRoute<TRoutes[3], TParents>
: TRoutes extends [Route, Route, Route, Route, Route]
? MapRoute<TRoutes[0], TPrefix, TParents> &
MapRoute<TRoutes[1], TPrefix, TParents> &
MapRoute<TRoutes[2], TPrefix, TParents> &
MapRoute<TRoutes[3], TPrefix, TParents> &
MapRoute<TRoutes[4], TPrefix, TParents>
? MapRoute<TRoutes[0], TParents> &
MapRoute<TRoutes[1], TParents> &
MapRoute<TRoutes[2], TParents> &
MapRoute<TRoutes[3], TParents> &
MapRoute<TRoutes[4], TParents>
: TRoutes extends [Route, Route, Route, Route, Route, Route]
? MapRoute<TRoutes[0], TPrefix, TParents> &
MapRoute<TRoutes[1], TPrefix, TParents> &
MapRoute<TRoutes[2], TPrefix, TParents> &
MapRoute<TRoutes[3], TPrefix, TParents> &
MapRoute<TRoutes[4], TPrefix, TParents> &
MapRoute<TRoutes[5], TPrefix, TParents>
? MapRoute<TRoutes[0], TParents> &
MapRoute<TRoutes[1], TParents> &
MapRoute<TRoutes[2], TParents> &
MapRoute<TRoutes[3], TParents> &
MapRoute<TRoutes[4], TParents> &
MapRoute<TRoutes[5], TParents>
: TRoutes extends [Route, Route, Route, Route, Route, Route, Route]
? MapRoute<TRoutes[0], TPrefix, TParents> &
MapRoute<TRoutes[1], TPrefix, TParents> &
MapRoute<TRoutes[2], TPrefix, TParents> &
MapRoute<TRoutes[3], TPrefix, TParents> &
MapRoute<TRoutes[4], TPrefix, TParents> &
MapRoute<TRoutes[5], TPrefix, TParents> &
MapRoute<TRoutes[6], TPrefix, TParents>
? MapRoute<TRoutes[0], TParents> &
MapRoute<TRoutes[1], TParents> &
MapRoute<TRoutes[2], TParents> &
MapRoute<TRoutes[3], TParents> &
MapRoute<TRoutes[4], TParents> &
MapRoute<TRoutes[5], TParents> &
MapRoute<TRoutes[6], TParents>
: TRoutes extends [Route, Route, Route, Route, Route, Route, Route, Route]
? MapRoute<TRoutes[0], TPrefix, TParents> &
MapRoute<TRoutes[1], TPrefix, TParents> &
MapRoute<TRoutes[2], TPrefix, TParents> &
MapRoute<TRoutes[3], TPrefix, TParents> &
MapRoute<TRoutes[4], TPrefix, TParents> &
MapRoute<TRoutes[5], TPrefix, TParents> &
MapRoute<TRoutes[6], TPrefix, TParents> &
MapRoute<TRoutes[7], TPrefix, TParents>
? MapRoute<TRoutes[0], TParents> &
MapRoute<TRoutes[1], TParents> &
MapRoute<TRoutes[2], TParents> &
MapRoute<TRoutes[3], TParents> &
MapRoute<TRoutes[4], TParents> &
MapRoute<TRoutes[5], TParents> &
MapRoute<TRoutes[6], TParents> &
MapRoute<TRoutes[7], TParents>
: TRoutes extends [Route, Route, Route, Route, Route, Route, Route, Route, Route]
? MapRoute<TRoutes[0], TPrefix, TParents> &
MapRoute<TRoutes[1], TPrefix, TParents> &
MapRoute<TRoutes[2], TPrefix, TParents> &
MapRoute<TRoutes[3], TPrefix, TParents> &
MapRoute<TRoutes[4], TPrefix, TParents> &
MapRoute<TRoutes[5], TPrefix, TParents> &
MapRoute<TRoutes[6], TPrefix, TParents> &
MapRoute<TRoutes[7], TPrefix, TParents> &
MapRoute<TRoutes[8], TPrefix, TParents>
? MapRoute<TRoutes[0], TParents> &
MapRoute<TRoutes[1], TParents> &
MapRoute<TRoutes[2], TParents> &
MapRoute<TRoutes[3], TParents> &
MapRoute<TRoutes[4], TParents> &
MapRoute<TRoutes[5], TParents> &
MapRoute<TRoutes[6], TParents> &
MapRoute<TRoutes[7], TParents> &
MapRoute<TRoutes[8], TParents>
: TRoutes extends [Route, Route, Route, Route, Route, Route, Route, Route, Route, Route]
? MapRoute<TRoutes[0], TPrefix, TParents> &
MapRoute<TRoutes[1], TPrefix, TParents> &
MapRoute<TRoutes[2], TPrefix, TParents> &
MapRoute<TRoutes[3], TPrefix, TParents> &
MapRoute<TRoutes[4], TPrefix, TParents> &
MapRoute<TRoutes[5], TPrefix, TParents> &
MapRoute<TRoutes[6], TPrefix, TParents> &
MapRoute<TRoutes[7], TPrefix, TParents> &
MapRoute<TRoutes[8], TPrefix, TParents> &
MapRoute<TRoutes[9], TPrefix, TParents>
? MapRoute<TRoutes[0], TParents> &
MapRoute<TRoutes[1], TParents> &
MapRoute<TRoutes[2], TParents> &
MapRoute<TRoutes[3], TParents> &
MapRoute<TRoutes[4], TParents> &
MapRoute<TRoutes[5], TParents> &
MapRoute<TRoutes[6], TParents> &
MapRoute<TRoutes[8], TParents> &
MapRoute<TRoutes[7], TParents> &
MapRoute<TRoutes[9], TParents>
: {};
// const element = null as any;
@ -279,11 +351,11 @@ type MapRoutes<
// element,
// children: [
// {
// path: '/agent-configuration',
// path: '/settings/agent-configuration',
// element,
// },
// {
// path: '/agent-configuration/create',
// path: '/settings/agent-configuration/create',
// element,
// params: t.partial({
// query: t.partial({
@ -292,7 +364,7 @@ type MapRoutes<
// }),
// },
// {
// path: '/agent-configuration/edit',
// path: '/settings/agent-configuration/edit',
// element,
// params: t.partial({
// query: t.partial({
@ -301,23 +373,23 @@ type MapRoutes<
// }),
// },
// {
// path: '/apm-indices',
// path: '/settings/apm-indices',
// element,
// },
// {
// path: '/customize-ui',
// path: '/settings/customize-ui',
// element,
// },
// {
// path: '/schema',
// path: '/settings/schema',
// element,
// },
// {
// path: '/anomaly-detection',
// path: '/settings/anomaly-detection',
// element,
// },
// {
// path: '/',
// path: '/settings',
// element,
// },
// ],
@ -346,15 +418,15 @@ type MapRoutes<
// ]),
// children: [
// {
// path: '/overview',
// path: '/services/:serviceName/overview',
// element,
// },
// {
// path: '/transactions',
// path: '/services/:serviceName/transactions',
// element,
// },
// {
// path: '/errors',
// path: '/services/:serviceName/errors',
// element,
// children: [
// {
@ -367,7 +439,7 @@ type MapRoutes<
// }),
// },
// {
// path: '/',
// path: '/services/:serviceName',
// element,
// params: t.partial({
// query: t.partial({
@ -381,19 +453,19 @@ type MapRoutes<
// ],
// },
// {
// path: '/foo',
// path: '/services/:serviceName/foo',
// element,
// },
// {
// path: '/bar',
// path: '/services/:serviceName/bar',
// element,
// },
// {
// path: '/baz',
// path: '/services/:serviceName/baz',
// element,
// },
// {
// path: '/',
// path: '/services/:serviceName',
// element,
// },
// ],
@ -436,6 +508,7 @@ type MapRoutes<
// type Bar = ValuesType<Match<Routes, '/*'>>['route']['path'];
// type Foo = OutputOf<Routes, '/*'>;
// type Baz = OutputOf<Routes, '/services/:serviceName/baz'>;
// const { path }: Foo = {} as any;

4
x-pack/plugins/apm/dev_docs/routing_and_linking.md
View file

@ -18,13 +18,13 @@ Routes (and their parameters) are defined in [public/components/routing/apm_conf
#### Parameter handling
Path (like `serviceName` in '/services/:serviceName/transactions') and query parameters are defined in the route definitions.
Path (like `serviceName` in '/services/{serviceName}/transactions') and query parameters are defined in the route definitions.
For each parameter, an io-ts runtime type needs to be present:
```tsx
{
route: '/services/:serviceName',
route: '/services/{serviceName}',
element: <Outlet/>,
params: t.intersection([
t.type({

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

@ -23,7 +23,7 @@ export function TraceLink() {
const {
path: { traceId },
query: { rangeFrom, rangeTo },
} = useApmParams('/link-to/trace/:traceId');
} = useApmParams('/link-to/trace/{traceId}');
const { data = { transaction: null }, status } = useFetcher(
(callApmApi) => {

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

@ -24,7 +24,7 @@ export function BackendDetailDependenciesTable() {
const {
query: { rangeFrom, rangeTo, kuery, environment },
} = useApmParams('/backends/:backendName/overview');
} = useApmParams('/backends/{backendName}/overview');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -31,7 +31,7 @@ export function BackendFailedTransactionRateChart({
const {
query: { kuery, environment, rangeFrom, rangeTo },
} = useApmParams('/backends/:backendName/overview');
} = useApmParams('/backends/{backendName}/overview');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -27,7 +27,7 @@ export function BackendLatencyChart({ height }: { height: number }) {
const {
query: { rangeFrom, rangeTo, kuery, environment },
} = useApmParams('/backends/:backendName/overview');
} = useApmParams('/backends/{backendName}/overview');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -23,7 +23,7 @@ export function BackendThroughputChart({ height }: { height: number }) {
const {
query: { rangeFrom, rangeTo, kuery, environment },
} = useApmParams('/backends/:backendName/overview');
} = useApmParams('/backends/{backendName}/overview');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -33,7 +33,7 @@ export function BackendDetailOverview() {
const {
path: { backendName },
query: { rangeFrom, rangeTo, environment, kuery },
} = useApmParams('/backends/:backendName/overview');
} = useApmParams('/backends/{backendName}/overview');
const apmRouter = useApmRouter();
@ -46,7 +46,7 @@ export function BackendDetailOverview() {
},
{
title: backendName,
href: apmRouter.link('/backends/:backendName/overview', {
href: apmRouter.link('/backends/{backendName}/overview', {
path: { backendName },
query: {
rangeFrom,

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

@ -103,13 +103,13 @@ export function ErrorGroupDetails() {
const {
path: { groupId },
query: { rangeFrom, rangeTo, environment, kuery },
} = useApmParams('/services/:serviceName/errors/:groupId');
} = useApmParams('/services/{serviceName}/errors/{groupId}');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });
useBreadcrumb({
title: groupId,
href: apmRouter.link('/services/:serviceName/errors/:groupId', {
href: apmRouter.link('/services/{serviceName}/errors/{groupId}', {
path: {
serviceName,
groupId,

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

@ -27,7 +27,7 @@ export function ErrorGroupOverview() {
const {
query: { environment, kuery, sortField, sortDirection, rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/errors');
} = useApmParams('/services/{serviceName}/errors');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

2
x-pack/plugins/apm/public/components/app/service_dependencies/service_dependencies_breakdown_chart.tsx
View file

@ -22,7 +22,7 @@ export function ServiceDependenciesBreakdownChart({
const {
query: { kuery, environment, rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/dependencies');
} = useApmParams('/services/{serviceName}/dependencies');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -42,7 +42,7 @@ function useServicesFetcher() {
const {
query: { rangeFrom, rangeTo, environment, kuery },
} = useApmParams('/services/:serviceName', '/services');
} = useApmParams('/services/{serviceName}', '/services');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -27,7 +27,7 @@ export function ServiceLogs() {
const {
query: { environment, kuery, rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/logs');
} = useApmParams('/services/{serviceName}/logs');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

2
x-pack/plugins/apm/public/components/app/service_map/Controls.tsx
View file

@ -107,7 +107,7 @@ export function Controls() {
const {
query: { kuery },
} = useApmParams('/service-map', '/services/:serviceName/service-map');
} = useApmParams('/service-map', '/services/{serviceName}/service-map');
const [zoom, setZoom] = useState((cy && cy.zoom()) || 1);
const duration = parseInt(theme.eui.euiAnimSpeedFast, 10);

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

@ -27,7 +27,7 @@ export function BackendContents({
}: ContentsProps) {
const { query } = useApmParams(
'/service-map',
'/services/:serviceName/service-map'
'/services/{serviceName}/service-map'
);
const apmRouter = useApmRouter();
@ -57,11 +57,11 @@ export function BackendContents({
);
const isLoading = status === FETCH_STATUS.LOADING;
const detailsUrl = apmRouter.link('/backends/:backendName/overview', {
const detailsUrl = apmRouter.link('/backends/{backendName}/overview', {
path: { backendName },
query: query as TypeOf<
ApmRoutes,
'/backends/:backendName/overview'
'/backends/{backendName}/overview'
>['query'],
});

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

@ -63,12 +63,12 @@ export function ServiceContents({
const isLoading = status === FETCH_STATUS.LOADING;
const detailsUrl = apmRouter.link('/services/:serviceName', {
const detailsUrl = apmRouter.link('/services/{serviceName}', {
path: { serviceName },
query: { rangeFrom, rangeTo, environment, kuery },
});
const focusUrl = apmRouter.link('/services/:serviceName/service-map', {
const focusUrl = apmRouter.link('/services/{serviceName}/service-map', {
path: { serviceName },
query: { rangeFrom, rangeTo, environment, kuery },
});

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

@ -83,7 +83,7 @@ export function ServiceMapHome() {
export function ServiceMapServiceDetail() {
const {
query: { environment, kuery, rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/service-map');
} = useApmParams('/services/{serviceName}/service-map');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });
return (
<ServiceMap

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

@ -16,7 +16,7 @@ import { MetricsChart } from '../../shared/charts/metrics_chart';
export function ServiceMetrics() {
const {
query: { environment, kuery, rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/metrics');
} = useApmParams('/services/{serviceName}/metrics');
const { data, status } = useServiceMetricChartsFetcher({
serviceNodeName: undefined,

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

@ -54,7 +54,7 @@ export function ServiceNodeMetrics() {
const {
path: { serviceNodeName },
query,
} = useApmParams('/services/:serviceName/nodes/:serviceNodeName/metrics');
} = useApmParams('/services/{serviceName}/nodes/{serviceNodeName}/metrics');
const { environment, kuery, rangeFrom, rangeTo } = query;
@ -63,7 +63,7 @@ export function ServiceNodeMetrics() {
useBreadcrumb({
title: getServiceNodeName(serviceNodeName),
href: apmRouter.link(
'/services/:serviceName/nodes/:serviceNodeName/metrics',
'/services/{serviceName}/nodes/{serviceNodeName}/metrics',
{
path: {
serviceName,

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

@ -36,7 +36,7 @@ const ServiceNodeName = euiStyled.div`
function ServiceNodeOverview() {
const {
query: { environment, kuery, rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/nodes');
} = useApmParams('/services/{serviceName}/nodes');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -46,7 +46,7 @@ export function ServiceOverview() {
rangeTo,
transactionType: transactionTypeFromUrl,
},
} = useApmParams('/services/:serviceName/overview');
} = useApmParams('/services/{serviceName}/overview');
const { fallbackToTransactions } = useFallbackToTransactionsFetcher({
kuery,
});
@ -73,7 +73,7 @@ export function ServiceOverview() {
const isIosAgent = isIosAgentName(agentName);
const router = useApmRouter();
const dependenciesLink = router.link('/services/:serviceName/dependencies', {
const dependenciesLink = router.link('/services/{serviceName}/dependencies', {
path: {
serviceName,
},

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

@ -37,7 +37,7 @@ export function ServiceOverviewDependenciesTable({
const {
query: { environment, kuery, rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/*');
} = useApmParams('/services/{serviceName}/*');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -75,7 +75,7 @@ export function ServiceOverviewErrorsTable({ serviceName }: Props) {
const {
query: { environment, kuery, rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/overview');
} = useApmParams('/services/{serviceName}/overview');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -72,7 +72,7 @@ export function ServiceOverviewInstancesChartAndTable({
const {
query: { environment, kuery, rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/overview');
} = useApmParams('/services/{serviceName}/overview');
const {
urlParams: { latencyAggregationType, comparisonType, comparisonEnabled },

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

@ -70,7 +70,7 @@ export function ServiceOverviewInstancesTable({
const {
query: { kuery },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const {
urlParams: { latencyAggregationType, comparisonEnabled },

2
x-pack/plugins/apm/public/components/app/service_overview/service_overview_instances_table/use_instance_details_fetcher.tsx
View file

@ -17,7 +17,7 @@ export function useInstanceDetailsFetcher({
}) {
const {
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/overview');
} = useApmParams('/services/{serviceName}/overview');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -52,7 +52,7 @@ export function ServiceOverviewThroughputChart({
const {
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -26,7 +26,7 @@ export function ServiceProfiling() {
const {
query: { environment, kuery, rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/profiling');
} = useApmParams('/services/{serviceName}/profiling');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -22,7 +22,7 @@ import { TransactionDetailsTabs } from './transaction_details_tabs';
export function TransactionDetails() {
const { path, query } = useApmParams(
'/services/:serviceName/transactions/view'
'/services/{serviceName}/transactions/view'
);
const {
transactionName,
@ -43,7 +43,7 @@ export function TransactionDetails() {
useBreadcrumb({
title: transactionName,
href: apmRouter.link('/services/:serviceName/transactions/view', {
href: apmRouter.link('/services/{serviceName}/transactions/view', {
path,
query,
}),

2
x-pack/plugins/apm/public/components/app/transaction_details/transaction_details_tabs.tsx
View file

@ -32,7 +32,7 @@ const tabs = [
];
export function TransactionDetailsTabs() {
const { query } = useApmParams('/services/:serviceName/transactions/view');
const { query } = useApmParams('/services/{serviceName}/transactions/view');
const { urlParams } = useUrlParams();
const history = useHistory();

2
x-pack/plugins/apm/public/components/app/transaction_details/use_waterfall_fetcher.ts
View file

@ -24,7 +24,7 @@ export function useWaterfallFetcher() {
const {
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/transactions/view');
} = useApmParams('/services/{serviceName}/transactions/view');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -45,7 +45,7 @@ export function WaterfallWithSummary({
const {
query: { environment },
} = useApmParams('/services/:serviceName/transactions/view');
} = useApmParams('/services/{serviceName}/transactions/view');
useEffect(() => {
setSampleActivePage(0);

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

@ -27,7 +27,7 @@ export function FlyoutTopLevelProperties({ transaction }: Props) {
const {
urlParams: { latencyAggregationType },
} = useUrlParams();
const { query } = useApmParams('/services/:serviceName/transactions/view');
const { query } = useApmParams('/services/{serviceName}/transactions/view');
if (!transaction) {
return null;

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

@ -33,7 +33,7 @@ interface Props {
}
export function StickySpanProperties({ span, transaction }: Props) {
const { query } = useApmParams('/services/:serviceName/transactions/view');
const { query } = useApmParams('/services/{serviceName}/transactions/view');
const { environment, latencyAggregationType } = query;
const trackEvent = useUiTracker();

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

@ -22,7 +22,7 @@ export function TransactionLink() {
const {
path: { transactionId },
query: { rangeFrom, rangeTo },
} = useApmParams('/link-to/transaction/:transactionId');
} = useApmParams('/link-to/transaction/{transactionId}');
const { data = { transaction: null }, status } = useFetcher(
(callApmApi) => {

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

@ -26,7 +26,7 @@ export function TransactionOverview() {
rangeTo,
transactionType: transactionTypeFromUrl,
},
} = useApmParams('/services/:serviceName/transactions');
} = useApmParams('/services/{serviceName}/transactions');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

4
x-pack/plugins/apm/public/components/routing/apm_route_config.tsx
View file

@ -21,7 +21,7 @@ import { settings } from './settings';
*/
const apmRoutes = route([
{
path: '/link-to/transaction/:transactionId',
path: '/link-to/transaction/{transactionId}',
element: <TransactionLink />,
params: t.intersection([
t.type({
@ -38,7 +38,7 @@ const apmRoutes = route([
]),
},
{
path: '/link-to/trace/:traceId',
path: '/link-to/trace/{traceId}',
element: <TraceLink />,
params: t.intersection([
t.type({

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

@ -104,7 +104,7 @@ export const home = {
}),
children: [
{
path: '/:backendName/overview',
path: '/backends/{backendName}/overview',
element: <BackendDetailOverview />,
params: t.type({
path: t.type({
@ -113,7 +113,7 @@ export const home = {
}),
},
page({
path: '/',
path: '/backends',
title: DependenciesInventoryTitle,
element: <BackendInventory />,
}),

4
x-pack/plugins/apm/public/components/routing/service_detail/apm_service_wrapper.tsx
View file

@ -15,7 +15,7 @@ export function ApmServiceWrapper() {
const {
path: { serviceName },
query,
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const router = useApmRouter();
@ -26,7 +26,7 @@ export function ApmServiceWrapper() {
},
{
title: serviceName,
href: router.link('/services/:serviceName', {
href: router.link('/services/{serviceName}', {
query,
path: { serviceName },
}),

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

@ -62,7 +62,7 @@ function page<TPath extends string>({
}
export const serviceDetail = {
path: '/services/:serviceName',
path: '/services/{serviceName}',
element: <ApmServiceWrapper />,
params: t.intersection([
t.type({
@ -97,7 +97,7 @@ export const serviceDetail = {
},
children: [
page({
path: '/overview',
path: '/services/{serviceName}/overview',
element: <ServiceOverview />,
tab: 'overview',
title: i18n.translate('xpack.apm.views.overview.title', {
@ -110,7 +110,7 @@ export const serviceDetail = {
}),
{
...page({
path: '/transactions',
path: '/services/{serviceName}/transactions',
tab: 'transactions',
title: i18n.translate('xpack.apm.views.transactions.title', {
defaultMessage: 'Transactions',
@ -123,7 +123,7 @@ export const serviceDetail = {
}),
children: [
{
path: '/view',
path: '/services/{serviceName}/transactions/view',
element: <TransactionDetails />,
params: t.type({
query: t.intersection([
@ -138,13 +138,13 @@ export const serviceDetail = {
}),
},
{
path: '/',
path: '/services/{serviceName}/transactions',
element: <TransactionOverview />,
},
],
},
page({
path: '/dependencies',
path: '/services/{serviceName}/dependencies',
element: <ServiceDependencies />,
tab: 'dependencies',
title: i18n.translate('xpack.apm.views.dependencies.title', {
@ -156,7 +156,7 @@ export const serviceDetail = {
}),
{
...page({
path: '/errors',
path: '/services/{serviceName}/errors',
tab: 'errors',
title: i18n.translate('xpack.apm.views.errors.title', {
defaultMessage: 'Errors',
@ -173,7 +173,7 @@ export const serviceDetail = {
}),
children: [
{
path: '/:groupId',
path: '/services/{serviceName}/errors/{groupId}',
element: <ErrorGroupDetails />,
params: t.type({
path: t.type({
@ -182,13 +182,13 @@ export const serviceDetail = {
}),
},
{
path: '/',
path: '/services/{serviceName}/errors',
element: <ErrorGroupOverview />,
},
],
},
page({
path: '/metrics',
path: '/services/{serviceName}/metrics',
tab: 'metrics',
title: i18n.translate('xpack.apm.views.metrics.title', {
defaultMessage: 'Metrics',
@ -197,7 +197,7 @@ export const serviceDetail = {
}),
{
...page({
path: '/nodes',
path: '/services/{serviceName}/nodes',
tab: 'nodes',
title: i18n.translate('xpack.apm.views.nodes.title', {
defaultMessage: 'JVMs',
@ -206,7 +206,7 @@ export const serviceDetail = {
}),
children: [
{
path: '/:serviceNodeName/metrics',
path: '/services/{serviceName}/nodes/{serviceNodeName}/metrics',
element: <ServiceNodeMetrics />,
params: t.type({
path: t.type({
@ -215,7 +215,7 @@ export const serviceDetail = {
}),
},
{
path: '/',
path: '/services/{serviceName}/nodes',
element: <ServiceNodeOverview />,
params: t.partial({
query: t.partial({
@ -229,7 +229,7 @@ export const serviceDetail = {
],
},
page({
path: '/service-map',
path: '/services/{serviceName}/service-map',
tab: 'service-map',
title: i18n.translate('xpack.apm.views.serviceMap.title', {
defaultMessage: 'Service Map',
@ -240,7 +240,7 @@ export const serviceDetail = {
},
}),
page({
path: '/logs',
path: '/services/{serviceName}/logs',
tab: 'logs',
title: i18n.translate('xpack.apm.views.logs.title', {
defaultMessage: 'Logs',
@ -251,7 +251,7 @@ export const serviceDetail = {
},
}),
page({
path: '/profiling',
path: '/services/{serviceName}/profiling',
tab: 'profiling',
title: i18n.translate('xpack.apm.views.serviceProfiling.title', {
defaultMessage: 'Profiling',
@ -259,7 +259,7 @@ export const serviceDetail = {
element: <ServiceProfiling />,
}),
{
path: '/',
path: '/services/{serviceName}/',
element: <RedirectToDefaultServiceRouteView />,
},
],

2
x-pack/plugins/apm/public/components/routing/service_detail/redirect_to_default_service_route_view.tsx
View file

@ -13,7 +13,7 @@ export function RedirectToDefaultServiceRouteView() {
const {
path: { serviceName },
query,
} = useApmParams('/services/:serviceName/*');
} = useApmParams('/services/{serviceName}/*');
const search = qs.stringify(query);

16
x-pack/plugins/apm/public/components/routing/settings/index.tsx
View file

@ -58,7 +58,7 @@ export const settings = {
),
children: [
page({
path: '/agent-configuration',
path: '/settings/agent-configuration',
tab: 'agent-configurations',
title: i18n.translate(
'xpack.apm.views.settings.agentConfiguration.title',
@ -68,7 +68,7 @@ export const settings = {
}),
{
...page({
path: '/agent-configuration/create',
path: '/settings/agent-configuration/create',
title: i18n.translate(
'xpack.apm.views.settings.createAgentConfiguration.title',
{ defaultMessage: 'Create Agent Configuration' }
@ -84,7 +84,7 @@ export const settings = {
},
{
...page({
path: '/agent-configuration/edit',
path: '/settings/agent-configuration/edit',
title: i18n.translate(
'xpack.apm.views.settings.editAgentConfiguration.title',
{ defaultMessage: 'Edit Agent Configuration' }
@ -101,7 +101,7 @@ export const settings = {
}),
},
page({
path: '/apm-indices',
path: '/settings/apm-indices',
title: i18n.translate('xpack.apm.views.settings.indices.title', {
defaultMessage: 'Indices',
}),
@ -109,7 +109,7 @@ export const settings = {
element: <ApmIndices />,
}),
page({
path: '/customize-ui',
path: '/settings/customize-ui',
title: i18n.translate('xpack.apm.views.settings.customizeUI.title', {
defaultMessage: 'Customize app',
}),
@ -117,7 +117,7 @@ export const settings = {
element: <CustomizeUI />,
}),
page({
path: '/schema',
path: '/settings/schema',
title: i18n.translate('xpack.apm.views.settings.schema.title', {
defaultMessage: 'Schema',
}),
@ -125,7 +125,7 @@ export const settings = {
tab: 'schema',
}),
page({
path: '/anomaly-detection',
path: '/settings/anomaly-detection',
title: i18n.translate('xpack.apm.views.settings.anomalyDetection.title', {
defaultMessage: 'Anomaly detection',
}),
@ -133,7 +133,7 @@ export const settings = {
tab: 'anomaly-detection',
}),
{
path: '/',
path: '/settings',
element: <Redirect to="/settings/agent-configuration" />,
},
],

2
x-pack/plugins/apm/public/components/routing/templates/apm_service_template/analyze_data_button.tsx
View file

@ -47,7 +47,7 @@ export function AnalyzeDataButton() {
const {
query: { rangeFrom, rangeTo, environment },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const basepath = services.http?.basePath.get();
const canShowDashboard = services.application?.capabilities.dashboard.show;

24
x-pack/plugins/apm/public/components/routing/templates/apm_service_template/index.tsx
View file

@ -72,7 +72,7 @@ function TemplateWithContext({
path: { serviceName },
query,
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/*');
} = useApmParams('/services/{serviceName}/*');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });
@ -82,7 +82,7 @@ function TemplateWithContext({
useBreadcrumb({
title,
href: router.link(`/services/:serviceName/${selectedTab}` as const, {
href: router.link(`/services/{serviceName}/${selectedTab}` as const, {
path: { serviceName },
query,
}),
@ -162,7 +162,7 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) {
const {
path: { serviceName },
query: queryFromUrl,
} = useApmParams(`/services/:serviceName/${selectedTab}` as const);
} = useApmParams(`/services/{serviceName}/${selectedTab}` as const);
const query = omit(
queryFromUrl,
@ -175,7 +175,7 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) {
const tabs: Tab[] = [
{
key: 'overview',
href: router.link('/services/:serviceName/overview', {
href: router.link('/services/{serviceName}/overview', {
path: { serviceName },
query,
}),
@ -185,7 +185,7 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) {
},
{
key: 'transactions',
href: router.link('/services/:serviceName/transactions', {
href: router.link('/services/{serviceName}/transactions', {
path: { serviceName },
query,
}),
@ -195,7 +195,7 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) {
},
{
key: 'dependencies',
href: router.link('/services/:serviceName/dependencies', {
href: router.link('/services/{serviceName}/dependencies', {
path: { serviceName },
query,
}),
@ -207,7 +207,7 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) {
},
{
key: 'errors',
href: router.link('/services/:serviceName/errors', {
href: router.link('/services/{serviceName}/errors', {
path: { serviceName },
query,
}),
@ -217,7 +217,7 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) {
},
{
key: 'metrics',
href: router.link('/services/:serviceName/metrics', {
href: router.link('/services/{serviceName}/metrics', {
path: { serviceName },
query,
}),
@ -228,7 +228,7 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) {
},
{
key: 'nodes',
href: router.link('/services/:serviceName/nodes', {
href: router.link('/services/{serviceName}/nodes', {
path: { serviceName },
query,
}),
@ -239,7 +239,7 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) {
},
{
key: 'service-map',
href: router.link('/services/:serviceName/service-map', {
href: router.link('/services/{serviceName}/service-map', {
path: { serviceName },
query,
}),
@ -249,7 +249,7 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) {
},
{
key: 'logs',
href: router.link('/services/:serviceName/logs', {
href: router.link('/services/{serviceName}/logs', {
path: { serviceName },
query,
}),
@ -261,7 +261,7 @@ function useTabs({ selectedTab }: { selectedTab: Tab['key'] }) {
},
{
key: 'profiling',
href: router.link('/services/:serviceName/profiling', {
href: router.link('/services/{serviceName}/profiling', {
path: {
serviceName,
},

4
x-pack/plugins/apm/public/components/shared/backend_link.tsx
View file

@ -18,7 +18,7 @@ const StyledLink = euiStyled(EuiLink)`${truncate('100%')};`;
interface BackendLinkProps {
backendName: string;
query: TypeOf<ApmRoutes, '/backends/:backendName/overview'>['query'];
query: TypeOf<ApmRoutes, '/backends/{backendName}/overview'>['query'];
subtype?: string;
type?: string;
onClick?: React.ComponentProps<typeof EuiLink>['onClick'];
@ -35,7 +35,7 @@ export function BackendLink({
return (
<StyledLink
href={link('/backends/:backendName/overview', {
href={link('/backends/{backendName}/overview', {
path: { backendName },
query,
})}

2
x-pack/plugins/apm/public/components/shared/charts/breakdown_chart/index.tsx
View file

@ -67,7 +67,7 @@ export function BreakdownChart({
const {
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const theme = useTheme();

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

@ -89,7 +89,7 @@ export default {
return (
<ApmPluginContext.Provider value={apmPluginContextMock}>
<MemoryRouter initialEntries={[`/services/${serviceName}`]}>
<Route path="/services/:serviceName">
<Route path="/services/{serviceName}">
<KibanaContextProvider
services={{ ...apmPluginContextMock.core }}
>

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

@ -24,7 +24,7 @@ export function useTransactionBreakdown({
const {
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

2
x-pack/plugins/apm/public/components/shared/charts/transaction_charts/ml_header.tsx
View file

@ -36,7 +36,7 @@ export function MLHeader({ hasValidMlLicense, mlJobId }: Props) {
const {
query: { kuery },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
if (!hasValidMlLicense || !mlJobId) {
return null;

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

@ -63,7 +63,7 @@ export function TransactionErrorRateChart({
const {
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

4
x-pack/plugins/apm/public/components/shared/service_link.tsx
View file

@ -19,7 +19,7 @@ const StyledLink = euiStyled(EuiLink)`${truncate('100%')};`;
interface ServiceLinkProps {
agentName?: AgentName;
query: TypeOf<ApmRoutes, '/services/:serviceName/overview'>['query'];
query: TypeOf<ApmRoutes, '/services/{serviceName}/overview'>['query'];
serviceName: string;
}
@ -33,7 +33,7 @@ export function ServiceLink({
return (
<StyledLink
data-test-subj={`serviceLink_${agentName}`}
href={link('/services/:serviceName/overview', {
href={link('/services/{serviceName}/overview', {
path: { serviceName },
query,
})}

2
x-pack/plugins/apm/public/components/shared/time_comparison/index.tsx
View file

@ -120,7 +120,7 @@ export function TimeComparison() {
const { isSmall } = useBreakpoints();
const {
query: { rangeFrom, rangeTo },
} = useApmParams('/services', '/backends/*', '/services/:serviceName');
} = useApmParams('/services', '/backends/*', '/services/{serviceName}');
const { exactStart, exactEnd } = useTimeRange({
rangeFrom,

2
x-pack/plugins/apm/public/context/apm_backend/apm_backend_context.tsx
View file

@ -30,7 +30,7 @@ export function ApmBackendContextProvider({
const {
path: { backendName },
query: { rangeFrom, rangeTo },
} = useApmParams('/backends/:backendName/overview');
} = useApmParams('/backends/{backendName}/overview');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -41,7 +41,7 @@ export function ApmServiceContextProvider({
path: { serviceName },
query,
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

2
x-pack/plugins/apm/public/context/apm_service/use_service_transaction_types_fetcher.tsx
View file

@ -14,7 +14,7 @@ const INITIAL_DATA = { transactionTypes: [] };
export function useServiceTransactionTypesFetcher(serviceName?: string) {
const {
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

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

@ -22,7 +22,7 @@ export function useErrorGroupDistributionFetcher({
}) {
const {
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

2
x-pack/plugins/apm/public/hooks/use_search_strategy.ts
View file

@ -93,7 +93,7 @@ export function useSearchStrategy<
const { serviceName, transactionType } = useApmServiceContext();
const {
query: { kuery, environment, rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName/transactions/view');
} = useApmParams('/services/{serviceName}/transactions/view');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });
const { urlParams } = useUrlParams();
const { transactionName } = urlParams;

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

@ -27,7 +27,7 @@ export function useServiceMetricChartsFetcher({
}) {
const {
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });
const { agentName, serviceName } = useApmServiceContext();

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

@ -35,7 +35,7 @@ export function useTransactionLatencyChartsFetcher({
const {
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });

2
x-pack/plugins/apm/public/hooks/use_transaction_trace_samples_fetcher.ts
View file

@ -34,7 +34,7 @@ export function useTransactionTraceSamplesFetcher({
const {
query: { rangeFrom, rangeTo },
} = useApmParams('/services/:serviceName');
} = useApmParams('/services/{serviceName}');
const { start, end } = useTimeRange({ rangeFrom, rangeTo });