Skip to content

Add pipeline mini-graph to system information box in MR/Commit Views

With the builds tab gone, decided here: https://gitlab.com/gitlab-org/gitlab-ce/issues/21953#note_17292938 we have to offer an alternative option to get people quickly to the latest pipeline builds which they want to inspect.

Proposal

We already show the latest pipeline in the commit/mr view system information element. Lets add the mini-pipeline graph which will have extended functionality as per https://gitlab.com/gitlab-org/gitlab-ce/issues/19703

image

image

or with a description (doesn't work without the white background):

image

alternatively without the white encompassing background element (the reason why this element was introduced in the previous mockups is to add context that these are the "stages" of that pipeline. As in the pipeline list, there is an actual "Stages" column header):

image

Design

We are incoorporating the stylistic changes of the MR system info widget https://gitlab.com/gitlab-org/gitlab-ce/issues/23420 into one with this issue. So apart from adding the mini pipeline graph, this will also be a stylistic update to the rest of the information.

desktop view: desktop

mobile view:

  • On mobile view the mini pipeline graph will be horizontally scrollable if the amount of stages exceeds the width of the container provided.
  • On mobile view the duration and time ago of the pipeline/ together with the status wording (passed/failed) etc will be hidden

mobile_mr_view_with_mini_pipeline

cc: @markpundsack @tauriedavis

Edited by Rayana Verissimo