Merge branch 'remove-project' into 'master'

Button migration in security dashboard

Closes #219849

See merge request gitlab-org/gitlab!38741

ee/app/assets/javascripts/security_dashboard/components/first_class_project_manager/project_list.vue

 <script>
 import {
   GlDeprecatedBadge as GlBadge,
-  GlDeprecatedButton,
+  GlButton,
   GlLoadingIcon,
   GlTooltipDirective,
 } from '@gitlab/ui';
-import Icon from '~/vue_shared/components/icon.vue';
 import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
 
 export default {
   components: {
     GlBadge,
-    GlDeprecatedButton,
+    GlButton,
     GlLoadingIcon,
-    Icon,
     ProjectAvatar,
   },
   directives: {
@@ -55,14 +53,13 @@ export default {
           <span>
             {{ project.name_with_namespace || project.nameWithNamespace }}
           </span>
-          <gl-deprecated-button
+          <gl-button
             v-gl-tooltip
-            class="ml-auto bg-transparent border-0 p-0 text-secondary js-projects-list-project-remove"
+            icon="remove"
+            class="gl-ml-auto js-projects-list-project-remove"
             :title="s__('SecurityReports|Remove project from dashboard')"
             @click="projectRemoved(project)"
-          >
-            <icon name="remove" />
-          </gl-deprecated-button>
+          />
         </li>
       </ul>
       <p v-else class="text-secondary js-projects-list-empty-message">

ee/changelogs/unreleased/remove-project.yml

+---
+title: Button migration to component
+merge_request:
+author:
+type: changed

ee/spec/frontend/security_dashboard/components/first_class_project_manager/project_list_spec.js

 import { shallowMount } from '@vue/test-utils';
 
-import { GlDeprecatedBadge as GlBadge, GlDeprecatedButton, GlLoadingIcon } from '@gitlab/ui';
+import { GlDeprecatedBadge as GlBadge, GlButton, GlLoadingIcon } from '@gitlab/ui';
 import ProjectList from 'ee/security_dashboard/components/first_class_project_manager/project_list.vue';
 import ProjectAvatar from '~/vue_shared/components/project_avatar/default.vue';
 
@@ -96,7 +96,7 @@ describe('Project List component', () => {
     const mockProjects = generateMockProjects(1);
     const [projectData] = mockProjects;
 
-    factory({ projects: mockProjects, stubs: { GlDeprecatedButton } });
+    factory({ projects: mockProjects, stubs: { GlButton } });
 
     getFirstRemoveButton().vm.$emit('click');