Rename component

Thanks to @lukemelia for this suggestion on handling component
name overlaps:
emberjs/ember.js#17997 (comment)

ui/app/components/addon-copy-button.js

@@ -0,0 +1 @@
+export { default } from 'ember-cli-clipboard/components/copy-button';

ui/app/components/x-copy-button.js → ui/app/components/copy-button.js

@@ -2,7 +2,7 @@ import Component from '@ember/component';
 import { run } from '@ember/runloop';
 
 export default Component.extend({
-  classNames: ['x-copy-button'],
+  classNames: ['copy-button'],
 
   state: null,
 

ui/app/styles/core/buttons.scss

@@ -134,7 +134,7 @@ $button-box-shadow-standard: 0 2px 0 0 rgba($grey, 0.2);
   }
 }
 
-.x-copy-button {
+.copy-button {
   padding-left: 0.5rem;
   margin-bottom: 2px;
 

ui/app/templates/allocations/allocation/index.hbs

@@ -18,7 +18,7 @@
     <span class="bumper-left tag {{model.statusClass}}">{{model.clientStatus}}</span>
     <span class="tag is-hollow is-small no-text-transform">
       {{model.id}}
-      {{x-copy-button clipboardText=model.id}}
+      {{copy-button clipboardText=model.id}}
     </span>
     {{#if model.isRunning}}
       {{two-step-button

ui/app/templates/clients/client.hbs

@@ -4,7 +4,7 @@
     {{or model.name model.shortId}}
     <span class="tag is-hollow is-small no-text-transform">
       {{model.id}}
-      {{x-copy-button clipboardText=model.id}}
+      {{copy-button clipboardText=model.id}}
     </span>
   </h1>
 

ui/app/templates/components/x-copy-button.hbs → ui/app/templates/components/copy-button.hbs

@@ -12,12 +12,12 @@
     </span>
   </div>
 {{else}}
-  {{#copy-button
+  {{#addon-copy-button
     class='button is-borderless is-small'
     clipboardText=clipboardText
     success=(action 'success')
     error=(action (mut state) 'error')
   }}
     {{x-icon 'copy-action'}}
-  {{/copy-button}}
+  {{/addon-copy-button}}
 {{/if}}

ui/tests/integration/components/x-copy-button-test.js

@@ -7,19 +7,19 @@ import sinon from 'sinon';
 
 import { triggerCopyError, triggerCopySuccess } from 'ember-cli-clipboard/test-support';
 
-module('Integration | Component | x-copy-button', function(hooks) {
+module('Integration | Component | copy-button', function(hooks) {
   setupRenderingTest(hooks);
 
   test('it shows the copy icon by default', async function(assert) {
-    await render(hbs`{{x-copy-button class='copy-button'}}`);
+    await render(hbs`{{copy-button class='copy-button'}}`);
 
     assert.dom('.copy-button .icon-is-copy-action').exists();
   });
 
   test('it shows the success icon on success and resets afterward', async function(assert) {
     const clock = sinon.useFakeTimers();
 
-    await render(hbs`{{x-copy-button class='copy-button'}}`);
+    await render(hbs`{{copy-button class='copy-button'}}`);
 
     await click('.copy-button button');
     await triggerCopySuccess('.copy-button button');
@@ -35,7 +35,7 @@ module('Integration | Component | x-copy-button', function(hooks) {
   });
 
   test('it shows the error icon on error', async function(assert) {
-    await render(hbs`{{x-copy-button class='copy-button'}}`);
+    await render(hbs`{{copy-button class='copy-button'}}`);
 
     await click('.copy-button button');
     await triggerCopyError('.copy-button button');