Use `data-clipboard-text` and `copy_to_clipboard.js`

Noticed there wasn't any tooltip on the clipboard button so I moved to
using `data-clipboard-text` which gets handled by `copy_to_clipboard.js`

app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.js

-import ClipboardAction from 'clipboard/lib/clipboard-action';
 import eventHub from '../event_hub';
 
 export default {
@@ -26,19 +25,6 @@ export default {
       const isChecked = e.target.checked;
       eventHub.$emit('serviceDeskEnabledCheckboxToggled', isChecked);
     },
-    copyIncomingEmail(e) {
-      e.preventDefault();
-
-      const clipboardAction = new ClipboardAction({
-        action: 'copy',
-        target: this.$refs['service-desk-incoming-email'],
-        text: this.incomingEmail,
-        trigger: e,
-        emitter: { emit: () => {} },
-      });
-
-      clipboardAction.destroy();
-    },
   },
 
   template: `
@@ -73,9 +59,10 @@ export default {
                 {{ incomingEmail }}
               </span>
               <button
-                class="btn btn-clipboard btn-transparent"
+                class="btn btn-clipboard btn-transparent has-tooltip"
                 title="Copy incoming email address to clipboard"
-                @click="copyIncomingEmail($event)">
+                :data-clipboard-text="incomingEmail"
+                @click.prevent>
                 <i class="fa fa-clipboard" aria-hidden="true" />
               </button>
             </template>

spec/javascripts/projects/settings_service_desk/components/service_desk_setting_spec.js

@@ -135,16 +135,5 @@ describe('ServiceDeskSetting', () => {
         expect(onCheckboxToggleSpy).toHaveBeenCalledWith(false);
       });
     });
-
-    describe('copyIncomingEmail', () => {
-      beforeEach(() => {
-        vm = createComponent({
-          isEnabled: true,
-          incomingEmail: 'foo@bar.com',
-        });
-      });
-
-      it('copies text to clipboard');
-    });
   });
 });