Skip to content

MR pipelines migration to GraphQL - Render the pipelines list

Frédéric Caplette requested to merge 419724-apollo-mr-pipelines-build-pipeline-table-component-2 into master

What does this MR do and why?

This is behind a disabled FF mr_pipelines_graphql.

As part of our effort to migrate the Merge request page pipelines tab to GraphQL, we are now rendering the pipelines table component instead of simply the pipeline Id. This is a first step towards the migration and not in any way finished or fully working. For example, the pipeline mini graph is absent and some actions will not yet work (like running a pipeline or pipelines artefacts). Here is exactly what should and should not work:

  1. The pipeline status renders correctly
  2. The pipeline URL (the second column) renders the commit title, Pipeline ID, merge request iid, commit ref and the author avatar. Each of these elements should be clickable and lead to their respective details page.
  3. The author Avatar with a tooltip and a link to the profile page
  4. Polling is implemented with etags and caching
  5. Specs for the table only cover the visual aspects thave have been added. Each functionality that we add afterwards will also add the specs we had for that feature.
  6. Run pipeline button will appear but not work when clicked. This will be fixed in: #466725
  7. Artifacts are not fetched (I think because we have not added VueX to the new app) and will be fixed here: #466759 (closed)
  8. no mini graph as this will be implemented in: #419725
  9. No pagination as this will be implemented in: #423282

For more details, you can check the epic: &11080

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

Screenshots are required for UI changes, and strongly recommended for all other merge requests.

Before After
Screenshot_2024-05-27_at_3.52.37_PM !Screenshot_2024-06-11_at_10.26.23_AM

How to set up and validate locally

  1. Enable the feature flag mr_pipelines_graphql
  2. Create a merge request and run a few pipelines on it.
  3. Go to the MR page
  4. Go to the pipelines tab
  5. Notice that all visual elements render correctly (except the mini graph)
  6. Click on all links available in the pipeline row and ensure they lead to the correct pages

Related to #419724 (closed)

Edited by Frédéric Caplette

Merge request reports