Add latest changes from gitlab-org/gitlab@master

6 files changed, 113 insertions, 2 deletions

diff --git a/spec/frontend/work_items/components/notes/work_item_note_actions_spec.js b/spec/frontend/work_items/components/notes/work_item_note_actions_spec.js
index b406c9d843a..99bf391e261 100644
--- a/spec/frontend/work_items/components/notes/work_item_note_actions_spec.js
+++ b/spec/frontend/work_items/components/notes/work_item_note_actions_spec.js
@@ -22,6 +22,7 @@ describe('Work Item Note Actions', () => {
   const findDeleteNoteButton = () => wrapper.find('[data-testid="delete-note-action"]');
   const findCopyLinkButton = () => wrapper.find('[data-testid="copy-link-action"]');
   const findAssignUnassignButton = () => wrapper.find('[data-testid="assign-note-action"]');
+  const findReportAbuseToAdminButton = () => wrapper.find('[data-testid="abuse-note-action"]');
 
   const addEmojiMutationResolver = jest.fn().mockResolvedValue({
     data: {
@@ -39,6 +40,7 @@ describe('Work Item Note Actions', () => {
     showEdit = true,
     showAwardEmoji = true,
     showAssignUnassign = false,
+    canReportAbuse = false,
   } = {}) => {
     wrapper = shallowMount(WorkItemNoteActions, {
       propsData: {
@@ -47,6 +49,7 @@ describe('Work Item Note Actions', () => {
         noteId,
         showAwardEmoji,
         showAssignUnassign,
+        canReportAbuse,
       },
       provide: {
         glFeatures: {
@@ -195,4 +198,30 @@ describe('Work Item Note Actions', () => {
       expect(wrapper.emitted('assignUser')).toEqual([[]]);
     });
   });
+
+  describe('report abuse to admin', () => {
+    it('should not report abuse to admin by default', () => {
+      createComponent();
+
+      expect(findReportAbuseToAdminButton().exists()).toBe(false);
+    });
+
+    it('should display assign/unassign when the props is true', () => {
+      createComponent({
+        canReportAbuse: true,
+      });
+
+      expect(findReportAbuseToAdminButton().exists()).toBe(true);
+    });
+
+    it('should emit `reportAbuse` event when report abuse action is clicked', () => {
+      createComponent({
+        canReportAbuse: true,
+      });
+
+      findReportAbuseToAdminButton().vm.$emit('click');
+
+      expect(wrapper.emitted('reportAbuse')).toEqual([[]]);
+    });
+  });
 });
diff --git a/spec/frontend/work_items/components/notes/work_item_note_spec.js b/spec/frontend/work_items/components/notes/work_item_note_spec.js
index 69b7c7b0828..f8be2f5667b 100644
--- a/spec/frontend/work_items/components/notes/work_item_note_spec.js
+++ b/spec/frontend/work_items/components/notes/work_item_note_spec.js
@@ -300,5 +300,23 @@ describe('Work Item Note', () => {
         });
       });
     });
+
+    describe('report abuse props', () => {
+      it.each`
+        currentUserId | canReportAbuse | sameAsAuthor
+        ${1}          | ${false}       | ${'same as'}
+        ${4}          | ${true}        | ${'not same as'}
+      `(
+        'should be $canReportAbuse when the author is $sameAsAuthor as the author of the note',
+        ({ currentUserId, canReportAbuse }) => {
+          window.gon = {
+            current_user_id: currentUserId,
+          };
+          createComponent();
+
+          expect(findNoteActions().props('canReportAbuse')).toBe(canReportAbuse);
+        },
+      );
+    });
   });
 });
diff --git a/spec/frontend/work_items/components/work_item_detail_spec.js b/spec/frontend/work_items/components/work_item_detail_spec.js
index 46189850e09..1d164648e27 100644
--- a/spec/frontend/work_items/components/work_item_detail_spec.js
+++ b/spec/frontend/work_items/components/work_item_detail_spec.js
@@ -26,6 +26,7 @@ import WorkItemMilestone from '~/work_items/components/work_item_milestone.vue';
 import WorkItemTree from '~/work_items/components/work_item_links/work_item_tree.vue';
 import WorkItemNotes from '~/work_items/components/work_item_notes.vue';
 import WorkItemDetailModal from '~/work_items/components/work_item_detail_modal.vue';
