Merge branch '219817-migrate-create-issue-button-in-epic' into 'master'

Migrate deprecated create issue button in epic tree form

Closes #219817

See merge request gitlab-org/gitlab!40647

ee/app/assets/javascripts/related_items_tree/components/create_issue_form.vue

 <script>
 import { mapState, mapActions } from 'vuex';
 import {
-  GlDeprecatedButton,
+  GlButton,
   GlDeprecatedDropdown,
   GlDeprecatedDropdownItem,
   GlFormInput,
@@ -16,7 +16,7 @@ import { SEARCH_DEBOUNCE } from '../constants';
 
 export default {
   components: {
-    GlDeprecatedButton,
+    GlButton,
     GlDeprecatedDropdown,
     GlDeprecatedDropdownItem,
     GlFormInput,
@@ -171,19 +171,18 @@ export default {
 
     <div class="row my-1">
       <div class="col-sm flex-sm-grow-0 mb-2 mb-sm-0">
-        <gl-deprecated-button
+        <gl-button
           class="w-100"
           variant="success"
+          category="primary"
           :disabled="!selectedProject || itemCreateInProgress"
           :loading="itemCreateInProgress"
           @click="createIssue"
-          >{{ __('Create issue') }}</gl-deprecated-button
+          >{{ __('Create issue') }}</gl-button
         >
       </div>
       <div class="col-sm flex-sm-grow-0 ml-auto">
-        <gl-deprecated-button class="w-100" @click="cancel">{{
-          __('Cancel')
-        }}</gl-deprecated-button>
+        <gl-button class="w-100" @click="cancel">{{ __('Cancel') }}</gl-button>
       </div>
     </div>
   </div>

ee/spec/frontend/related_items_tree/components/create_issue_form_spec.js

 import { shallowMount, createLocalVue } from '@vue/test-utils';
 import Vuex from 'vuex';
 import {
-  GlDeprecatedButton,
+  GlButton,
   GlDeprecatedDropdown,
   GlDeprecatedDropdownItem,
   GlFormInput,
@@ -233,7 +233,7 @@ describe('CreateIssueForm', () => {
     });
 
     it('renders `Create issue` button', () => {
-      const createIssueButton = wrapper.findAll(GlDeprecatedButton).at(0);
+      const createIssueButton = wrapper.findAll(GlButton).at(0);
 
       expect(createIssueButton.exists()).toBe(true);
       expect(createIssueButton.text()).toBe('Create issue');
@@ -243,7 +243,7 @@ describe('CreateIssueForm', () => {
       wrapper.vm.$store.dispatch('requestCreateItem');
 
       return wrapper.vm.$nextTick(() => {
-        const createIssueButton = wrapper.findAll(GlDeprecatedButton).at(0);
+        const createIssueButton = wrapper.findAll(GlButton).at(0);
 
         expect(createIssueButton.exists()).toBe(true);
         expect(createIssueButton.props('disabled')).toBe(true);
@@ -252,7 +252,7 @@ describe('CreateIssueForm', () => {
     });
 
     it('renders `Cancel` button', () => {
-      const cancelButton = wrapper.findAll(GlDeprecatedButton).at(1);
+      const cancelButton = wrapper.findAll(GlButton).at(1);
 
       expect(cancelButton.exists()).toBe(true);
       expect(cancelButton.text()).toBe('Cancel');