feature(frontend): Automate Tab - CLI Command

[xoscar]

This PR adds the CLI command controls and input for users to copy paste

Changes

• Adds a new section to the automate tab
• Incudes controls for the command
• Updates code block component to use the same across the app

Fixes

• [Deployment Tab] Introduce CLI dynamic command #2751

Checklist

• tested locally
• added new dependencies
• updated the docs
• added a test

https://www.loom.com/share/f62bc225d38846b4af20d26d86255cd2

[adnanrahic]

This is awesome!

One suggestion might be cool:

• Can we also enable naming the test definition file?
• This could be a field in the left tile right above the code block.

My reasoning:

• This would let the used give the test definition a specific name before downloading the file.
• This would make the right tile use the specific name for the test definition from the left tile.

If this is too complex, I'm not super invested in having it. It's already pretty awesome!

[xoscar]

This is awesome!

One suggestion might be cool:

• Can we also enable naming the test definition file?
• This could be a field in the left tile right above the code block.

My reasoning:

• This would let the used give the test definition a specific name before downloading the file.
• This would make the right tile use the specific name for the test definition from the left tile.

If this is too complex, I'm not super invested in having it. It's already pretty awesome!

@adnanrahic great suggestion, can we create an issue for this and involve @olha23 so she can think about a design for this?

[jorgeepc]

I like this 🔥 A couple of comments/questions.

• I think we should have a Copy cmd button. It's not that clear that you have to click the code block to copy it.
• Do we support yaml as an output for test run?

[jorgeepc]

Minor: here you can add an id to the switch component and a <label htmlFor="id">{text}</label>. With this you can use the switch by clicking on the text.