[Ingest] Agent configuration - create data source UI

[jen-huang]

View in Figma

View Figma prototype

Videos:

• starting on agent configuration page: https://share.getcloudapp.com/YEuA9QrJ
• starting from integration detail page: https://share.getcloudapp.com/7KuR5Pll
• please note: 2 subtle changes on behavior since recording these videos:
  • The EuiBottomBar should always be visible, but the submit button should be disabled depending on the state of the form.
  • Ignore where it says "X / X streams enabled" in the bottom left, just leave it blank. For the "edit" workflow, this area will say "You have unsaved changes" if the form is in a dirty state.

Convert existing 3-step create data source wizard that spans separate pages into one page. The page will still be three steps but will be hidden and enabled as the user completes them.

Tasks

• Convert existing steps into one page
• Add sticky bottom bar for Cancel/Save actions
• Convert existing agent count check callout into modal

[elasticmachine]

Pinging @elastic/ingest-management (Feature:EPM)

[hbharding]

@ruflin @nchaulet @jen-huang I updated this issue with screenshots and 2 videos that walk through the 2 possible userflows for adding a data source.

After i posted it, I noticed some of my language is inconsistent, "New data source" vs "Add data source". I've gone back and forth on this. At the moment, I'm thinking it should say "Add data source". Let me know and I can update screenshots, or we can just record the decision here.

[ruflin]

Few notes from my side which I think we also discussed in our meeting yesterday:

• I like that all is in on screen
• I think Step 2 and 3 should be just 2 steps
• I like the bottom bar
• I think we should remove the 4/8 streams enabled

+1 on calling it "add data source", also the button in the package detail view.

[hbharding]

I updated screenshots and left a note about the expected behavior based on our meeting. I also included a link to the prototype which starts at the beginning of the flow. For the time being, I want to keep steps 2 and 3 as is. I think @ruflin might be right, but I don't want to spend the time right now updating the designs, and I believe the code already has these parts separated into steps. I'll make note of this here #59807