diff --git a/src/pages/queryBuilder/textEditor/textEditorRow/NodeSelector.jsx b/src/pages/queryBuilder/textEditor/textEditorRow/NodeSelector.jsx
index ccd7f924..02b8986f 100644
--- a/src/pages/queryBuilder/textEditor/textEditorRow/NodeSelector.jsx
+++ b/src/pages/queryBuilder/textEditor/textEditorRow/NodeSelector.jsx
@@ -5,6 +5,11 @@ 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';
import AlertContext from '~/context/alert';
import BiolinkContext from '~/context/biolink';
@@ -204,6 +209,7 @@ export default function NodeSelector({
onOpen={() => toggleOpen(true)}
onClose={() => toggleOpen(false)}
onInputChange={(e, v) => updateInputText(v)}
+ renderOption={(props) => }
renderInput={(params) => (
);
}
+
+const CustomTooltip = withStyles((theme) => ({
+ tooltip: {
+ fontSize: theme.typography.pxToRem(14),
+ },
+}))(Tooltip);
+
+function Option({ name, ids, categories }) {
+ return (
+
+ {Array.isArray(ids) && ids.length > 0 && (
+
+ {ids[0]}
+
+
+ )}
+ {Array.isArray(categories) && categories.length > 0 && (
+ {categories[0]}
+ )}
+
+ )}
+ placement="left"
+ >
+
+ { name }
+
+
+ );
+}
+
+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 (
+
+ { hasCopied ? : }
+
+ );
+}
diff --git a/src/pages/queryBuilder/textEditor/textEditorRow/textEditorRow.css b/src/pages/queryBuilder/textEditor/textEditorRow/textEditorRow.css
index 72c446a5..b8928316 100644
--- a/src/pages/queryBuilder/textEditor/textEditorRow/textEditorRow.css
+++ b/src/pages/queryBuilder/textEditor/textEditorRow/textEditorRow.css
@@ -4,4 +4,9 @@
}
.referenceNode > .nodeDropdown {
background-color: #f2f2f2;
+}
+.node-option-tooltip-wrapper {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
}
\ No newline at end of file