+import AbuseCategorySelector from '~/abuse_reports/components/abuse_category_selector.vue';
 import { i18n } from '~/work_items/constants';
 import workItemByIidQuery from '~/work_items/graphql/work_item_by_iid.query.graphql';
 import workItemDatesSubscription from '~/graphql_shared/subscriptions/work_item_dates.subscription.graphql';
@@ -43,6 +44,7 @@ import {
   workItemAssigneesSubscriptionResponse,
   workItemMilestoneSubscriptionResponse,
   objectiveType,
+  mockWorkItemCommentNote,
 } from '../mock_data';
 
 describe('WorkItemDetail component', () => {
@@ -88,6 +90,7 @@ describe('WorkItemDetail component', () => {
   const findHierarchyTree = () => wrapper.findComponent(WorkItemTree);
   const findNotesWidget = () => wrapper.findComponent(WorkItemNotes);
   const findModal = () => wrapper.findComponent(WorkItemDetailModal);
+  const findAbuseCategorySelector = () => wrapper.findComponent(AbuseCategorySelector);
 
   const createComponent = ({
     isModal = false,
@@ -128,6 +131,7 @@ describe('WorkItemDetail component', () => {
         hasIssuableHealthStatusFeature: true,
         projectNamespace: 'namespace',
         fullPath: 'group/project',
+        reportAbusePath: '/report/abuse/path',
       },
       stubs: {
         WorkItemWeight: true,
@@ -725,4 +729,30 @@ describe('WorkItemDetail component', () => {
 
     expect(findCreatedUpdated().exists()).toBe(true);
   });
+
+  describe('abuse category selector', () => {
+    beforeEach(async () => {
+      setWindowLocation('?work_item_id=2');
+      createComponent();
+      await waitForPromises();
+    });
+
+    it('should not be visible by default', () => {
+      expect(findAbuseCategorySelector().exists()).toBe(false);
+    });
+
+    it('should be visible when the work item modal emits `openReportAbuse` event', async () => {
+      findModal().vm.$emit('openReportAbuse', mockWorkItemCommentNote);
+
+      await nextTick();
+
+      expect(findAbuseCategorySelector().exists()).toBe(true);
+
+      findAbuseCategorySelector().vm.$emit('close-drawer');
+
+      await nextTick();
+
+      expect(findAbuseCategorySelector().exists()).toBe(false);
+    });
+  });
 });
diff --git a/spec/frontend/work_items/components/work_item_links/work_item_links_spec.js b/spec/frontend/work_items/components/work_item_links/work_item_links_spec.js
index efa08ced3ad..4bf7d0c57a3 100644
--- a/spec/frontend/work_items/components/work_item_links/work_item_links_spec.js
+++ b/spec/frontend/work_items/components/work_item_links/work_item_links_spec.js
@@ -12,6 +12,7 @@ import WidgetWrapper from '~/work_items/components/widget_wrapper.vue';
 import WorkItemLinks from '~/work_items/components/work_item_links/work_item_links.vue';
 import WorkItemLinkChild from '~/work_items/components/work_item_links/work_item_link_child.vue';
 import WorkItemDetailModal from '~/work_items/components/work_item_detail_modal.vue';
+import AbuseCategorySelector from '~/abuse_reports/components/abuse_category_selector.vue';
 import { FORM_TYPES } from '~/work_items/constants';
 import workItemQuery from '~/work_items/graphql/work_item.query.graphql';
 import changeWorkItemParentMutation from '~/work_items/graphql/update_work_item.mutation.graphql';
@@ -25,6 +26,7 @@ import {
   changeWorkItemParentMutationResponse,
   workItemQueryResponse,
   projectWorkItemResponse,
+  mockWorkItemCommentNote,
 } from '../../mock_data';
 
 Vue.use(VueApollo);
@@ -76,6 +78,7 @@ describe('WorkItemLinks', () => {
       provide: {
         projectPath: 'project/path',
         hasIterationsFeature,
+        reportAbusePath: '/report/abuse/path',
       },
       propsData: { issuableId: 1 },
       apolloProvider: mockApollo,
@@ -105,6 +108,8 @@ describe('WorkItemLinks', () => {
   const findFirstWorkItemLinkChild = () => findWorkItemLinkChildItems().at(0);
   const findAddLinksForm = () => wrapper.findByTestId('add-links-form');
   const findChildrenCount = () => wrapper.findByTestId('children-count');
+  const findWorkItemDetailModal = () => wrapper.findComponent(WorkItemDetailModal);
+  const findAbuseCategorySelector = () => wrapper.findComponent(AbuseCategorySelector);
 
   afterEach(() => {
     mockApollo = null;
@@ -328,7 +333,7 @@ describe('WorkItemLinks', () => {
     await createComponent();
 
     expect(showModal).not.toHaveBeenCalled();
-    expect(wrapper.findComponent(WorkItemDetailModal).props('workItemIid')).toBe(null);
+    expect(findWorkItemDetailModal().props('workItemIid')).toBe(null);
   });
 
   it('opens the modal if work item iid URL parameter is found in child items', async () => {
@@ -336,6 +341,31 @@ describe('WorkItemLinks', () => {
     await createComponent();
 
     expect(showModal).toHaveBeenCalled();
-    expect(wrapper.findComponent(WorkItemDetailModal).props('workItemIid')).toBe('2');
+    expect(findWorkItemDetailModal().props('workItemIid')).toBe('2');
+  });
+
+  describe('abuse category selector', () => {
+    beforeEach(async () => {
+      setWindowLocation('?work_item_id=2');
+      await createComponent();
+    });
+
+    it('should not be visible by default', () => {
+      expect(findAbuseCategorySelector().exists()).toBe(false);
+    });
+
+    it('should be visible when the work item modal emits `openReportAbuse` event', async () => {
+      findWorkItemDetailModal().vm.$emit('openReportAbuse', mockWorkItemCommentNote);
+
+      await nextTick();
+
+      expect(findAbuseCategorySelector().exists()).toBe(true);
+
+      findAbuseCategorySelector().vm.$emit('close-drawer');
+
+      await nextTick();
+
+      expect(findAbuseCategorySelector().exists()).toBe(false);
+    });
   });
 });
diff --git a/spec/frontend/work_items/components/work_item_notes_spec.js b/spec/frontend/work_items/components/work_item_notes_spec.js
index 3cc6a9813fc..7dbf828c44a 100644
--- a/spec/frontend/work_items/components/work_item_notes_spec.js
+++ b/spec/frontend/work_items/components/work_item_notes_spec.js
@@ -97,6 +97,7 @@ describe('WorkItemNotes component', () => {
     workItemIid = mockWorkItemIid,
     defaultWorkItemNotesQueryHandler = workItemNotesQueryHandler,
     deleteWINoteMutationHandler = deleteWorkItemNoteMutationSuccessHandler,
+    isModal = false,
   } = {}) => {
     wrapper = shallowMount(WorkItemNotes, {
       apolloProvider: createMockApollo([
@@ -116,6 +117,8 @@ describe('WorkItemNotes component', () => {
         fullPath: 'test-path',
         fetchByIid,
         workItemType: 'task',
+        reportAbusePath: '/report/abuse/path',
+        isModal,
       },
       stubs: {
         GlModal: stubComponent(GlModal, { methods: { show: showModal } }),
diff --git a/spec/frontend/work_items/router_spec.js b/spec/frontend/work_items/router_spec.js
index 988fdc301de..86e890ea809 100644
--- a/spec/frontend/work_items/router_spec.js
+++ b/spec/frontend/work_items/router_spec.js
@@ -74,6 +74,7 @@ describe('Work items router', () => {
         hasIterationsFeature: false,
         hasOkrsFeature: false,
         hasIssuableHealthStatusFeature: false,
+        reportAbusePath: '/report/abuse/path',
       },
       stubs: {
         WorkItemWeight: true,