Merge branch '229294-issueboard-remove-issue' into 'master'

Migrate issue board remove issue bs button to GlButton

Closes #229294

See merge request gitlab-org/gitlab!39399

app/assets/javascripts/boards/components/sidebar/remove_issue.vue

@@ -3,8 +3,12 @@ import axios from '~/lib/utils/axios_utils';
 import Flash from '../../../flash';
 import { __ } from '../../../locale';
 import boardsStore from '../../stores/boards_store';
+import { GlButton } from '@gitlab/ui';
 
 export default {
+  components: {
+    GlButton,
+  },
   props: {
     issue: {
       type: Object,
@@ -75,8 +79,8 @@ export default {
 </script>
 <template>
   <div class="block list">
-    <button class="btn btn-default btn-block" type="button" @click="removeIssue">
+    <gl-button variant="default" category="secondary" block="block" @click="removeIssue">
       {{ __('Remove from board') }}
-    </button>
+    </gl-button>
   </div>
 </template>

spec/frontend/boards/components/sidebar/remove_issue_spec.js

+import { shallowMount } from '@vue/test-utils';
+import { GlButton } from '@gitlab/ui';
+
+import RemoveIssue from '~/boards/components/sidebar/remove_issue.vue';
+
+describe('boards sidebar remove issue', () => {
+  let wrapper;
+
+  const findButton = () => wrapper.find(GlButton);
+
+  const createComponent = propsData => {
+    wrapper = shallowMount(RemoveIssue, {
+      propsData: {
+        issue: {},
+        list: {},
+        ...propsData,
+      },
+    });
+  };
+
+  beforeEach(() => {
+    createComponent();
+  });
+
+  it('renders remove button', () => {
+    expect(findButton().exists()).toBe(true);
+  });
+});