[UX] Refactor pipeline creation flow on the console UI

[xiaofei-du]

Background

In the current create-a-pipeline UX flow of the console, we support using existing pipeline components and creating new pipeline components on spot (see screenshot below)

Component not ready problem

When creating new pipeline components during the flow, there is no guarantee that the new components are always ready to be used in the to-be-created pipeline. This is because the state management of each type of component resource (source/model/destination) is independent. When the component is not ready, the create-a-pipeline flow will stop at that step. Users may be confused about what to do next: should I re-start over, report a bug or re-create the component?

We can simplify the flow to reduce confusion.

Proposal 1

we can remove creating new pipeline components from the create-a-pipeline flow. This means users can only choose ready-to-use pipeline components during the flow, this guarantees the pipeline can be created successfully.

Proposal 2

Same as Proposal 1, remove creating new pipeline components from the create-a-pipeline flow.
We put all the flow steps on one page

• Choose pipeline mode
• Set up source
• Set up model
• Set up destination
• Set up pipeline

Similar to below:

Omit the Choose pipeline mode step and automatically decide the pipeline mode by backend

The current design lets user choose what kind of pipeline they want to create first. We can simplify it to omit this step and let the user choose source and destination, and the backend can automatically decide the pipeline mode for the user.

Show Setup guide on the side

Inspired by Airbyte console design: It will be convenient for the user to check the guide in the console without going to the documentation website.