Move pipeline header to GraphQL
Summary
As part of the effort to move our API to GraphQL, we need to move the Pipeline Header to use GraphQL instead of the current service architecture.
The Pipeline Header refers to the header on the pipeline details page (see screenshot below for example)
The frontend would need access to some data that is currently unavailable:
Query: The user
{
pipeline(id){
user{
...fields of the user that triggered the pipeline
}
}
Fields we are currently using:
name
path
email
avatar_url
userAvatarAltText
status_tooltip_html
Mutations:
- Retry pipeline by ID
- Cancel pipeline by ID
- Delete pipeline by ID
By looking at the pattern of other similar mutations, it seems the mutation returns back a field that takes an ID in which the errors are. Example of what the FE query would look like:
mutation cancelPipeline($id: ID) {
cancelPipeline(input: { $id: ID }) {
errors
}
}
Improvements
This allows us to move away from an outdated file structure, and move onto a more maintainable solution.
Risks
There may be parts of the pipeline GraphQL schema that are needed by the header that are not included yet. We will need to do some client-side GraphQL queries in the meantime to make the transition easier.
Involved components
/app/assets/javascripts/pipelines/components/header_component.vue