Fix auditor user able to bulk select vulns on vulnerability report

Changelog: fixed
MR:
EE: true

ee/app/assets/javascripts/security_dashboard/components/shared/vulnerability_report/vulnerability_list.vue

@@ -19,6 +19,7 @@ import RemediatedBadge from 'ee/vulnerabilities/components/remediated_badge.vue'
 import { VULNERABILITY_STATES } from 'ee/vulnerabilities/constants';
 import { formatDate } from '~/lib/utils/datetime_utility';
 import { convertToSnakeCase } from '~/lib/utils/text_utility';
+import { FIELDS } from 'ee/security_dashboard/components/shared/vulnerability_report/constants';
 import AutoFixHelpText from '../auto_fix_help_text.vue';
 import IssuesBadge from '../issues_badge.vue';
 import SelectionSummary from '../selection_summary.vue';
@@ -49,6 +50,9 @@ export default {
     hasVulnerabilities: {
       default: false,
     },
+    canAdminVulnerability: {
+      default: false,
+    },
     hasJiraVulnerabilitiesIntegrationEnabled: {
       default: false,
     },
@@ -81,6 +85,10 @@ export default {
     };
   },
   computed: {
+    displayFields() {
+      // Add the checkbox field if the user can use the bulk select feature.
+      return this.canAdminVulnerability ? [FIELDS.CHECKBOX, ...this.fields] : this.fields;
+    },
     hasAnyScannersOtherThanGitLab() {
       return this.vulnerabilities.some(
         (v) => v.scanner?.vendor !== 'GitLab' && v.scanner?.vendor !== '',
@@ -176,6 +184,11 @@ export default {
       }
     },
     toggleVulnerability(vulnerability) {
+      // If the user can't use the bulk select feature (like the auditor user), don't do anything.
+      if (!this.canAdminVulnerability) {
+        return;
+      }
+
       if (this.selectedVulnerabilities[vulnerability.id]) {
         this.$delete(this.selectedVulnerabilities, `${vulnerability.id}`);
       } else {
@@ -237,7 +250,7 @@ export default {
     />
     <gl-table
       :busy="isLoading"
-      :fields="fields"
+      :fields="displayFields"
       :items="vulnerabilities"
       :thead-class="theadClass"
       :sort-desc="sortDesc"
@@ -249,7 +262,7 @@ export default {
       responsive
       hover
       primary-key="id"
-      :tbody-tr-class="{ 'gl-cursor-pointer': vulnerabilities.length }"
+      :tbody-tr-class="{ 'gl-cursor-pointer': canAdminVulnerability }"
       head-variant="white"
       @sort-changed="handleSortChange"
       @row-clicked="toggleVulnerability"
@@ -372,8 +385,8 @@ export default {
       </template>
 
       <template #empty>
-        <filters-produced-no-results v-if="hasVulnerabilities && !isLoading" />
-        <dashboard-has-no-vulnerabilities v-else-if="!isLoading" />
+        <filters-produced-no-results v-if="hasVulnerabilities" class="gl-cursor-default" />
+        <dashboard-has-no-vulnerabilities v-else class="gl-cursor-default" />
       </template>
     </gl-table>
   </div>

ee/app/assets/javascripts/security_dashboard/components/shared/vulnerability_report/vulnerability_report.vue

@@ -4,7 +4,6 @@ import VulnerabilityCounts from './vulnerability_counts.vue';
 import VulnerabilityListGraphql from './vulnerability_list_graphql.vue';
 import VulnerabilityFilters from './vulnerability_filters.vue';
 import {
-  FIELDS,
   FILTERS,
   FIELD_PRESETS,
   FILTER_PRESETS,
@@ -18,7 +17,7 @@ export default {
     VulnerabilityListGraphql,
     VulnerabilityFilters,
   },
-  inject: ['dashboardType', 'canAdminVulnerability'],
+  inject: ['dashboardType'],
   props: {
     type: {
       type: String,
@@ -53,11 +52,7 @@ export default {
       return [...FILTER_PRESETS[type], ...(this.showProjectFilter ? [FILTERS.PROJECT] : [])];
     },
     fieldsToShow() {
-      return [
-        // Add the checkbox field if the user can use the bulk select feature.
-        ...(this.canAdminVulnerability ? [FIELDS.CHECKBOX] : []),
-        ...FIELD_PRESETS[this.type],
-      ];
+      return FIELD_PRESETS[this.type];
     },
   },
   methods: {

ee/spec/frontend/security_dashboard/components/shared/vulnerability_report/vulnerability_list_spec.js

@@ -14,7 +14,7 @@ import { mountExtended } from 'helpers/vue_test_utils_helper';
 import { FIELDS } from 'ee/security_dashboard/components/shared/vulnerability_report/constants';
 import { generateVulnerabilities, vulnerabilities } from '../../mock_data';
 
-const { CHECKBOX, DETECTED, STATUS, SEVERITY, DESCRIPTION, IDENTIFIER, TOOL, ACTIVITY } = FIELDS;
+const { DETECTED, STATUS, SEVERITY, DESCRIPTION, IDENTIFIER, TOOL, ACTIVITY } = FIELDS;
 
 describe('Vulnerability list component', () => {
   let wrapper;
@@ -23,7 +23,7 @@ describe('Vulnerability list component', () => {
     wrapper = mountExtended(VulnerabilityList, {
       propsData: {
         vulnerabilities: [],
-        fields: [CHECKBOX, DETECTED, STATUS, SEVERITY, DESCRIPTION, IDENTIFIER, TOOL, ACTIVITY],
+        fields: [DETECTED, STATUS, SEVERITY, DESCRIPTION, IDENTIFIER, TOOL, ACTIVITY],
         ...props,
       },
       stubs: {
@@ -205,6 +205,30 @@ describe('Vulnerability list component', () => {
     );
   });
 
+  describe('when user has no permission to admin vulnerabilities', () => {
+    beforeEach(() => {
+      createWrapper({
+        props: { vulnerabilities },
+        provide: { canAdminVulnerability: false },
+      });
+    });
+
+    it('should not show the checkboxes', () => {
+      expect(findDataCell('vulnerability-checkbox-all').exists()).toBe(false);
+      expect(findDataCell('vulnerability-checkbox').exists()).toBe(false);
+    });
+
+    it('should not select a clicked vulnerability', async () => {
+      findRow(1).trigger('click');
+      await wrapper.vm.$nextTick();
+
+      expect(findSelectionSummary().props()).toMatchObject({
+        visible: false,
+        selectedVulnerabilities: [],
+      });
+    });
+  });
+
   describe('when displayed on instance or group level dashboard', () => {
     let newVulnerabilities;
 
@@ -580,7 +604,10 @@ describe('Vulnerability list component', () => {
   describe('fields prop', () => {
     it('shows the expected columns in the table', () => {
       const fields = [STATUS, SEVERITY];
-      createWrapper({ props: { fields, vulnerabilities } });
+      createWrapper({
+        props: { fields, vulnerabilities },
+        provide: { canAdminVulnerability: false },
+      });
 
       // Check that there are only 2 columns.
       expect(findRow().element.cells).toHaveLength(2);

ee/spec/frontend/security_dashboard/components/shared/vulnerability_report/vulnerability_report_spec.js

@@ -8,7 +8,6 @@ import projectVulnerabilitiesQuery from 'ee/security_dashboard/graphql/queries/p
 import { DASHBOARD_TYPES } from 'ee/security_dashboard/store/constants';
 import {
   FIELD_PRESETS,
-  FIELDS,
   FILTER_PRESETS,
   REPORT_TAB,
   REPORT_TYPE_PRESETS,
@@ -107,12 +106,6 @@ describe('Vulnerability report component', () => {
       expect(findVulnerabilityListGraphql().props('fields')).toEqual(expectedFields);
     });
 
-    it('gets passed the checkbox field if the user can admin vulnerability', () => {
-      createWrapper({ canAdminVulnerability: true });
-
-      expect(findVulnerabilityListGraphql().props('fields')).toContainEqual(FIELDS.CHECKBOX);
-    });
-
     it.each([true, false])(
       'gets passed the expected value for the should show project namespace prop',
       (showProjectFilter) => {