Added the SET_FORM_INITIAL_DATA mutation

Added an additional mutation to explicitly
set the initial data for the custom stages
form

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

@@ -179,10 +179,9 @@ export const requestUpdateStage = ({ commit }) => commit(types.REQUEST_UPDATE_ST
 export const receiveUpdateStageSuccess = ({ commit, dispatch }, updatedData) => {
   commit(types.RECEIVE_UPDATE_STAGE_SUCCESS);
   createFlash(__('Stage data updated'), 'notice');
-
   return Promise.all([
     dispatch('fetchGroupStagesAndEvents'),
-    dispatch('setSelectedStage', updatedData),
+    dispatch('customStages/showEditForm', updatedData),
   ]).catch(() => {
     createFlash(__('There was a problem refreshing the data, please try again'));
   });

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

@@ -28,24 +28,9 @@ export const showCreateForm = ({ commit }) => {
 };
 
 export const showEditForm = ({ commit, dispatch }, selectedStage = {}) => {
-  const {
-    id = null,
-    name = null,
-    startEventIdentifier = null,
-    startEventLabel: { id: startEventLabelId = null } = {},
-    endEventIdentifier = null,
-    endEventLabel: { id: endEventLabelId = null } = {},
-  } = selectedStage;
-
-  commit(types.SHOW_EDIT_FORM, {
-    id,
-    name,
-    startEventIdentifier,
-    startEventLabelId,
-    endEventIdentifier,
-    endEventLabelId,
-  });
-  dispatch('setSelectedStage', selectedStage);
+  commit(types.SET_FORM_INITIAL_DATA, selectedStage);
+  commit(types.SHOW_EDIT_FORM);
+  dispatch('setSelectedStage', selectedStage, { root: true });
   removeFlash();
 };
 

ee/app/assets/javascripts/analytics/cycle_analytics/store/modules/custom_stages/mutation_types.js

 export const SET_STAGE_EVENTS = 'SET_STAGE_EVENTS';
 export const SET_STAGE_FORM_ERRORS = 'SET_STAGE_FORM_ERRORS';
+export const SET_FORM_INITIAL_DATA = 'SET_FORM_INITIAL_DATA';
 
 export const HIDE_FORM = 'SHOW_FORM';
 export const SHOW_CREATE_FORM = 'SHOW_CREATE_FORM';

ee/app/assets/javascripts/analytics/cycle_analytics/store/modules/custom_stages/mutations.js

 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
 import * as types from './mutation_types';
+import { transformRawStages } from '../../../utils';
+
+const extractFormFields = (rawStage = {}) => {
+  const [
+    {
+      id = null,
+      name = null,
+      startEventIdentifier = null,
+      startEventLabel: { id: startEventLabelId = null } = {},
+      endEventIdentifier = null,
+      endEventLabel: { id: endEventLabelId = null } = {},
+    },
+  ] = transformRawStages([rawStage]);
+  return {
+    id,
+    name,
+    startEventIdentifier,
+    startEventLabelId,
+    endEventIdentifier,
+    endEventLabelId,
+  };
+};
 
 export default {
   [types.SET_STAGE_EVENTS](state, data = []) {
@@ -9,16 +31,18 @@ export default {
     state.isSavingCustomStage = false;
     state.formErrors = convertObjectPropsToCamelCase(errors, { deep: true });
   },
+  [types.SET_FORM_INITIAL_DATA](state, rawStageData = null) {
+    state.formInitialData = extractFormFields(rawStageData);
+  },
   [types.SHOW_CREATE_FORM](state) {
     state.isEditingCustomStage = false;
     state.isCreatingCustomStage = true;
     state.formInitialData = null;
     state.formErrors = null;
   },
-  [types.SHOW_EDIT_FORM](state, initialData) {
+  [types.SHOW_EDIT_FORM](state) {
     state.isCreatingCustomStage = false;
     state.isEditingCustomStage = true;
-    state.formInitialData = initialData;
     state.formErrors = null;
   },
   [types.HIDE_FORM](state) {

ee/spec/frontend/analytics/cycle_analytics/store/actions_spec.js

@@ -481,7 +481,10 @@ describe('Cycle analytics actions', () => {
           response,
           state,
           [{ type: types.RECEIVE_UPDATE_STAGE_SUCCESS }],
-          [{ type: 'fetchGroupStagesAndEvents' }, { type: 'setSelectedStage', payload: response }],
+          [
+            { type: 'fetchGroupStagesAndEvents' },
+            { type: 'customStages/showEditForm', payload: response },
+          ],
         ));
 
       it('will flash a success message', () => {

ee/spec/frontend/analytics/cycle_analytics/store/mutations_spec.js

@@ -15,6 +15,7 @@ import {
   endDate,
   customizableStagesAndEvents,
   selectedProjects,
+  rawCustomStage,
 } from '../mock_data';
 
 let state = null;
@@ -109,6 +110,24 @@ describe('Cycle analytics mutations', () => {
         expect(state.formErrors).toEqual(convertObjectPropsToCamelCase(mockFormError));
       });
     });
+
+    describe(`${customStageTypes.SET_FORM_INITIAL_DATA}`, () => {
+      const mockStage = {
+        id: 18,
+        name: 'Coolest beans stage',
+        startEventIdentifier: 'issue_first_mentioned_in_commit',
+        startEventLabelId: null,
+        endEventIdentifier: 'issue_first_added_to_board',
+        endEventLabelId: null,
+      };
+
+      it('will set formInitialData', () => {
+        state = {};
+        customStageMutations[customStageTypes.SET_FORM_INITIAL_DATA](state, rawCustomStage);
+
+        expect(state.formInitialData).toEqual(mockStage);
+      });
+    });
   });
 
   describe(`${types.RECEIVE_CYCLE_ANALYTICS_DATA_SUCCESS}`, () => {