Merge branch '350371-pipeline-status-badge-pajamas' into 'master'

Make badge in pipeline-status-badge Pajamas compliant

See merge request gitlab-org/gitlab!78464

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

 <script>
-import { GlBadge, GlIcon } from '@gitlab/ui';
+import { GlBadge } from '@gitlab/ui';
 
 export default {
-  components: { GlBadge, GlIcon },
+  components: { GlBadge },
   props: {
     pipeline: {
       type: Object,
@@ -24,8 +24,7 @@ export default {
 </script>
 
 <template>
-  <gl-badge v-if="shouldShow" variant="danger" :href="failedPath">
-    <gl-icon name="status_failed" class="gl-mr-2" />
+  <gl-badge v-if="shouldShow" icon="status_failed" variant="danger" :href="failedPath">
     {{ n__('%d failed security job', '%d failed security jobs', failedCount) }}
   </gl-badge>
 </template>

ee/spec/frontend/security_dashboard/components/shared/pipeline_status_badge_spec.js

-import { GlBadge, GlIcon } from '@gitlab/ui';
+import { GlBadge } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import { merge } from 'lodash';
 import PipelineStatusBadge from 'ee/security_dashboard/components/shared/pipeline_status_badge.vue';
@@ -9,7 +9,6 @@ describe('Pipeline status badge', () => {
   const securityBuildsFailedPath = '/some/path/to/failed/jobs';
 
   const findGlBadge = () => wrapper.find(GlBadge);
-  const findGlIcon = () => wrapper.find(GlIcon);
 
   const createProps = (securityBuildsFailedCount) => ({ pipeline: { securityBuildsFailedCount } });
 
@@ -46,13 +45,11 @@ describe('Pipeline status badge', () => {
     it('does not display when there are 0 failed jobs', () => {
       createWrapper(createProps(0));
       expect(findGlBadge().exists()).toBe(false);
-      expect(findGlIcon().exists()).toBe(false);
     });
 
     it('does not display when there is no failed jobs count', () => {
       createWrapper();
       expect(findGlBadge().exists()).toBe(false);
-      expect(findGlIcon().exists()).toBe(false);
     });
   });
 });