Skip to content

Apollo MR pipelines - Introduce FF and new component

What does this MR do and why?

Introduce a FF and a brand new component that mounts when the FF is enabled. We replace app/assets/javascripts/commit/pipelines/pipelines_table.vue with app/assets/javascripts/commit/pipelines/pipelines_table_wrapper.vue. This component is sending a graphql query to get the list of pipelines. The query is at its minimum for now and we will only add fields as we need them.

We are also polling every 10 seconds and using etags for caching. Note that pagination controls will be done in a following MR.

You can preview how this will all come together with the spike MR: !127663 (closed)

Screenshots or screen recordings

Before After
Screenshot_2023-08-10_at_3.16.15_PM Screenshot_2023-08-10_at_3.16.27_PM

How to set up and validate locally

  1. Enable the feature flag in your rails console: rails c -> `Feature.enable(:mr_pipelines_graphql)
  2. Ensure that you have working runners
  3. Make sure that you have a CI configuration. If you have none, go to Build -> Pipeline editor.
  4. Add the following content
stages:
  - build
  - test
  - deploy

build_job:
  stage: build
  script: echo hammer away

test_job:
  stage: test
  script: echo This is a valid test

deploy_job:
  stage: deploy
  script: echo this is now live on prod
  1. Make a merge request (anything will so long as it runs a pipeline)
  2. Go to the pipelines tab
  3. Notice that you can see a list of pipelines path (no styling yet)

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Related to #419723 (closed)

Edited by Frédéric Caplette

Merge request reports