Merge branch 'winh-isEpic-getter' into 'master'

Extract isEpic getter in related items tree store

See merge request gitlab-org/gitlab!17665

ee/app/assets/javascripts/related_items_tree/store/actions.js

@@ -256,18 +256,17 @@ export const removePendingReference = ({ commit }, data) =>
 export const setItemInputValue = ({ commit }, data) => commit(types.SET_ITEM_INPUT_VALUE, data);
 
 export const requestAddItem = ({ commit }) => commit(types.REQUEST_ADD_ITEM);
-export const receiveAddItemSuccess = ({ dispatch, commit, getters }, { actionType, rawItems }) => {
-  const isEpic = actionType === ActionType.Epic;
+export const receiveAddItemSuccess = ({ dispatch, commit, getters, state }, { rawItems }) => {
   const items = rawItems.map(item =>
     formatChildItem({
-      ...convertObjectPropsToCamelCase(item, { deep: !isEpic }),
-      type: isEpic ? ChildType.Epic : ChildType.Issue,
-      userPermissions: isEpic ? { adminEpic: item.can_admin } : {},
+      ...convertObjectPropsToCamelCase(item, { deep: !getters.isEpic }),
+      type: getters.isEpic ? ChildType.Epic : ChildType.Issue,
+      userPermissions: getters.isEpic ? { adminEpic: item.can_admin } : {},
     }),
   );
 
   commit(types.RECEIVE_ADD_ITEM_SUCCESS, {
-    insertAt: isEpic ? 0 : getters.issuesBeginAtIndex,
+    insertAt: getters.isEpic ? 0 : getters.issuesBeginAtIndex,
     items,
   });
 
@@ -281,7 +280,7 @@ export const receiveAddItemSuccess = ({ dispatch, commit, getters }, { actionTyp
   dispatch('setPendingReferences', []);
   dispatch('setItemInputValue', '');
   dispatch('toggleAddItemForm', {
-    actionType,
+    actionType: state.actionType,
     toggleState: false,
   });
 };
@@ -294,16 +293,15 @@ export const receiveAddItemFailure = ({ commit, state }, data = {}) => {
   }
   flash(errorMessage);
 };
-export const addItem = ({ state, dispatch }) => {
+export const addItem = ({ state, dispatch, getters }) => {
   dispatch('requestAddItem');
 
   axios
-    .post(state.actionType === ActionType.Epic ? state.epicsEndpoint : state.issuesEndpoint, {
+    .post(getters.isEpic ? state.epicsEndpoint : state.issuesEndpoint, {
       issuable_references: state.pendingReferences,
     })
     .then(({ data }) => {
       dispatch('receiveAddItemSuccess', {
-        actionType: state.actionType,
         // Newly added item is always first in the list
         rawItems: data.issuables.slice(0, state.pendingReferences.length),
       });
@@ -314,14 +312,10 @@ export const addItem = ({ state, dispatch }) => {
 };
 
 export const requestCreateItem = ({ commit }) => commit(types.REQUEST_CREATE_ITEM);
-export const receiveCreateItemSuccess = (
-  { state, commit, dispatch, getters },
-  { actionType, rawItem },
-) => {
-  const isEpic = actionType === ActionType.Epic;
+export const receiveCreateItemSuccess = ({ state, commit, dispatch, getters }, { rawItem }) => {
   const item = formatChildItem({
-    ...convertObjectPropsToCamelCase(rawItem, { deep: !isEpic }),
-    type: isEpic ? ChildType.Epic : ChildType.Issue,
+    ...convertObjectPropsToCamelCase(rawItem, { deep: !getters.isEpic }),
+    type: getters.isEpic ? ChildType.Epic : ChildType.Issue,
     // This is needed since Rails API to create Epic
     // doesn't return global ID, we can remove this
     // change once create epic action is moved to
@@ -343,7 +337,7 @@ export const receiveCreateItemSuccess = (
   });
 
   dispatch('toggleCreateEpicForm', {
-    actionType,
+    actionType: state.actionType,
     toggleState: false,
   });
 };
@@ -368,10 +362,7 @@ export const createItem = ({ state, dispatch }, { itemTitle }) => {
         created_at: '',
       });
 
-      dispatch('receiveCreateItemSuccess', {
-        actionType: state.actionType,
-        rawItem: data,
-      });
+      dispatch('receiveCreateItemSuccess', { rawItem: data });
     })
     .catch(() => {
       dispatch('receiveCreateItemFailure');

ee/app/assets/javascripts/related_items_tree/store/getters.js

@@ -27,7 +27,7 @@ export const issuesBeginAtIndex = (state, getters) =>
   getters.directChildren.findIndex(item => item.type === ChildType.Issue);
 
 export const itemAutoCompleteSources = (state, getters) => {
-  if (state.actionType === ActionType.Epic) {
+  if (getters.isEpic) {
     return state.autoCompleteEpics ? getters.autoCompleteSources : {};
   }
   return state.autoCompleteIssues ? getters.autoCompleteSources : {};
@@ -45,8 +45,10 @@ export const issuableType = state => {
   return null;
 };
 
-export const itemPathIdSeparator = state =>
-  state.actionType === ActionType.Epic ? PathIdSeparator.Epic : PathIdSeparator.Issue;
+export const itemPathIdSeparator = (state, getters) =>
+  getters.isEpic ? PathIdSeparator.Epic : PathIdSeparator.Issue;
+
+export const isEpic = state => state.actionType === ActionType.Epic;
 
 // prevent babel-plugin-rewire from generating an invalid default during karma tests
 export default () => {};

ee/spec/frontend/related_items_tree/store/getters_spec.js

@@ -113,6 +113,7 @@ describe('RelatedItemsTree', () => {
         it('returns autoCompleteSources value when `actionType` is set to `Epic` and `autoCompleteEpics` is true', () => {
           const mockGetter = {
             autoCompleteSources: 'foo',
+            isEpic: true,
           };
           state.actionType = ActionType.Epic;
           state.autoCompleteEpics = true;
@@ -155,16 +156,23 @@ describe('RelatedItemsTree', () => {
       });
 
       describe('itemPathIdSeparator', () => {
-        it('returns string containing pathIdSeparator for `Epic` when `state.actionType` is set to `Epic`', () => {
-          state.actionType = ActionType.Epic;
-
-          expect(getters.itemPathIdSeparator(state)).toBe('&');
+        it('returns string containing pathIdSeparator for `Epic`  when isEpic is truee', () => {
+          expect(getters.itemPathIdSeparator({}, { isEpic: true })).toBe('&');
         });
 
-        it('returns string containing pathIdSeparator for `Issue` when `state.actionType` is set to `Issue`', () => {
-          state.actionType = ActionType.Issue;
+        it('returns string containing pathIdSeparator for `Issue` when isEpic is false', () => {
+          expect(getters.itemPathIdSeparator({}, { isEpic: false })).toBe('#');
+        });
+      });
 
-          expect(getters.itemPathIdSeparator(state)).toBe('#');
+      describe('isEpic', () => {
+        it.each`
+          actionType          | expectedValue
+          ${null}             | ${false}
+          ${ActionType.Issue} | ${false}
+          ${ActionType.Epic}  | ${true}
+        `('for actionType = $actionType is $expectedValue', ({ actionType, expectedValue }) => {
+          expect(getters.isEpic({ actionType })).toBe(expectedValue);
         });
       });
     });

ee/spec/javascripts/related_items_tree/store/actions_spec.js

@@ -806,6 +806,9 @@ describe('RelatedItemTree', () => {
       describe('receiveAddItemSuccess', () => {
         it('should set `state.itemAddInProgress` to false and dispatches actions `setPendingReferences`, `setItemInputValue` and `toggleAddItemForm`', done => {
           state.epicsBeginAtIndex = 0;
+          state.actionType = ActionType.Epic;
+          state.isEpic = true;
+
           const mockEpicsWithoutPerm = mockEpics.map(item =>
             Object.assign({}, item, {
               pathIdSeparator: PathIdSeparator.Epic,
@@ -815,7 +818,7 @@ describe('RelatedItemTree', () => {
 
           testAction(
             actions.receiveAddItemSuccess,
-            { actionType: ActionType.Epic, rawItems: mockEpicsWithoutPerm },
+            { rawItems: mockEpicsWithoutPerm },
             state,
             [
               {
@@ -906,6 +909,7 @@ describe('RelatedItemTree', () => {
           state.actionType = ActionType.Epic;
           state.epicsEndpoint = '/foo/bar';
           state.pendingReferences = ['foo'];
+          state.isEpic = true;
 
           mock.onPost(state.epicsEndpoint).replyOnce(200, { issuables: [mockEpic1] });
 
@@ -920,7 +924,7 @@ describe('RelatedItemTree', () => {
               },
               {
                 type: 'receiveAddItemSuccess',
-                payload: { actionType: ActionType.Epic, rawItems: [mockEpic1] },
+                payload: { rawItems: [mockEpic1] },
               },
             ],
             done,
@@ -976,10 +980,12 @@ describe('RelatedItemTree', () => {
           state.parentItem = {
             fullPath: createdEpic.group.fullPath,
           };
+          state.actionType = ActionType.Epic;
+          state.isEpic = true;
 
           testAction(
             actions.receiveCreateItemSuccess,
-            { rawItem: mockEpic1, actionType: ActionType.Epic },
+            { rawItem: mockEpic1 },
             state,
             [
               {
@@ -1068,7 +1074,6 @@ describe('RelatedItemTree', () => {
               {
                 type: 'receiveCreateItemSuccess',
                 payload: {
-                  actionType: ActionType.Epic,
                   rawItem: Object.assign({}, mockEpic1, {
                     path: '',
                     state: ChildState.Open,