Add copyToken.js to allow for copying token

- The button initially displays 'Copy', then a check mark after it is clicked for two seconds

Author: momo3404

app/javascript/application.js

@@ -23,6 +23,7 @@ import 'bootstrap-select';
 // Utilities
 import './src/utils/accordion';
 import './src/utils/autoComplete';
+import './src/utils/copyToken.js';
 import './src/utils/externalLink';
 import './src/utils/modalSearch';
 import './src/utils/outOfFocus';

app/javascript/src/utils/copyToken.js

@@ -0,0 +1,35 @@
+const initCopyToken = () => {
+  document.addEventListener('click', function (e) {
+    const button = e.target.closest('#copy-token-btn');
+    if (!button) return;
+
+    e.preventDefault();
+
+    // Prevent spam clicking
+    if (button.disabled) return;
+
+    const tokenInput = document.getElementById('api-token-val');
+    if (!tokenInput) return;
+
+    const originalHTML = button.innerHTML;
+
+    // Disable immediately
+    button.disabled = true;
+
+    navigator.clipboard.writeText(tokenInput.value).then(() => {
+      // Replace button contents with check icon
+      button.innerHTML = '<i class="fa fa-circle-check" aria-hidden="true"></i>';
+
+      // Restore after 2s
+      setTimeout(() => {
+        button.innerHTML = originalHTML;
+        button.disabled = false;
+      }, 2000);
+    }).catch(() => {
+      button.disabled = false;
+      alert('Failed to copy token');
+    });
+  });
+};
+
+initCopyToken();