Minor review feedback

Added test for labels outside the group

Ensures that labels that belong to other
groups do not appear in the label dropdowns

ee/app/assets/javascripts/analytics/cycle_analytics/components/custom_stage_form.vue

@@ -58,10 +58,13 @@ export default {
     errors: {
       type: Object,
       required: false,
-      default: null,
+      default: () => ({}),
     },
   },
   data() {
+    const defaultErrors = this?.initialFields?.endEventIdentifier
+      ? {}
+      : { endEventIdentifier: [s__('CustomCycleAnalytics|Please select a start event first')] };
     return {
       labelEvents: getLabelEventsIdentifiers(this.events),
       fields: {
@@ -71,6 +74,7 @@ export default {
       fieldErrors: {
         ...defaultFields,
         ...this.errors,
+        ...defaultErrors,
       },
     };
   },
@@ -91,11 +95,6 @@ export default {
     hasStartEvent() {
       return this.fields.startEventIdentifier;
     },
-    endEventDescription() {
-      return !this.hasStartEvent
-        ? s__('CustomCycleAnalytics|Please select a start event first')
-        : '';
-    },
     startEventRequiresLabel() {
       return isLabelEvent(this.labelEvents, this.fields.startEventIdentifier);
     },
@@ -266,7 +265,6 @@ export default {
         <gl-form-group
           ref="endEventIdentifier"
           :label="s__('CustomCycleAnalytics|Stop event')"
-          :description="endEventDescription"
           :state="!hasFieldErrors('endEventIdentifier')"
           :invalid-feedback="fieldErrorMessage('endEventIdentifier')"
           @change.native="onUpdateEndEventField"

ee/app/assets/javascripts/analytics/cycle_analytics/store/actions.js

@@ -24,7 +24,7 @@ const handleErrorOrRethrow = ({ action, error }) => {
 const isStageNameExistsError = ({ status, errors }) => {
   const ERROR_NAME_RESERVED = 'is reserved';
   if (status === httpStatus.UNPROCESSABLE_ENTITY) {
-    if (errors?.name.includes(ERROR_NAME_RESERVED)) return true;
+    if (errors?.name?.includes(ERROR_NAME_RESERVED)) return true;
   }
   return false;
 };

ee/spec/features/analytics/cycle_analytics/cycle_analytics_spec.rb

@@ -4,9 +4,11 @@ require 'spec_helper'
 describe 'Group Value Stream Analytics', :js do
   let!(:user) { create(:user) }
   let!(:group) { create(:group, name: "CA-test-group") }
+  let!(:group2) { create(:group, name: "CA-bad-test-group") }
   let!(:project) { create(:project, :repository, namespace: group, group: group, name: "Cool fun project") }
   let!(:label) { create(:group_label, group: group) }
   let!(:label2) { create(:group_label, group: group) }
+  let!(:label3) { create(:group_label, group: group2) }
 
   let(:milestone) { create(:milestone, project: project) }
   let(:mr) { create_merge_request_closing_issue(user, project, issue, commit_message: "References #{issue.to_reference}") }
@@ -433,6 +435,17 @@ describe 'Group Value Stream Analytics', :js do
             expect(page).to have_button('Add stage', disabled: true)
           end
 
+          it 'does not contain labels from outside the group' do
+            field = 'custom-stage-start-event-label'
+            page.find("[name=#{field}] .dropdown-toggle").click
+
+            menu = page.find("[name=#{field}] .dropdown-menu")
+
+            expect(menu).not_to have_content(label3.name)
+            expect(menu).to have_content(label.name)
+            expect(menu).to have_content(label2.name)
+          end
+
           context 'with all required fields set' do
             before do
               select_dropdown_label 'custom-stage-start-event-label', 1

ee/spec/frontend/analytics/cycle_analytics/components/__snapshots__/custom_stage_form_spec.js.snap

@@ -6,58 +6,6 @@ exports[`CustomStageForm Editing a custom stage isSavingCustomStage=true display
 </button>"
 `;
 
-exports[`CustomStageForm Empty form Start event with events does not select events with canBeStartEvent=false for the start events dropdown 1`] = `
-"<select name=\\"custom-stage-start-event\\" required=\\"required\\" aria-required=\\"true\\" class=\\"gl-form-select custom-select\\" id=\\"__BVID__123\\">
-  <option value=\\"\\">Select start event</option>
-  <option value=\\"issue_created\\">Issue created</option>
-  <option value=\\"issue_first_mentioned_in_commit\\">Issue first mentioned in a commit</option>
-  <option value=\\"merge_request_created\\">Merge request created</option>
-  <option value=\\"merge_request_first_deployed_to_production\\">Merge request first deployed to production</option>
-  <option value=\\"merge_request_last_build_finished\\">Merge request last build finish time</option>
-  <option value=\\"merge_request_last_build_started\\">Merge request last build start time</option>
-  <option value=\\"merge_request_merged\\">Merge request merged</option>
-  <option value=\\"code_stage_start\\">Issue first mentioned in a commit</option>
-  <option value=\\"plan_stage_start\\">Issue first associated with a milestone or issue first added to a board</option>
-  <option value=\\"issue_closed\\">Issue closed</option>
-  <option value=\\"issue_first_added_to_board\\">Issue first added to a board</option>
-  <option value=\\"issue_first_associated_with_milestone\\">Issue first associated with a milestone</option>
-  <option value=\\"issue_label_added\\">Issue label was added</option>
-  <option value=\\"issue_label_removed\\">Issue label was removed</option>
-  <option value=\\"merge_request_closed\\">Merge request closed</option>
-  <option value=\\"merge_request_label_added\\">Merge Request label was added</option>
-  <option value=\\"merge_request_label_removed\\">Merge Request label was removed</option>
-</select>"
-`;
-
-exports[`CustomStageForm Empty form Start event with events selects events with canBeStartEvent=true for the start events dropdown 1`] = `
-"<select name=\\"custom-stage-start-event\\" required=\\"required\\" aria-required=\\"true\\" class=\\"gl-form-select custom-select\\" id=\\"__BVID__95\\">
-  <option value=\\"\\">Select start event</option>
-  <option value=\\"issue_created\\">Issue created</option>
-  <option value=\\"issue_first_mentioned_in_commit\\">Issue first mentioned in a commit</option>
-  <option value=\\"merge_request_created\\">Merge request created</option>
-  <option value=\\"merge_request_first_deployed_to_production\\">Merge request first deployed to production</option>
-  <option value=\\"merge_request_last_build_finished\\">Merge request last build finish time</option>
-  <option value=\\"merge_request_last_build_started\\">Merge request last build start time</option>
-  <option value=\\"merge_request_merged\\">Merge request merged</option>
-  <option value=\\"code_stage_start\\">Issue first mentioned in a commit</option>
-  <option value=\\"plan_stage_start\\">Issue first associated with a milestone or issue first added to a board</option>
-  <option value=\\"issue_closed\\">Issue closed</option>
-  <option value=\\"issue_first_added_to_board\\">Issue first added to a board</option>
-  <option value=\\"issue_first_associated_with_milestone\\">Issue first associated with a milestone</option>
-  <option value=\\"issue_label_added\\">Issue label was added</option>
-  <option value=\\"issue_label_removed\\">Issue label was removed</option>
-  <option value=\\"merge_request_closed\\">Merge request closed</option>
-  <option value=\\"merge_request_label_added\\">Merge Request label was added</option>
-  <option value=\\"merge_request_label_removed\\">Merge Request label was removed</option>
-</select>"
-`;
-
-exports[`CustomStageForm Empty form isSavingCustomStage=true displays a loading icon 1`] = `
-"<button disabled=\\"disabled\\" type=\\"button\\" class=\\"js-save-stage btn btn-success\\"><span class=\\"gl-spinner-container\\"><span aria-label=\\"Loading\\" aria-hidden=\\"true\\" class=\\"gl-spinner gl-spinner-orange gl-spinner-sm\\"></span></span>
-  Add stage
-</button>"
-`;
-
 exports[`CustomStageForm Start event with events does not select events with canBeStartEvent=false for the start events dropdown 1`] = `
 "<select name=\\"custom-stage-start-event\\" required=\\"required\\" aria-required=\\"true\\" class=\\"gl-form-select custom-select\\" id=\\"__BVID__123\\">
   <option value=\\"\\">Select start event</option>

ee/spec/frontend/analytics/cycle_analytics/components/custom_stage_form_spec.js

@@ -269,8 +269,6 @@ describe('CustomStageForm', () => {
       });
 
       it('will notify if the current start and stop event pair is not valid', () => {
-        expect(wrapper.find(sel.invalidFeedback).exists()).toEqual(false);
-
         selectDropdownOption(wrapper, sel.startEvent, 2);
 
         return Vue.nextTick().then(() => {