UI Enhancements — Topology Zoom & Stack Selector#106
Merged
Conversation
- Extract zoom/pan into ZoomFrame component (scroll=zoom, drag=pan, reset button); used at height=520 on Topology page and height=280 on Dashboard mini-preview - Add GET /api/stacks endpoint returning sorted list of active stacks - Stack selector in sidebar shows a dropdown of available stacks; double-click or "type custom…" option keeps the free-text flow
- Register wheel handler with { passive: false } to allow preventDefault
- Remove Registered/Unregistered filter chips from Topology view
Drop filter state, action types, reducer cases, and props from TopologyContext, TopologyGraph, and TopologyGraphSvg.
GyulyVGC
approved these changes
Jun 17, 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
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.
Summary
This PR improves the topology viewer and the stack selection UX across the control plane UI.
Changes
Topology — Zoom & Pan Frame
Introduced a reusable
ZoomFramecomponent (ui/src/components/topology/ZoomFrame.tsx) that wraps any SVG content with interactive zoom and pan:overflow: hidden) so it never pushes other content around.addEventListenerwith{ passive: false }sopreventDefaultworks correctly and the page does not scroll while zooming.userSelect: noneon the container prevents SVG text nodes from entering text-selection mode during a drag.ZoomFrameis used in two places:TopologyGraph)Stack Selector — Dropdown
Previously the stack name in the sidebar footer was a click-to-edit plain text field. It is now a proper dropdown:
/api/stacksendpoint (polled every 10 s).Server —
GET /api/stacksNew endpoint added to the Rust HTTP server:
Returns a sorted JSON array of all stack names currently held in the in-memory
StackMap. No authentication required (consistent with all other read endpoints).Topology — Filter Bar Removed
The Registered / Unregistered filter chips were removed from the Topology page. All services are shown by default.