mirror of
https://github.com/openziti/zrok.git
synced 2025-01-03 04:29:19 +01:00
styled minimap; better secret placeholder (#724)
This commit is contained in:
parent
bc2e07f3b8
commit
afeb8605ea
@ -12,6 +12,14 @@ const SecretToggle = ({ secret }: SecretToggleProps) => {
|
||||
|
||||
const toggle = () => setShowSecret(!showSecret);
|
||||
|
||||
const secretString = (s): string => {
|
||||
let out = "";
|
||||
for(let i = 0; i < s.length; i++) {
|
||||
out += " \u2022";
|
||||
}
|
||||
return out;
|
||||
}
|
||||
|
||||
if(showSecret) {
|
||||
return (
|
||||
<Grid2 container sx={{ flexGrow: 1 }} alignItems="center">
|
||||
@ -27,7 +35,7 @@ const SecretToggle = ({ secret }: SecretToggleProps) => {
|
||||
return (
|
||||
<Grid2 container sx={{ flexGrow: 1 }} alignItems="center">
|
||||
<Grid2 display="flex" justifyContent="left">
|
||||
<span>XXXXXXXX</span>
|
||||
<span>{secretString(secret)}</span>
|
||||
</Grid2>
|
||||
<Grid2 display="flex" justifyContent="right" sx={{ flexGrow: 1 }}>
|
||||
<ShowIcon onClick={toggle} sx={{ ml: 1 }} />
|
||||
|
@ -64,6 +64,13 @@ const Visualizer = ({ vov, onSelectionChanged }: VisualizerProps) => {
|
||||
} as VisualOverview
|
||||
}
|
||||
|
||||
const nodeColor = (node) => {
|
||||
if(node.selected) {
|
||||
return "#9bf316";
|
||||
}
|
||||
return "#241775";
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if(vov) {
|
||||
let laidOut = layout(vov.nodes, vov.edges);
|
||||
@ -85,7 +92,11 @@ const Visualizer = ({ vov, onSelectionChanged }: VisualizerProps) => {
|
||||
>
|
||||
<Background />
|
||||
<Controls position="bottom-left" orientation="horizontal" showInteractive={false} />
|
||||
<MiniMap />
|
||||
<MiniMap
|
||||
nodeColor={nodeColor}
|
||||
maskColor="rgb(36, 23, 117, 0.5)"
|
||||
pannable={true}
|
||||
/>
|
||||
</ReactFlow>
|
||||
);
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user