diff --git a/ui100/src/Visualizer.tsx b/ui100/src/Visualizer.tsx index e4f5333a..21bc37c7 100644 --- a/ui100/src/Visualizer.tsx +++ b/ui100/src/Visualizer.tsx @@ -1,6 +1,6 @@ import "@xyflow/react/dist/style.css"; import "./react-flow.css"; -import {Background, Controls, ReactFlow, ReactFlowProvider, useEdgesState, useNodesState} from "@xyflow/react"; +import {Background, Controls, MiniMap, ReactFlow, ReactFlowProvider, useEdgesState, useNodesState} from "@xyflow/react"; import {VisualOverview} from "./model/visualizer.ts"; import {useEffect} from "react"; import {stratify, tree} from "d3-hierarchy"; @@ -8,6 +8,7 @@ import ShareNode from "./ShareNode.tsx"; import EnvironmentNode from "./EnvironmentNode.tsx"; import AccountNode from "../AccountNode.tsx"; import AccessNode from "./AccessNode.tsx"; +import {Minimize} from "@mui/icons-material"; interface VisualizerProps { vov: VisualOverview; @@ -72,6 +73,7 @@ export default ({ vov }: VisualizerProps) => {
+
); diff --git a/ui100/src/model/visualizer.ts b/ui100/src/model/visualizer.ts index de4a0433..9d5b16eb 100644 --- a/ui100/src/model/visualizer.ts +++ b/ui100/src/model/visualizer.ts @@ -151,91 +151,3 @@ export const nodesEqual = (a: Node[], b: Node[]) => { if(a.length !== b.length) return false; return a.every((e, i) => e.id === b[i].id && e.data.limited === b[i].data.limited && e.data.label === b[i].data.label); } - -export const buildVisualOverview = (overview: Overview): VisualOverview => { - let out = new VisualOverview(); - out.nodes = [ - { id: "0", position: { x: 0, y: 0 }, data: { label: "michael@quigley.com" }, type: "account" } - ]; - out.edges = []; - - let ownedShares: { [key: string]: Node } = {}; - - overview.environments?.forEach(env => { - if(env.environment && env.environment.zId) { - let envNode = { - id: env.environment.zId, - position: { x: 0, y: 0 }, - data: { label: env.environment?.description!, empty: true }, - type: "environment", - } - out.nodes.push(envNode); - out.edges.push({ - id: env.environment.zId + "-0", - source: "0", - target: env.environment.zId - }); - - if(env.shares) { - envNode.data.empty = false; - env.shares.forEach(shr => { - let shareNode = { - id: shr.token!, - position: { x: 0, y: 0 }, - data: { label: shr.token!, accessed: false }, - type: "share", - }; - out.nodes.push(shareNode); - ownedShares[shr.token!] = shareNode; - out.edges.push({ - id: env.environment?.zId + "-" + shr.token!, - source: env.environment?.zId!, - target: shr.token! - }); - }); - } - if(env.frontends) { - envNode.data.empty = false; - env.frontends.forEach(acc => { - let accNode = { - id: acc.token!, - position: { x: 0, y: 0 }, - data: { label: acc.token!, ownedShare: false, shrToken: acc.shrToken }, - type: "access", - } - out.nodes.push(accNode); - out.edges.push({ - id: env.environment?.zId + "-" + acc.token!, - source: env.environment?.zId!, - target: acc.token! - }); - let ownedShare = ownedShares[acc.shrToken]; - - }); - } - } - }); - out.nodes.forEach(n => { - if(n.type == "access") { - let ownedShare = ownedShares[n.data.shrToken]; - if(ownedShare) { - console.log("linking owned share", n) - n.data.ownedShare = true; - ownedShare.data.accessed = true; - out.edges.push({ - id: n.id + "-" + n.data.shrToken, - source: n.id, - target: n.data.shrToken as string, - targetHandle: "access", - animated: true - }); - } - } - }) - - return out; -} - -export const visualOverviewsEqual = (a: VisualOverview, b: VisualOverview): boolean => { - return false; -} \ No newline at end of file