extern/zrok
1
1
Fork 0
mirror of https://github.com/openziti/zrok.git synced 2025-06-27 05:01:26 +02:00
Code Issues Packages Projects Releases Wiki Activity

'Copy' component in 'Token' (#72)

Browse Source
This commit is contained in:
Michael Quigley 2022-09-27 15:36:36 -04:00
parent c739a2da69
commit 3639635d48
No known key found for this signature in database
GPG Key ID: 9B60314A9DD20A62
2 changed files with 19 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
ui/src/Copy.js Normal file
View File

@ -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 (
<button onClick={handleClick}><Icon path={mdiContentCopy} size={0.5}/></button>
);
}
export default Copy;

5
ui/src/Token.js
View File

@ -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 (
<div>
<button aria-describedby={popoverId} onClick={handlePopoverClick}><Icon path={mdiKey} size={0.7}/></button>
@ -31,7 +34,7 @@ const Token = (props) => {
<div className={"popover"}>
<h3>Enable zrok access in your shell:</h3>
<pre>
$ zrok enable {props.user.token}
{text} <Copy text={text}/>
</pre>
</div>
</Popover>