Merge branch '198466' into 'master'

Update service desk project to use GlLoadingIcon instead of font awesome spinner

See merge request gitlab-org/gitlab!23933

changelogs/unreleased/198466.yml

+---
+title: update service desk project to use GlLoadingIcon over font awesome spinner
+merge_request:
+author: Oregand
+type: changed

ee/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue

 <script>
-import { GlButton, GlFormSelect, GlToggle } from '@gitlab/ui';
+import { GlButton, GlFormSelect, GlToggle, GlLoadingIcon } from '@gitlab/ui';
 import { __ } from '~/locale';
 import tooltip from '~/vue_shared/directives/tooltip';
 import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
@@ -15,6 +15,7 @@ export default {
     GlButton,
     GlFormSelect,
     GlToggle,
+    GlLoadingIcon,
   },
   props: {
     isEnabled: {
@@ -112,7 +113,7 @@ export default {
           </div>
         </template>
         <template v-else>
-          <i class="fa fa-spinner fa-spin" aria-hidden="true"></i>
+          <gl-loading-icon :inline="true" />
           <span class="sr-only">{{ __('Fetching incoming email') }}</span>
         </template>
 

ee/spec/frontend/projects/settings_service_desk/components/service_desk_setting_spec.js

 import { shallowMount, mount } from '@vue/test-utils';
+import { GlLoadingIcon } from '@gitlab/ui';
 import eventHub from 'ee/projects/settings_service_desk/event_hub';
 import ServiceDeskSetting from 'ee/projects/settings_service_desk/components/service_desk_setting.vue';
 
@@ -33,7 +34,7 @@ describe('ServiceDeskSetting', () => {
         });
 
         it('should see loading spinner and not the incoming email', () => {
-          expect(wrapper.contains('.fa-spinner')).toBe(true);
+          expect(wrapper.find(GlLoadingIcon).exists()).toBe(true);
           expect(wrapper.contains('.incoming-email')).toBe(false);
         });
       });
@@ -73,7 +74,7 @@ describe('ServiceDeskSetting', () => {
 
       it('should see email and not the loading spinner', () => {
         expect(wrapper.find('.incoming-email').element.value).toEqual(incomingEmail);
-        expect(wrapper.contains('.fa-spinner')).toBe(false);
+        expect(wrapper.find(GlLoadingIcon).exists()).toBe(false);
       });
 
       it('renders a copy to clipboard button', () => {