mcgilman opened a new pull request, #11127: URL: https://github.com/apache/nifi/pull/11127
…n a new reusable component. ## Summary Adds a reusable canvas engine and connector canvas page to the NiFi frontend, enabling users to view the internal flow managed by a connector in a read-only canvas. ### Reusable Canvas Engine (`ui/common/canvas/`) A D3-based graph rendering component that can be consumed by any page needing to display a NiFi flow. Includes: - **Canvas component** — D3 zoom/pan, box selection, viewport persistence, signal-based inputs/outputs, birdseye public API - **7 rendering layers** — Processors, connections, process groups, remote process groups, ports, funnels, and labels, each with their own SVG renderer - **Supporting utilities** — Text ellipsis, format utils, component utils, overlap detection, canvas constants and types - **Global `canvasUi` state slice** — NgRx feature state for transform and feature flags (`canEdit`/`canSelect`) shared across canvas consumers ### Connector Canvas Page (`pages/connectors/ui/connector-canvas/`) A read-only view of a connector's internal flow, accessible at `/connectors/:id/canvas/:processGroupId`. Includes: - **Page shell** with global navigation header, error state handling, and `dataReady` gating - **NgRx state management** — `connectorCanvas` (flow data, breadcrumbs, PG navigation) and `connectorCanvasEntity` (connector metadata) feature states - **Routing** — Root guard that resolves the connector's `managedProcessGroupId`, redirector component, child routes for selection and PG navigation - **Process group navigation** — Double-click to enter child groups, Escape to return to parent, with `canNavigateToParent` gating - **Keyboard shortcuts** — Escape (leave group) and Ctrl/Cmd+R (refresh flow) with guards for dialogs and input elements - **API integration** — `ConnectorService.getConnectorFlow()` for loading flow data ### Other Changes - **`VersionControlTip` relocated** from `pages/flow-designer/ui/common/tooltips/` to `ui/common/tooltips/` to avoid cross-page imports from the reusable canvas - **`navigateToViewConnector`** effect updated to navigate to the canvas (replaces `window.alert` placeholder) ### Feature Gating All changes are behind the existing `enableConnectors` feature flag (`environment.enableConnectors`). The `/connectors` route uses `connectorsFeatureGuard` (`canMatch`), so the canvas page and its lazy-loaded module are unreachable when the flag is off. ### Testing 17 spec files with comprehensive coverage: - **Connector canvas** — component, effects, reducers, selectors, guard, and redirector specs - **Reusable canvas** — canvas component spec (birdseye API, zoom, viewport, selection), all 7 renderer specs, overlap detection utils spec --- -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected]
