styled minimap; better secret placeholder (#724)

This commit is contained in:
Michael Quigley 2024-12-20 11:56:00 -05:00
parent bc2e07f3b8
commit afeb8605ea
No known key found for this signature in database
GPG Key ID: 9B60314A9DD20A62
2 changed files with 21 additions and 2 deletions

View File

@ -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 }} />

View File

@ -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>
);
}