Merge branch '284471-standard-filter-rename-simple-filter' into 'master'

Rename standard_filter.vue to simple_filter.vue

See merge request gitlab-org/gitlab!65616

ee/app/assets/javascripts/security_dashboard/components/pipeline/filters.vue

 <script>
 import { GlToggle } from '@gitlab/ui';
 import { mapState, mapActions } from 'vuex';
-import { severityFilter, standardScannerFilter } from 'ee/security_dashboard/helpers';
+import { severityFilter, simpleScannerFilter } from 'ee/security_dashboard/helpers';
 import { DISMISSAL_STATES } from 'ee/security_dashboard/store/modules/filters/constants';
 import { s__ } from '~/locale';
-import StandardFilter from '../shared/filters/standard_filter.vue';
+import SimpleFilter from '../shared/filters/simple_filter.vue';
 
 export default {
   i18n: {
     toggleLabel: s__('SecurityReports|Hide dismissed'),
   },
   components: {
-    StandardFilter,
+    SimpleFilter,
     GlToggle,
   },
   data() {
     return {
-      filterConfigs: [severityFilter, standardScannerFilter],
+      filterConfigs: [severityFilter, simpleScannerFilter],
     };
   },
   computed: {
@@ -39,7 +39,7 @@ export default {
 <template>
   <div class="dashboard-filters border-bottom bg-gray-light">
     <div class="row mx-0 p-2">
-      <standard-filter
+      <simple-filter
         v-for="filter in filterConfigs"
         :key="filter.id"
         class="col-sm-6 col-md-4 col-lg-2 p-2 js-filter"

ee/app/assets/javascripts/security_dashboard/components/shared/filters/activity_filter.vue

@@ -4,13 +4,13 @@ import { xor, remove } from 'lodash';
 import { activityOptions } from 'ee/security_dashboard/helpers';
 import FilterBody from './filter_body.vue';
 import FilterItem from './filter_item.vue';
-import StandardFilter from './standard_filter.vue';
+import SimpleFilter from './simple_filter.vue';
 
 const { NO_ACTIVITY, WITH_ISSUES, NO_LONGER_DETECTED } = activityOptions;
 
 export default {
   components: { FilterBody, FilterItem, GlDropdownDivider },
-  extends: StandardFilter,
+  extends: SimpleFilter,
   computed: {
     filterObject() {
       // This is the object used to update the GraphQL query.

ee/app/assets/javascripts/security_dashboard/components/shared/filters/filters_layout.vue

@@ -4,17 +4,17 @@ import {
   stateFilter,
   severityFilter,
   vendorScannerFilter,
-  standardScannerFilter,
+  simpleScannerFilter,
   activityFilter,
   getProjectFilter,
 } from 'ee/security_dashboard/helpers';
 import { DASHBOARD_TYPES } from 'ee/security_dashboard/store/constants';
 import ActivityFilter from './activity_filter.vue';
 import ScannerFilter from './scanner_filter.vue';
-import StandardFilter from './standard_filter.vue';
+import SimpleFilter from './simple_filter.vue';
 
 export default {
-  components: { StandardFilter, ScannerFilter, ActivityFilter },
+  components: { SimpleFilter, ScannerFilter, ActivityFilter },
   inject: ['dashboardType'],
   props: {
     projects: { type: Array, required: false, default: undefined },
@@ -22,7 +22,6 @@ export default {
   data() {
     return {
       filterQuery: {},
-      standardFilters: [stateFilter, severityFilter],
     };
   },
   computed: {
@@ -44,14 +43,16 @@ export default {
       this.filterQuery = { ...this.filterQuery, ...query };
       this.emitFilterChange();
     },
-    // When this component is first shown, every filter will emit its own @filter-changed event at,
-    // which will trigger this method multiple times. We'll debounce it so that it only runs once.
+    // When this component is first shown, every filter will emit its own @filter-changed event at
+    // the same time, which will trigger this method multiple times. We'll debounce it so that it
+    // only runs once.
     emitFilterChange: debounce(function emit() {
       this.$emit('filterChange', this.filterQuery);
     }),
   },
+  simpleFilters: [stateFilter, severityFilter],
   vendorScannerFilter,
-  standardScannerFilter,
+  simpleScannerFilter,
   activityFilter,
 };
 </script>
@@ -60,8 +61,8 @@ export default {
   <div
     class="vulnerability-report-filters gl-p-5 gl-bg-gray-10 gl-border-b-1 gl-border-b-solid gl-border-b-gray-100"
   >
-    <standard-filter
-      v-for="filter in standardFilters"
+    <simple-filter
+      v-for="filter in $options.simpleFilters"
       :key="filter.id"
       :filter="filter"
       :data-testid="filter.id"
@@ -73,10 +74,10 @@ export default {
       :filter="$options.vendorScannerFilter"
       @filter-changed="updateFilterQuery"
     />
-    <standard-filter
+    <simple-filter
       v-else
-      :filter="$options.standardScannerFilter"
-      :data-testid="$options.standardScannerFilter.id"
+      :filter="$options.simpleScannerFilter"
+      :data-testid="$options.simpleScannerFilter.id"
       @filter-changed="updateFilterQuery"
     />
 
@@ -85,7 +86,7 @@ export default {
       :filter="$options.activityFilter"
       @filter-changed="updateFilterQuery"
     />
-    <standard-filter
+    <simple-filter
       v-if="shouldShowProjectFilter"
       :filter="projectFilter"
       :data-testid="projectFilter.id"

ee/app/assets/javascripts/security_dashboard/components/shared/filters/scanner_filter.vue

@@ -5,7 +5,7 @@ import { DEFAULT_SCANNER, SCANNER_ID_PREFIX } from 'ee/security_dashboard/consta
 import { createScannerOption } from 'ee/security_dashboard/helpers';
 import FilterBody from './filter_body.vue';
 import FilterItem from './filter_item.vue';
-import StandardFilter from './standard_filter.vue';
+import SimpleFilter from './simple_filter.vue';
 
 export default {
   components: {
@@ -15,7 +15,7 @@ export default {
     FilterBody,
     FilterItem,
   },
-  extends: StandardFilter,
+  extends: SimpleFilter,
   inject: ['scanners'],
   computed: {
     options() {

ee/app/assets/javascripts/security_dashboard/helpers.js

@@ -46,7 +46,7 @@ export const createScannerOption = (vendor, reportType) => {
 // This is used on the pipeline security tab, group-level report, and instance-level report. It's
 // used by the scanner filter that shows a flat list of scan types (DAST, SAST, etc) with no vendor
 // grouping.
-export const standardScannerFilter = {
+export const simpleScannerFilter = {
   name: s__('SecurityReports|Scanner'),
   id: 'reportType',
   options: parseOptions(REPORT_TYPES),

ee/spec/frontend/security_dashboard/components/pipeline/filters_spec.js

@@ -2,7 +2,7 @@ import { GlToggle } from '@gitlab/ui';
 import { shallowMount, mount, createLocalVue } from '@vue/test-utils';
 import Vuex from 'vuex';
 import Filters from 'ee/security_dashboard/components/pipeline/filters.vue';
-import { standardScannerFilter } from 'ee/security_dashboard/helpers';
+import { simpleScannerFilter } from 'ee/security_dashboard/helpers';
 import createStore from 'ee/security_dashboard/store';
 import state from 'ee/security_dashboard/store/modules/filters/state';
 import { extendedWrapper } from 'helpers/vue_test_utils_helper';
@@ -75,8 +75,8 @@ describe('Filter component', () => {
       // scanner filter item.
       mock.mockClear();
 
-      const filterId = standardScannerFilter.id;
-      const optionId = standardScannerFilter.options[2].id;
+      const filterId = simpleScannerFilter.id;
+      const optionId = simpleScannerFilter.options[2].id;
       const option = wrapper.findByTestId(`${filterId}:${optionId}`);
       option.vm.$emit('click');
       await wrapper.vm.$nextTick();

ee/spec/frontend/security_dashboard/components/shared/filters/filters_layout_spec.js

@@ -2,8 +2,8 @@ import { shallowMount } from '@vue/test-utils';
 import ActivityFilter from 'ee/security_dashboard/components/shared/filters/activity_filter.vue';
 import Filters from 'ee/security_dashboard/components/shared/filters/filters_layout.vue';
 import ScannerFilter from 'ee/security_dashboard/components/shared/filters/scanner_filter.vue';
-import StandardFilter from 'ee/security_dashboard/components/shared/filters/standard_filter.vue';
-import { getProjectFilter, standardScannerFilter } from 'ee/security_dashboard/helpers';
+import SimpleFilter from 'ee/security_dashboard/components/shared/filters/simple_filter.vue';
+import { getProjectFilter, simpleScannerFilter } from 'ee/security_dashboard/helpers';
 import { DASHBOARD_TYPES } from 'ee/security_dashboard/store/constants';
 import { extendedWrapper } from 'helpers/vue_test_utils_helper';
 
@@ -15,8 +15,8 @@ describe('First class vulnerability filters component', () => {
     { id: 'gid://gitlab/Project/12', name: 'GitLab Com' },
   ];
 
-  const findStandardFilters = () => wrapper.findAllComponents(StandardFilter);
-  const findStandardScannerFilter = () => wrapper.findByTestId(standardScannerFilter.id);
+  const findSimpleFilters = () => wrapper.findAllComponents(SimpleFilter);
+  const findSimpleScannerFilter = () => wrapper.findByTestId(simpleScannerFilter.id);
   const findVendorScannerFilter = () => wrapper.findComponent(ScannerFilter);
   const findActivityFilter = () => wrapper.findComponent(ActivityFilter);
   const findProjectFilter = () => wrapper.findByTestId(getProjectFilter([]).id);
@@ -43,7 +43,7 @@ describe('First class vulnerability filters component', () => {
     });
 
     it('should render the default filters', () => {
-      expect(findStandardFilters()).toHaveLength(2);
+      expect(findSimpleFilters()).toHaveLength(2);
       expect(findActivityFilter().exists()).toBe(true);
       expect(findProjectFilter().exists()).toBe(false);
     });
@@ -85,15 +85,15 @@ describe('First class vulnerability filters component', () => {
 
   describe('scanner filter', () => {
     it.each`
-      type          | dashboardType
-      ${'vendor'}   | ${DASHBOARD_TYPES.PROJECT}
-      ${'standard'} | ${DASHBOARD_TYPES.GROUP}
-      ${'standard'} | ${DASHBOARD_TYPES.INSTANCE}
-      ${'standard'} | ${DASHBOARD_TYPES.PIPELINE}
+      type        | dashboardType
+      ${'vendor'} | ${DASHBOARD_TYPES.PROJECT}
+      ${'simple'} | ${DASHBOARD_TYPES.GROUP}
+      ${'simple'} | ${DASHBOARD_TYPES.INSTANCE}
+      ${'simple'} | ${DASHBOARD_TYPES.PIPELINE}
     `('shows the $type scanner filter on the $dashboardType report', ({ type, dashboardType }) => {
       wrapper = createComponent({ provide: { dashboardType } });
 
-      expect(findStandardScannerFilter().exists()).toBe(type === 'standard');
+      expect(findSimpleScannerFilter().exists()).toBe(type === 'simple');
       expect(findVendorScannerFilter().exists()).toBe(type === 'vendor');
     });
   });

ee/spec/frontend/security_dashboard/components/shared/filters/standard_filter_spec.js → ee/spec/frontend/security_dashboard/components/shared/filters/simple_filter_spec.js

 import { createLocalVue, shallowMount } from '@vue/test-utils';
 import VueRouter from 'vue-router';
 import FilterBody from 'ee/security_dashboard/components/shared/filters/filter_body.vue';
-import StandardFilter from 'ee/security_dashboard/components/shared/filters/standard_filter.vue';
+import SimpleFilter from 'ee/security_dashboard/components/shared/filters/simple_filter.vue';
 
 const localVue = createLocalVue();
 localVue.use(VueRouter);
@@ -20,11 +20,11 @@ const filter = {
 const optionsAt = (indexes) => filter.options.filter((x) => indexes.includes(x.index));
 const optionIdsAt = (indexes) => optionsAt(indexes).map((x) => x.id);
 
-describe('Standard Filter component', () => {
+describe('Simple Filter component', () => {
   let wrapper;
 
   const createWrapper = (filterOptions, props) => {
-    wrapper = shallowMount(StandardFilter, {
+    wrapper = shallowMount(SimpleFilter, {
       localVue,
       router,
       propsData: { filter: { ...filter, ...filterOptions }, ...props },

qa/qa/ee/page/component/secure_report.rb

@@ -11,7 +11,7 @@ module QA
             super
 
             base.class_eval do
-              view 'ee/app/assets/javascripts/security_dashboard/components/filters/standard_filter.vue' do
+              view 'ee/app/assets/javascripts/security_dashboard/components/filters/simple_filter.vue' do
                 element :filter_dropdown, ':data-qa-selector="qaSelector"' # rubocop:disable QA/ElementWithPattern
                 element :filter_dropdown_content
               end