[Infra/Logs UI] Turn source configuration into a tab

[weltenwort]

Summary

The source configuration, which is currently shown in a flyout in the Infra UI and the Logs UI, should instead be shown as a tab in the top-level tabbed navigation. In order to avoid having two levels of tabs, the sections and tabs of the current flyout could be turned into sections akin to the sections on Kibana's advanced settings page.

For the Logs UI this means introducing the tabbed navigation in the first place.

Rationale

The addition of new features will lead to the creation of additional full-screen views as well as new settings. A top-level tabbed navigation is already established in APM and the Infra UI to navigate between such full-screen views. Turning the settings flyout into a tab also frees up space on the Infra UI and Logs UI toolbars.

Acceptance criteria

• The Infra UI has a "Settings" tab as the rightmost tab, that contains the source configuration form.
• The Logs UI has a tab bar at the top similar to the Infra UI.
• The first Logs UI tab is a "Stream" tab, that contains the current logs page content.
• The rightmost Logs UI tab is a "Settings" tab, that contains the source configuration form.
• The active tab is represented in the URL (similar to how it's already done in the Infra UI).
• The buttons and links to the source configuration flyout are removed from both the Infra UI and the Logs UI.

Mockups

[elasticmachine]

Pinging @elastic/infra-logs-ui

[jasonrhodes]

Tabs as navigation is kind of a growing scourge in Kibana-land, but this is the pattern emerging so it makes sense to follow with that for now. SIEM has created a slightly stylized version of tabs that we should look into.

[weltenwort]

I agree... design support on this would be highly appreciated. (@hbharding 😉)

[Zacqary]

To confirm, this isn't just changing the "Configuration" button to a tab, this is also placing the settings form inside the page content instead of in a side flyout?

[jasonrhodes]

To confirm, this isn't just changing the "Configuration" button to a tab, this is also placing the settings form inside the page content instead of in a side flyout?

Right, it would move out of the flyout. I think we may need to consider if we still want to do this with the ML integration work in a bit of scope-limbo... I'll ping you to chat.

[hbharding]

I like this! +1 to a consistent UX. However, as a newcomer, take my endorsement with a grain of salt :). I want to make sure there are no major downstream implications that we need to look out for. For instance, @jasonrhodes has mentioned nested tabs can be problematic – i'd like to dig into that to understand why.

[jasonrhodes]

Moving this back to the backlog for now until we sort out a little more of the ML integration work. This work isn't directly related to the ML integration and we may want to do this regardless, but we should think about it with @hbharding and decide the best way forward.

[Kerry350]

Closed with #42243

[Kerry350]

🙄🙄🙄🙄🙄