refactor(edge): move edge deploy script to react [EE-2689] (#6747)

app/portainer/components/Button/CopyButton/useCopy.ts

@@ -0,0 +1,37 @@
+import { useEffect, useState } from 'react';
+
+export function useCopy(copyText: string, fadeDelay = 1000) {
+  const [copiedSuccessfully, setCopiedSuccessfully] = useState(false);
+
+  useEffect(() => {
+    const fadeoutTime = setTimeout(
+      () => setCopiedSuccessfully(false),
+      fadeDelay
+    );
+    // clear timeout when component unmounts
+    return () => {
+      clearTimeout(fadeoutTime);
+    };
+  }, [copiedSuccessfully, fadeDelay]);
+
+  function handleCopy() {
+    // https://developer.mozilla.org/en-US/docs/Web/API/Clipboard
+    // https://caniuse.com/?search=clipboard
+    if (navigator.clipboard) {
+      navigator.clipboard.writeText(copyText);
+    } else {
+      // https://stackoverflow.com/a/57192718
+      const inputEl = document.createElement('input');
+      inputEl.value = copyText;
+      inputEl.type = 'text';
+      document.body.appendChild(inputEl);
+      inputEl.select();
+      document.execCommand('copy');
+      inputEl.type = 'hidden';
+      document.body.removeChild(inputEl);
+    }
+    setCopiedSuccessfully(true);
+  }
+
+  return { handleCopy, copiedSuccessfully };
+}