[APM] Add "View in Logs" button by the Logstream component in Trace detail

[formgeist]

Summary

The Logs component embeddable supports adding a "View in logs" link in the top-right corner of the component which is useful for quickly exploring all related logs in the dedicated app.

• [Logs UI] "View in logs" shared component/hook/function #82635

[elasticmachine]

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

[formgeist]

@dannycroft I think it'd be great to get this prioritised for the next release if possible

[cauemarcondes]

Like, described in this issue #82635, we should basically import the new component and use it to create the link.

@afgomez / @jasonrhodes for what I could see the linkToLogs was not implemented. Have you come up with a different solution?

[afgomez]

I'm not in that team anymore but AFAIK there's no component/function. There is a magic /link-to URL (https://github.com/elastic/kibana/blob/1bfeab7553899efcfa9a6e46b37dc3c7681dcf3b/x-pack/plugins/infra/public/pages/link_to/link_to_logs.tsx) so that could be a good start.

@elastic/infra-monitoring-ui could you chime in? Is there an officially supported way to link to the logs app?

[miltonhultgren]

As far as I know, other apps (like the Deprecations UI) use our /link-to URLs for this. We have an issue to add Kibana Locators somewhere...
I don't know if the Log Stream component has anything built in for that, @weltenwort @Kerry350 ?

[weltenwort]

There's nothing built into the log stream component. The link-to URLs would indeed be the best approach until we've added locators. An example of the Stack Monitoring UI using a link-to URL would be

kibana/x-pack/plugins/monitoring/public/components/logs/logs.js

Line 113 in 6ed28ac

const base = `${Legacy.shims.getBasePath()}/app/logs/link-to/${INFRA_SOURCE_ID}/logs`;

[sorenlouv]

Using the "link-to" approach sounds good to me. How would we apply the kql filter like "service.name: "opbeans-dotnet" or (not service.name and (container.id:"581c0655"))"?

Would it look like this?

/app/logs/link-to/internal-stack-monitoring/logs?kql=foo

[weltenwort]

Yes, the route supports a filter query parameter that takes kql like that.

[weltenwort]

Also time as a unix epoch to center on a point in time and from/to as unix epochs to set the time range:

kibana/x-pack/plugins/infra/public/pages/link_to/query_params.ts

Lines 12 to 30 in f7c6b77

	export const getTimeFromLocation = (location: Location) => {
	const timeParam = getParamFromQueryString(getQueryStringFromLocation(location), 'time');
	return timeParam ? parseFloat(timeParam) : NaN;
	};
	export const getFilterFromLocation = (location: Location) => {
	const param = getParamFromQueryString(getQueryStringFromLocation(location), 'filter');
	return param ? param : '';
	};
	export const getToFromLocation = (location: Location) => {
	const timeParam = getParamFromQueryString(getQueryStringFromLocation(location), 'to');
	return timeParam ? parseFloat(timeParam) : NaN;
	};
	export const getFromFromLocation = (location: Location) => {
	const timeParam = getParamFromQueryString(getQueryStringFromLocation(location), 'from');
	return timeParam ? parseFloat(timeParam) : NaN;
	};