Pipeline visual preview in WebIDE

Today in the WebIDE, we have the ability to preview markdown:

We should build a reusable Vue component - who's first home will be the WebIDE to "preview" the composition of stages and jobs in a GitLab CI/CD pipeline.

Inspiration

This conversation with @jschatz1: https://youtu.be/P-u4VXLCxaM?t=619 (start 10 minutes in - that link should take you there).

Proposal

• Add "Preview" tab to any .gitlab-ci.yml
• When you click "Preview", do a CI lint (https://docs.gitlab.com/ee/ci/yaml/#validate-the-gitlab-ciyml)
• If linting fails, display the lint error to the user
• If linting passes, build a visualization of the pipeline

Nice to have

• Click on a job, be brought back to Edit tab at correct line
• Show jobs and stages from include:

Out of scope

• Visualization elsewhere in GitLab.
• Upstream/downstream pipeline expansion in visualization
• Detect/assume something is "GitLab CI yml" that isn't named .gitlab-ci.yml (e.g. for future includes)
• Simultaneous visualization while building the pipeline
• Any "editing" visually