Dashboard & Topology Rework + Panel Polish#112
Merged
Conversation
Previously only the proxy→entry-service edge rendered a VNI block, because the session lookup matched against focusedSessions (proxy-level sessions filtered by client IP). Chain hop edges have different net_ids that don't appear in those sessions, so `session` was always null for them and the badge was skipped. Fix: derive focusedNetId directly from the graph edge when no session match is found, so chain edges still get a VNI label (compact, without CIDR rows). The proxy edge keeps its full VNI + src/dst CIDR display.
Adds a useDragResize hook that tracks mousedown/mousemove/mouseup on document to resize panels without cursor flicker. TopologyPanel and the Nodes detail panel (.dp) both get a 4px drag handle on their left edge with a subtle hover highlight. Width is constrained to [200, 560]px on both panels.
Dashboard now hosts the full topology experience via TopologyProvider: compact 4-stat header row (sessions, nodes, edges, pool), full-width topology card with the active connections table pinned above the graph, and the interactive side panel. Removed Recent Sessions and Services sections (services have a dedicated tab). Removed Topology from nav.
GyulyVGC
approved these changes
Jun 25, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
UI: Dashboard & Topology Rework + Panel Polish
Summary
This PR consolidates the Dashboard and Topology pages into a single view, fixes a VNI label bug on chain edges, and adds several UX improvements to the side panels and data tables.
Changes
Dashboard / Topology merge
TopologyProvider— click-to-inspect nodes and edges, client focus, and the slide-in panel all work directly from the dashboard./topologyroute,Topology.tsx, and its nav entry are all gone.Active Connections card
12 sessions · 3 nodes · 5 edges · 2.1% pool), replacing the four large stat boxes that dominated the top of the page.Edge panel (side drawer)
client_net/server_net) pulled from the sessions API by matchingnetwork_id.VNI badge on chain edges
net_idvalues don't appear infocusedSessions(proxy-level sessions only).focusedNetIddirectly from the graph edge when no session match exists, so all edges in the chain get a VNI label. The proxy edge keeps its full VNI + CIDR display; chain edges get a compact VNI-only badge.Side panels — resizable
.dp) are now resizable by dragging the left edge.useDragResizehook capturesstartX/startWidthonmousedown, updates width viadocumentmousemove, and restores cursor onmouseup. Width is clamped to[200, 560]px.<span>elements have atitleattribute for truncated-text tooltips.Internet panel
groupBySubnet,expandedstate, expand/collapse per group).Replica counts in service node panel
N active / M paused / P totalstring is now rendered as a mini table with aligned column headers (ACTIVE,PAUSED,TOTAL). Paused count turns amber when non-zero.