Design: Add `include:` file links to the pipeline editor
This is a frontend issue for the original proposal based of the original epic
🧩 Problem
Complex CI/CD configuration can contain multiple pipelines added to the main config using the include
keyword. When editing or troubleshooting your config it's difficult to navigate between the .gitlab-ci-yml
and the included files.
Additionally, a complex pipeline configuration might contain separate files for downstream pipelines and other files.
Engineers who author pipelines would like to edit all of their pipelines files in one place and take advantage of the pipeline editor features like pipeline visualization, linting, etc.
🎨 Proposal
As an MVC, we will surface a list of links to the pipeline files added to the config with the include:
keyword.
Feature acceptance criteria:
- A collapsible files section will contain a list of the includes which will open in a new tab (the file will open in file view in the repo).
- The
.gitlab-ci.yml
would be highlighted as the currently open file (it won't be clickable as it's already open in the pipeline editor). - The other pipeline files will show an external link icon on hover.
- The file names should be truncated after a certain number of characters, like we do in the MRs file tree. When a file name is truncated, we should show the full file name in a system tooltip on hover (same behavior as in the MRs file tree).
- When the list of files is long, it should be scrollable.
- The file tree will open using the "file tree" icon button placed above the file tree.
- When we release the feature, the file tree section will be expanded by default. We should remember the user's selection once they collapse the file tree, so if they collapse it, next time they open the editor it'll be collapsed.
- When project has a simple one-file pipeline, we'll show a notification inside the files section explaining that pipeline files will appear here.
- When project doesn't have a pipeline file yet (for example, when you haven't committed the
.gitlab-ci.yml
yet), we won't show the file tree section and the file tree button. We will show the button and the file tree once you commit the file.
Mock-up
This page may contain information related to upcoming products, features and functionality. It is important to note that the information presented is for informational purposes only, so please do not rely on the information for purchasing or planning purposes. Just like with all projects, the items mentioned on the page are subject to change or delay, and the development, release, and timing of any products, features, or functionality remain at the sole discretion of GitLab Inc.