[Improvement] align the order of user defined end component's field and the output field

[EiffelFly]

Tested by owner on d0

CleanShot 2024-05-16 at 17.48.38.mp4

Is There an Existing Issue for This?

• [X] I have searched the existing issues

Where are you aiming to make improvements?

Console

Is your Proposal Related to a Problem?

Right now the end component's fields order are not represented on the output of the pipeline.

https://github.com/instill-ai/community/assets/57251712/9f6e0c6c-edbd-4220-adcd-e0bc92a86eaf

Describe Your Proposed Improvement

We need to make the UI layer represent user defined order

Highlight the Benefits

No response

Anything Else?

No response