add copy button for curie

Author: Woozl

src/pages/queryBuilder/textEditor/textEditorRow/NodeSelector.jsx

@@ -5,6 +5,9 @@ import axios from 'axios';
 import Autocomplete from '@material-ui/lab/Autocomplete';
 import TextField from '@material-ui/core/TextField';
 import CircularProgress from '@material-ui/core/CircularProgress';
+import IconButton from '@material-ui/core/IconButton';
+import FileCopy from '@material-ui/icons/FileCopy';
+import Check from '@material-ui/icons/Check';
 import Tooltip from '@material-ui/core/Tooltip';
 import { withStyles } from '@material-ui/core';
 
@@ -255,7 +258,10 @@ function Option({ name, ids, categories }) {
       title={(
         <div className="node-option-tooltip-wrapper">
           {Array.isArray(ids) && ids.length > 0 && (
-            <span>{ids[0]}</span>
+            <div>
+              <span>{ids[0]}</span>
+              <CopyButton textToCopy={ids[0]} />
+            </div>
           )}
           {Array.isArray(categories) && categories.length > 0 && (
             <span>{categories[0]}</span>
@@ -270,3 +276,27 @@ function Option({ name, ids, categories }) {
     </CustomTooltip>
   );
 }
+
+function CopyButton({ textToCopy }) {
+  const [hasCopied, setHasCopied] = useState(false);
+
+  const handleCopy = (e) => {
+    e.stopPropagation();
+    navigator.clipboard.writeText(textToCopy);
+    setHasCopied(true);
+  };
+
+  if (
+    navigator.clipboard === 'undefined' ||
+    typeof navigator.clipboard.writeText !== 'function' ||
+    typeof textToCopy !== 'string'
+  ) {
+    return null;
+  }
+
+  return (
+    <IconButton color="inherit" size="small" onClick={handleCopy}>
+      { hasCopied ? <Check /> : <FileCopy /> }
+    </IconButton>
+  );
+}