Remove actionType from RelatedItemsTreeApp component

ee/app/assets/javascripts/related_items_tree/components/related_items_tree_app.vue

@@ -10,11 +10,10 @@ import TreeItemRemoveModal from './tree_item_remove_modal.vue';
 import RelatedItemsTreeHeader from './related_items_tree_header.vue';
 import RelatedItemsTreeBody from './related_items_tree_body.vue';
 
-import { PathIdSeparator, ActionType, OVERFLOW_AFTER } from '../constants';
+import { PathIdSeparator, OVERFLOW_AFTER } from '../constants';
 
 export default {
   PathIdSeparator,
-  ActionType,
   OVERFLOW_AFTER,
   components: {
     GlLoadingIcon,
@@ -37,7 +36,7 @@ export default {
       'autoCompleteIssues',
       'pendingReferences',
       'itemInputValue',
-      'actionType',
+      'issuableType',
       'epicsEndpoint',
       'issuesEndpoint',
     ]),
@@ -90,12 +89,12 @@ export default {
       });
     },
     handleAddItemFormCancel() {
-      this.toggleAddItemForm({ toggleState: false, actionType: this.actionType });
+      this.toggleAddItemForm({ toggleState: false });
       this.setPendingReferences([]);
       this.setItemInputValue('');
     },
     handleCreateEpicFormCancel() {
-      this.toggleCreateEpicForm({ toggleState: false, actionType: this.actionType });
+      this.toggleCreateEpicForm({ toggleState: false });
       this.setItemInputValue('');
     },
   },
@@ -123,7 +122,7 @@ export default {
       >
         <add-item-form
           v-if="showAddItemForm"
-          :issuable-type="actionType"
+          :issuable-type="issuableType"
           :input-value="itemInputValue"
           :is-submitting="itemAddInProgress"
           :pending-references="pendingReferences"

ee/app/assets/javascripts/related_items_tree/components/related_items_tree_header.vue

@@ -40,10 +40,7 @@ export default {
           toggleState: true,
         });
       } else {
-        this.toggleCreateEpicForm({
-          actionType,
-          toggleState: true,
-        });
+        this.toggleCreateEpicForm({ toggleState: true });
       }
     },
   },

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

+import { issuableTypesMap } from 'ee/related_issues/constants';
 import { ChildType, ActionType, PathIdSeparator } from '../constants';
 
 export const autoCompleteSources = () => gl.GfmAutoComplete && gl.GfmAutoComplete.dataSources;
@@ -32,6 +33,18 @@ export const itemAutoCompleteSources = (state, getters) => {
   return state.autoCompleteIssues ? getters.autoCompleteSources : {};
 };
 
+export const issuableType = state => {
+  if (state.actionType === ActionType.Epic) {
+    return issuableTypesMap.EPIC;
+  }
+
+  if (state.actionType === ActionType.Issue) {
+    return issuableTypesMap.ISSUE;
+  }
+
+  return null;
+};
+
 export const itemPathIdSeparator = state =>
   state.actionType === ActionType.Epic ? PathIdSeparator.Epic : PathIdSeparator.Issue;
 

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

@@ -121,13 +121,14 @@ export default {
   },
 
   [types.TOGGLE_ADD_ITEM_FORM](state, { actionType, toggleState }) {
-    state.actionType = actionType;
+    if (actionType) {
+      state.actionType = actionType;
+    }
     state.showAddItemForm = toggleState;
     state.showCreateEpicForm = false;
   },
 
-  [types.TOGGLE_CREATE_EPIC_FORM](state, { actionType, toggleState }) {
-    state.actionType = actionType;
+  [types.TOGGLE_CREATE_EPIC_FORM](state, { toggleState }) {
     state.showCreateEpicForm = toggleState;
     state.showAddItemForm = false;
   },

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

@@ -2,6 +2,7 @@ import * as getters from 'ee/related_items_tree/store/getters';
 
 import createDefaultState from 'ee/related_items_tree/store/state';
 
+import { issuableTypesMap } from 'ee/related_issues/constants';
 import { ChildType, ActionType } from 'ee/related_items_tree/constants';
 
 import {
@@ -142,6 +143,17 @@ describe('RelatedItemsTree', () => {
         });
       });
 
+      describe('issuableType', () => {
+        it.each`
+          actionType          | expectedValue
+          ${null}             | ${null}
+          ${ActionType.Epic}  | ${issuableTypesMap.EPIC}
+          ${ActionType.Issue} | ${issuableTypesMap.ISSUE}
+        `('for $actionType returns $expectedValue', ({ actionType, expectedValue }) => {
+          expect(getters.issuableType({ actionType })).toBe(expectedValue);
+        });
+      });
+
       describe('itemPathIdSeparator', () => {
         it('returns string containing pathIdSeparator for `Epic` when `state.actionType` is set to `Epic`', () => {
           state.actionType = ActionType.Epic;

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

@@ -379,15 +379,11 @@ describe('RelatedItemsTree', () => {
       });
 
       describe(types.TOGGLE_CREATE_EPIC_FORM, () => {
-        it('should set value of `actionType`, `showCreateEpicForm` as it is and `showAddItemForm` as false on state', () => {
-          const data = {
-            actionType: 'Epic',
-            toggleState: true,
-          };
+        it('should set value of `showCreateEpicForm` as it is and `showAddItemForm` as false on state', () => {
+          const data = { toggleState: true };
 
           mutations[types.TOGGLE_CREATE_EPIC_FORM](state, data);
 
-          expect(state.actionType).toBe(data.actionType);
           expect(state.showCreateEpicForm).toBe(data.toggleState);
           expect(state.showAddItemForm).toBe(false);
         });

ee/spec/javascripts/related_items_tree/components/related_items_tree_app_spec.js

@@ -124,10 +124,7 @@ describe('RelatedItemsTreeApp', () => {
 
         wrapper.vm.handleAddItemFormCancel();
 
-        expect(wrapper.vm.toggleAddItemForm).toHaveBeenCalledWith({
-          toggleState: false,
-          actionType: '',
-        });
+        expect(wrapper.vm.toggleAddItemForm).toHaveBeenCalledWith({ toggleState: false });
       });
 
       it('calls `setPendingReferences` action with empty array', () => {
@@ -152,11 +149,6 @@ describe('RelatedItemsTreeApp', () => {
         spyOn(wrapper.vm, 'toggleCreateEpicForm');
 
         wrapper.vm.handleCreateEpicFormCancel();
-
-        expect(wrapper.vm.toggleCreateEpicForm).toHaveBeenCalledWith({
-          toggleState: false,
-          actionType: '',
-        });
       });
 
       it('calls `setItemInputValue` action with empty string', () => {

ee/spec/javascripts/related_items_tree/components/related_items_tree_header_spec.js

@@ -73,15 +73,9 @@ describe('RelatedItemsTree', () => {
         it('calls `toggleCreateEpicForm` action when provided `id` param value is not `0`', () => {
           spyOn(wrapper.vm, 'toggleCreateEpicForm');
 
-          wrapper.vm.handleActionClick({
-            id: 1,
-            actionType,
-          });
+          wrapper.vm.handleActionClick({ id: 1 });
 
-          expect(wrapper.vm.toggleCreateEpicForm).toHaveBeenCalledWith({
-            actionType,
-            toggleState: true,
-          });
+          expect(wrapper.vm.toggleCreateEpicForm).toHaveBeenCalledWith({ toggleState: true });
         });
       });
     });