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

toolbar (#221)

Browse Source
This commit is contained in:
Michael Quigley 2024-10-08 13:46:50 -04:00
parent 4749411a59
commit a67dba0959
No known key found for this signature in database
GPG Key ID: 9B60314A9DD20A62
3 changed files with 710 additions and 261 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

939
agent/agentUi/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

4
agent/agentUi/package.json
View File

@ -10,6 +10,10 @@
"preview": "vite preview"
},
"dependencies": {
"@emotion/react": "^11.13.3",
"@emotion/styled": "^11.13.0",
"@mui/icons-material": "^6.1.2",
"@mui/material": "^6.1.2",
"bootstrap": "^5.3.3",
"react": "^18.3.1",
"react-bootstrap": "^2.10.5",

28
agent/agentUi/src/App.jsx
View File

@ -3,6 +3,11 @@ import "bootstrap/dist/css/bootstrap.min.css";
import {useEffect, useState} from "react";
import {AgentApi, ApiClient} from "./api/src/index.js";
import DataTable from "react-data-table-component";
import ShareIcon from "@mui/icons-material/Share";
import MenuIcon from "@mui/icons-material/Menu";
import LanIcon from "@mui/icons-material/Lan";
import ListIcon from "@mui/icons-material/List";
import {AppBar, Button, IconButton, Toolbar, Typography} from "@mui/material";
function App() {
const [version, setVersion] = useState("");
@ -77,8 +82,25 @@ function App() {
return (
<>
<h1>zrok Agent</h1>
<code>Connected Version: {version}</code>
<AppBar position={"static"}>
<Toolbar>
<IconButton
size={"large"}
edge={"start"}
color={"inherit"}
aria-label={"menu"}
sx={{mr: 2}}
>
<MenuIcon/>
</IconButton>
<Typography variant={"p"} component={"div"} sx={{flexGrow: 1}}>
zrok Agent { version !== "" ? " | " + version : ""}
</Typography>
<Button color={"inherit"}><ListIcon /></Button>
<Button color={"inherit"}><LanIcon /></Button>
<Button color={"inherit"}><ShareIcon /></Button>
</Toolbar>
</AppBar>
<div class={"info"}>
<h2>Shares</h2>
@ -97,6 +119,8 @@ function App() {
noDataComponent={<div/>}
/>
</div>
<code>Connected Version: {version}</code>
</>
)
}