Adds the updateValueStream action and vuex code

Adds an additional API request to update a value
stream using the new backend. Includes the related
vuex actions/mutations and state changes.

ee/app/assets/javascripts/analytics/cycle_analytics/components/create_value_stream_form/constants.js

@@ -8,7 +8,7 @@ export const I18N = {
   FORM_CREATED: s__("CreateValueStreamForm|'%{name}' Value Stream created"),
   RECOVER_HIDDEN_STAGE: s__('CreateValueStreamForm|Recover hidden stage'),
   RESTORE_HIDDEN_STAGE: s__('CreateValueStreamForm|Restore stage'),
-  RESTORE_STAGES: s__('CreateValueStreamForm|Restore defaults'),
+  RESTORE_DEFAULTS: s__('CreateValueStreamForm|Restore defaults'),
   RECOVER_STAGE_TITLE: s__('CreateValueStreamForm|Default stages'),
   RECOVER_STAGES_VISIBLE: s__('CreateValueStreamForm|All default stages are currently visible'),
   SELECT_START_EVENT: s__('CreateValueStreamForm|Select start event'),
@@ -79,7 +79,7 @@ export const defaultCustomStageFields = { ...defaultFields, custom: true };
  *
  * More information: https://gitlab.com/gitlab-org/gitlab/-/merge_requests/49094#note_464116439
  */
-const BASE_DEFAULT_STAGE_CONFIG = [
+export const BASE_DEFAULT_STAGE_CONFIG = [
   {
     id: 'issue',
     startEventIdentifier: ['issue_created'],

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

@@ -354,6 +354,26 @@ export const createValueStream = ({ commit, dispatch, getters }, data) => {
     });
 };
 
+export const receiveUpdateValueStreamSuccess = ({ commit, dispatch }, valueStream = {}) => {
+  commit(types.RECEIVE_UPDATE_VALUE_STREAM_SUCCESS, valueStream);
+  return dispatch('fetchCycleAnalyticsData');
+};
+
+export const updateValueStream = (
+  { commit, dispatch, getters },
+  { id: valueStreamId, ...data },
+) => {
+  const { currentGroupPath } = getters;
+  commit(types.REQUEST_UPDATE_VALUE_STREAM);
+
+  return Api.cycleAnalyticsUpdateValueStream({ groupId: currentGroupPath, valueStreamId, data })
+    .then(({ data: newValueStream }) => dispatch('receiveUpdateValueStreamSuccess', newValueStream))
+    .catch(({ response } = {}) => {
+      const { data: { message, payload: { errors } } = null } = response;
+      commit(types.RECEIVE_UPDATE_VALUE_STREAM_ERROR, { message, errors, data });
+    });
+};
+
 export const deleteValueStream = ({ commit, dispatch, getters }, valueStreamId) => {
   const { currentGroupPath } = getters;
   commit(types.REQUEST_DELETE_VALUE_STREAM);

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

@@ -39,6 +39,10 @@ export const REQUEST_CREATE_VALUE_STREAM = 'REQUEST_CREATE_VALUE_STREAM';
 export const RECEIVE_CREATE_VALUE_STREAM_SUCCESS = 'RECEIVE_CREATE_VALUE_STREAM_SUCCESS';
 export const RECEIVE_CREATE_VALUE_STREAM_ERROR = 'RECEIVE_CREATE_VALUE_STREAM_ERROR';
 
+export const REQUEST_UPDATE_VALUE_STREAM = 'REQUEST_UPDATE_VALUE_STREAM';
+export const RECEIVE_UPDATE_VALUE_STREAM_SUCCESS = 'RECEIVE_UPDATE_VALUE_STREAM_SUCCESS';
+export const RECEIVE_UPDATE_VALUE_STREAM_ERROR = 'RECEIVE_UPDATE_VALUE_STREAM_ERROR';
+
 export const REQUEST_DELETE_VALUE_STREAM = 'REQUEST_DELETE_VALUE_STREAM';
 export const RECEIVE_DELETE_VALUE_STREAM_SUCCESS = 'RECEIVE_DELETE_VALUE_STREAM_SUCCESS';
 export const RECEIVE_DELETE_VALUE_STREAM_ERROR = 'RECEIVE_DELETE_VALUE_STREAM_ERROR';

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

@@ -129,7 +129,21 @@ export default {
   [types.RECEIVE_CREATE_VALUE_STREAM_SUCCESS](state, valueStream) {
     state.isCreatingValueStream = false;
     state.createValueStreamErrors = {};
-    state.selectedValueStream = convertObjectPropsToCamelCase(valueStream);
+    state.selectedValueStream = convertObjectPropsToCamelCase(valueStream, { deep: true });
+  },
+  [types.REQUEST_UPDATE_VALUE_STREAM](state) {
+    state.isEditingValueStream = true;
+    state.createValueStreamErrors = {};
+  },
+  [types.RECEIVE_UPDATE_VALUE_STREAM_ERROR](state, { data: { stages = [] }, errors = {} }) {
+    const { stages: stageErrors = {}, ...rest } = errors;
+    state.createValueStreamErrors = { ...rest, stages: prepareStageErrors(stages, stageErrors) };
+    state.isEditingValueStream = false;
+  },
+  [types.RECEIVE_UPDATE_VALUE_STREAM_SUCCESS](state, valueStream) {
+    state.isEditingValueStream = false;
+    state.createValueStreamErrors = {};
+    state.selectedValueStream = convertObjectPropsToCamelCase(valueStream, { deep: true });
   },
   [types.REQUEST_DELETE_VALUE_STREAM](state) {
     state.isDeletingValueStream = true;
@@ -145,7 +159,7 @@ export default {
     state.selectedValueStream = null;
   },
   [types.SET_SELECTED_VALUE_STREAM](state, valueStream) {
-    state.selectedValueStream = convertObjectPropsToCamelCase(valueStream);
+    state.selectedValueStream = convertObjectPropsToCamelCase(valueStream, { deep: true });
   },
   [types.REQUEST_VALUE_STREAMS](state) {
     state.isLoadingValueStreams = true;

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

@@ -22,6 +22,7 @@ export default () => ({
 
   isLoadingValueStreams: false,
   isCreatingValueStream: false,
+  isEditingValueStream: false,
   isDeletingValueStream: false,
 
   createValueStreamErrors: {},

ee/app/assets/javascripts/api.js

@@ -194,6 +194,13 @@ export default {
     return axios.post(url, data);
   },
 
+  cycleAnalyticsUpdateValueStream({ groupId, valueStreamId, data }) {
+    const url = Api.buildUrl(this.cycleAnalyticsValueStreamPath)
+      .replace(':id', groupId)
+      .replace(':value_stream_id', valueStreamId);
+    return axios.put(url, data);
+  },
+
   cycleAnalyticsDeleteValueStream(groupId, valueStreamId) {
     const url = Api.buildUrl(this.cycleAnalyticsValueStreamPath)
       .replace(':id', groupId)

ee/spec/frontend/api_spec.js

@@ -374,6 +374,24 @@ describe('Api', () => {
       });
     });
 
+    describe('cycleAnalyticsUpdateValueStream', () => {
+      it('updates the custom value stream data', (done) => {
+        const response = {};
+        const customValueStream = { name: 'cool-value-stream-stage', stages: [] };
+        const expectedUrl = valueStreamBaseUrl({ resource: `value_streams/${valueStreamId}` });
+        mock.onPut(expectedUrl).reply(httpStatus.OK, response);
+
+        Api.cycleAnalyticsUpdateValueStream({ groupId, valueStreamId, data: customValueStream })
+          .then(({ data, config: { data: reqData, url } }) => {
+            expect(data).toEqual(response);
+            expect(JSON.parse(reqData)).toMatchObject(customValueStream);
+            expect(url).toEqual(expectedUrl);
+          })
+          .then(done)
+          .catch(done.fail);
+      });
+    });
+
     describe('cycleAnalyticsDeleteValueStream', () => {
       it('delete the custom value stream', (done) => {
         const response = {};