[APM] Support multiple route paths in useApmParams

[dgieselaar]

Summary

Support multiple route paths in useApmParams, which is useful when a component is expected to be rendered on multiple pages:

const { path, query } = useApmParams('/service-map', '/services/:serviceName/service-map');

[elasticmachine]

Pinging @elastic/apm-ui (Team:apm)

[sorenlouv]

When supplying multiple routes to useApmParams will it narrow the params to only the intersection (commonalities)?

My gut feeling is that this will be more confusing than useful. For re-usable components that's used across different routes, I think the "react-way" is to pass the params as props.

[dgieselaar]

@sqren it will be a union type. My first guess was also to pass these props down from components that are guaranteed to be on one route, but it's pretty annoying to pass upwards of 10 query parameters down multiple components, especially when some of those parameters are optional, making it easy to forget about them.

[sorenlouv]

My first guess was also to pass these props down from components that are guaranteed to be on one route, but it's pretty annoying to pass upwards of 10 query parameters down multiple components, especially when some of those parameters are optional, making it easy to forget about them.

Yeah, I can see that. Was also the primary reason to create this hook in the first place.

it will be a union type.

I think we mean the same thing. I just always confuse intersection and union types.

Btw. It's probably just me (it most certainly is...) but it feels like TS reversed the meaning of union and intersection. In math union is represented by the upper image and intersection is represented by the bottom image:

[dgieselaar]

@elasticmachine merge upstream

[dgieselaar]

this is needed for the typescript optimisation script

[kibanamachine]

💛 Build succeeded, but was flaky

• continuous-integration/kibana-ci/pull-request

• Commit: 98c42ba

• Storybooks Preview

• Flaky suites:

  • xpack-APMCypress

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
apm	4.4MB	4.4MB	+1.3KB

History

• 💛 Build #147200 was flaky 2e16b8a

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

[kibanamachine]

💚 Backport successful

Status	Branch	Result
✅	7.x

This backport PR will be merged automatically after passing CI.