feat(app): interactive system map (/map)
A spatial control surface for the whole node. Tools, jobs, services, and frontends sit in lanes with program-source grips; edges show requires (dependency), same-program siblings, and exposure to LAN/Internet targets. Direct manipulation, each backed by the existing config PUT + apply: - drag a node to LAN/Internet to set reach (internal/public) - delete an exposure line or a node (with confirm) to unexpose/remove - right-click or the per-node ⋯ menu: open, restart, expose, delete - click the source grip to open the backing program Nodes are draggable with Shift-/toggle box-select; layout persists to localStorage with a reset control. Adds useSetReach/useDeleteDeployment hooks, the @xyflow/react dep, and the nav entry + route.
This commit is contained in:
@@ -27,3 +27,15 @@ select option {
|
||||
background-color: var(--card);
|
||||
color: var(--foreground);
|
||||
}
|
||||
|
||||
/* System Map: make a selected edge unmistakable — thicken it and lay a bright
|
||||
halo behind the colored stroke so the current selection reads at a glance
|
||||
before a Backspace/Delete removes it. */
|
||||
.react-flow__edge.selected .react-flow__edge-path {
|
||||
stroke-width: 3.5;
|
||||
filter: drop-shadow(0 0 5px rgba(240, 246, 252, 0.9));
|
||||
}
|
||||
.react-flow__edge:hover .react-flow__edge-path {
|
||||
stroke-width: 3;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user