Apply filters to vuln count list

- Update tests
- Add changelog

ee/app/assets/javascripts/security_dashboard/components/first_class_project_security_dashboard.vue

@@ -61,7 +61,7 @@ export default {
             <h4 class="flex-grow mt-0 mb-0">{{ __('Vulnerabilities') }}</h4>
             <csv-export-button :vulnerabilities-export-endpoint="vulnerabilitiesExportEndpoint" />
           </div>
-          <vulnerabilities-count-list :project-full-path="projectFullPath" />
+          <vulnerabilities-count-list :project-full-path="projectFullPath" :filters="filters" />
         </template>
         <template #sticky>
           <filters @filterChange="handleFilterChange" />

ee/app/assets/javascripts/security_dashboard/components/vulnerability_count_list.vue

@@ -11,6 +11,11 @@ export default {
       type: String,
       required: true,
     },
+    filters: {
+      type: Object,
+      required: false,
+      default: () => ({}),
+    },
   },
   data: () => ({
     queryError: false,
@@ -25,7 +30,10 @@ export default {
     vulnerabilitiesCount: {
       query: vulnerabilitySeveritiesCountQuery,
       variables() {
-        return { fullPath: this.projectFullPath };
+        return {
+          fullPath: this.projectFullPath,
+          ...this.filters,
+        };
       },
       update: ({ project }) => project.vulnerabilitySeveritiesCount,
       result() {

ee/app/assets/javascripts/security_dashboard/graphql/project_vulnerability_severities_count.graphql

-query vulnerabilitySeveritiesCount($fullPath: ID!) {
+query vulnerabilitySeveritiesCount(
+  $fullPath: ID!
+  $severity: [VulnerabilitySeverity!]
+  $reportType: [VulnerabilityReportType!]
+  $scanner: [String!]
+  $state: [VulnerabilityState!]
+) {
   project(fullPath: $fullPath) {
-    vulnerabilitySeveritiesCount {
+    vulnerabilitySeveritiesCount(
+      severity: $severity
+      reportType: $reportType
+      scanner: $scanner
+      state: $state
+    ) {
       critical
       high
       low

ee/changelogs/unreleased/231400-update-severity-counts-to-match-filters.yml

+---
+title: Apply filters to vulnerability count list
+merge_request: 41566
+author:
+type: changed

ee/spec/frontend/security_dashboard/components/first_class_project_security_dashboard_spec.js

@@ -4,6 +4,7 @@ import FirstClassProjectSecurityDashboard from 'ee/security_dashboard/components
 import Filters from 'ee/security_dashboard/components/first_class_vulnerability_filters.vue';
 import SecurityDashboardLayout from 'ee/security_dashboard/components/security_dashboard_layout.vue';
 import ProjectVulnerabilitiesApp from 'ee/security_dashboard/components/project_vulnerabilities.vue';
+import VulnerabilityCountList from 'ee/security_dashboard/components/vulnerability_count_list.vue';
 import ReportsNotConfigured from 'ee/security_dashboard/components/empty_states/reports_not_configured.vue';
 import CsvExportButton from 'ee/security_dashboard/components/csv_export_button.vue';
 
@@ -27,6 +28,7 @@ describe('First class Project Security Dashboard component', () => {
 
   const findFilters = () => wrapper.find(Filters);
   const findVulnerabilities = () => wrapper.find(ProjectVulnerabilitiesApp);
+  const findVulnerabilityCountList = () => wrapper.find(VulnerabilityCountList);
   const findUnconfiguredState = () => wrapper.find(ReportsNotConfigured);
   const findCsvExportButton = () => wrapper.find(CsvExportButton);
 
@@ -49,15 +51,28 @@ describe('First class Project Security Dashboard component', () => {
 
   describe('on render when there are vulnerabilities', () => {
     beforeEach(() => {
-      createComponent({ props: { hasVulnerabilities: true } });
+      createComponent({
+        props: { hasVulnerabilities: true },
+        data: () => ({ filters }),
+      });
     });
 
     it('should render the vulnerabilities', () => {
       expect(findVulnerabilities().exists()).toBe(true);
     });
 
-    it('should pass down the "projectFullPath" prop to the vulnerabilities', () => {
-      expect(findVulnerabilities().props('projectFullPath')).toBe(props.projectFullPath);
+    it('should pass down the properties correctly to the vulnerabilities', () => {
+      expect(findVulnerabilities().props()).toEqual({
+        projectFullPath: props.projectFullPath,
+        filters,
+      });
+    });
+
+    it('should pass down the properties correctly to the vulnerability count list', () => {
+      expect(findVulnerabilityCountList().props()).toEqual({
+        projectFullPath: props.projectFullPath,
+        filters,
+      });
     });
 
     it('should render the filters component', () => {