Skip to content

Created a new Vue label selector for issuable forms

Robert Hunt requested to merge 1269-improve-label-selection-frontend into master

What does this MR do and why?

This MR creates a new label selector for the issues and MRs creation form. The new selector renders a list of the labels that have been selected by the user. This makes it easier to see what labels have been selected and remove them if needed.

Once this is fully deployed and tested, the creation pages for epics and test cases will also be updated to show the labels selected.

This MR will not render the new list without Add improved label selection to issues and MRs ... (!88908 - merged) and the :visible_label_selection_on_metadata feature flag.

Screenshots or screen recordings

Empty With labels In action
image image Screen_Recording_2022-06-15_at_09.15.58

How to set up and validate locally

  1. Cherry-pick the commits from Add improved label selection to issues and MRs ... (!88908 - merged)
  2. Create a new issue and test that you can select labels and save the form
  3. Create a new MR and test that you can select labels and save the form
  4. Edit the MR and test that you can change the labels and save the form
  5. Turn on the feature flag: echo "Feature.enable(:visible_label_selection_on_metadata)" | rails c
  6. Create a new issue and test that you can select labels, see the list of labels, remove labels from the list, and save the form
  7. Create a new MR and test that you can select labels, see the list of labels, remove labels from the list, and save the form
  8. Edit the MR and test that you can change the labels using the dropdown or removing labels from the list, and save the form

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 gitlab-org/gitlab-services/design.gitlab.com#1269

Edited by Robert Hunt

Merge request reports