diff --git a/ui/src/Copy.js b/ui/src/Copy.js new file mode 100644 index 00000000..fad85260 --- /dev/null +++ b/ui/src/Copy.js @@ -0,0 +1,15 @@ +import Icon from "@mdi/react"; +import {mdiContentCopy} from "@mdi/js"; + +const Copy = (props) => { + function handleClick(event) { + navigator.clipboard.writeText(props.text); + console.log("copied", props.text); + } + + return ( + + ); +} + +export default Copy; \ No newline at end of file diff --git a/ui/src/Token.js b/ui/src/Token.js index 057ab4a2..64ab4606 100644 --- a/ui/src/Token.js +++ b/ui/src/Token.js @@ -2,6 +2,7 @@ import Icon from "@mdi/react"; import {mdiKey} from "@mdi/js"; import Popover from "@mui/material/Popover"; import {useState} from "react"; +import Copy from "./Copy"; const Token = (props) => { const [anchorEl, setAnchorEl] = useState(null); @@ -15,6 +16,8 @@ const Token = (props) => { const popoverOpen = Boolean(anchorEl); const popoverId = popoverOpen ? 'token-popover' : undefined; + const text = "zrok enable " + props.user.token + return (
@@ -31,7 +34,7 @@ const Token = (props) => {

Enable zrok access in your shell:

-                        $ zrok enable {props.user.token}
+                        {text}