[APM] Replace custom kuery bar with shared SearchBar / TopNavMenu

[smith]

The navigation plugin exposes a TopNavMenu component that includes the query bar and date picker.

We should use this instead of our own components in APM and Observability plugins.

The Search Bar in Discover

[elasticmachine]

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

[alex-fedotyev]

This needs more alignment across observability - when logs and metrics are doing this? Or is it already in place?

[smith]

@alex-fedotyev each solution in Observability is using its own search bar implementation at this time, so none of us are using the search bar provided in most other apps in Kibana.

Since the shared component can also do filtering, this is also related to the exploration of filtering that @formgeist is doing on elastic/observability-design#24.

[honzakral]

Any idea on the timeline here? I see that 7.13 target was dropped so came to ask.

I have a use case which is quite important for me - to be able to filter on "User Experience" app by customer, user. anonymous, ... but there is no support in the UI. Right now my hacky solution would be to have different environments for these settings but it messes up other parts of the APM and shouldn't really be needed.

Thanks!

[formgeist]

@honzakral Hope you're doing well! You're right that we have been pushing this particular issue back in order to investigate switching to the global header search bar and date picker instead of relying on individual implementations in each of the Observability apps. This issue is specifically for switching it in the APM app, but I've created a new issue to add a search bar to the UX app.

[honzakral]

@formgeist thank you, much appreciated! I will watch the issue you created. I wasn't sure where the UX apps falls so I followed the data to APM and found this.

[smith]

This issue should be updated to use the Unified Search components instead of the older ones referenced in the description.

[smith]

We've got unified search so this is no longer needed.