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

login/logout infrastructure improvements (#724, #802)

Browse Source
This commit is contained in:
Michael Quigley 2024-12-03 11:36:42 -05:00
parent 40783cdcda
commit 4411eca743
No known key found for this signature in database
GPG Key ID: 9B60314A9DD20A62
3 changed files with 12 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
ui100/src/ApiConsole.tsx
View File

@ -56,12 +56,11 @@ const ApiConsole = ({ user, logout }: ApiConsoleProps) => {
return ( return (
<div> <div>
<NavBar version={version} /> <NavBar logout={logout} version={version} />
<Box> <Box>
<div style={{position: "relative", width: "100%", height: "500px"}}> <div style={{position: "relative", width: "100%", height: "500px"}}>
<GraphCanvas nodes={nodes} edges={edges} theme={reagraphTheme} labelFontUrl={"https://fonts.googleapis.com/css?family=Poppins"}/> <GraphCanvas nodes={nodes} edges={edges} theme={reagraphTheme} labelFontUrl={"https://fonts.googleapis.com/css?family=Poppins"}/>
</div> </div>
<Button onClick={logout}>Log Out</Button>
</Box> </Box>
</div> </div>
); );

4
ui100/src/Login.tsx
View File

@ -27,7 +27,7 @@ const Login = ({ onLogin }: LoginProps) => {
} }
return ( return (
<Typography> <Typography component="div">
<Container maxWidth="xs"> <Container maxWidth="xs">
<Box sx={{ marginTop: 8, display: "flex", flexDirection: "column", alignItems: "center"}}> <Box sx={{ marginTop: 8, display: "flex", flexDirection: "column", alignItems: "center"}}>
<h2>welcome to zrok...</h2> <h2>welcome to zrok...</h2>
@ -59,7 +59,7 @@ const Login = ({ onLogin }: LoginProps) => {
<Button type="submit" fullWidth variant="contained" sx={{ mt: 3, mb: 2 }}> <Button type="submit" fullWidth variant="contained" sx={{ mt: 3, mb: 2 }}>
Log In Log In
</Button> </Button>
<Box component="h3">{message}</Box> <Box component="h3" style={{ color: "red" }}>{message}</Box>
</Box> </Box>
</Box> </Box>
</Container> </Container>

11
ui100/src/NavBar.tsx
View File

@ -1,11 +1,13 @@
import {AppBar, Box, IconButton, Toolbar, Typography} from "@mui/material"; import {AppBar, Box, Button, Grid2, IconButton, Toolbar, Typography} from "@mui/material";
import MenuIcon from "@mui/icons-material/Menu"; import MenuIcon from "@mui/icons-material/Menu";
import LogoutIcon from "@mui/icons-material/Logout";
interface NavBarProps { interface NavBarProps {
logout: () => void;
version: string; version: string;
} }
const NavBar = ({ version }: NavBarProps) => { const NavBar = ({ logout, version }: NavBarProps) => {
return ( return (
<Box ssx={{ flexGrow: 1 }}> <Box ssx={{ flexGrow: 1 }}>
<AppBar position="static"> <AppBar position="static">
@ -16,6 +18,11 @@ const NavBar = ({ version }: NavBarProps) => {
<Typography variant="h6" sx={{ flexGrow: 1 }} display={{ xs: "none", sm: "none", md: "block" }}> <Typography variant="h6" sx={{ flexGrow: 1 }} display={{ xs: "none", sm: "none", md: "block" }}>
zrok { version !== "" ? " | " + version : ""} zrok { version !== "" ? " | " + version : ""}
</Typography> </Typography>
<Grid2 container sx={{ flexGrow: 1 }}>
<Grid2 display="flex" justifyContent="right" size="grow">
<Button color="inherit" onClick={logout}><LogoutIcon /></Button>
</Grid2>
</Grid2>
</Toolbar> </Toolbar>
</AppBar> </AppBar>
</Box> </Box>