reqlanOverviewIdeasFilesCode filesClustersAttributesGraphPrint
Ideas/graphical_graph

Idea detail

graphical_graph

reqlan rq/extension/module/ideas_summary/graphical_graph.rq:6

block

Summary

There should be a tab that renders requirement ideas and references as a force-directed web.
The graph tab lives in the Ideas Summary webview per ideas_summary.
UI is implemented in GraphView.svelte.
Graph slices are built in webview-graph-queries.ts and served by ideas-summary-panel.ts.
By default the view focuses on the active editor file's first idea; without a focus it shows a capped slice of matching ideas rather than dumping the full graph.
Users can filter by search text, path, multi-select @ status, and multi-select tags per graph_status_tag_filters.
An " Indirect references " toggle expands neighbourhood depth from 1 to 2 hops.
Clicking a node opens its source; double-click or " Focus graph " recenters the slice on that idea.
External file references render as dashed edges to file nodes.
A toggleable key explains node colours and edge styles and toggles node-type visibility per key_panel_toggle; a toggleable control_panel exposes layout, physics, and node-budget settings. Key and Controls state persist per workspace via graph_ui_persistence.
Pan, zoom, and drag repositioning per view_controls.
manual_reframe via " Fit to view " in ui_controls; auto_reframe when the loaded node set changes; reframe_animation for smooth transitions after the first paint.
Node text labels per graph_labels, graph_label_modes, and graph_label_auto.
Layout, compound grouping, and live physics behaviour per layout_physics, layout_options, physics_options, and compound_graph.
Cytoscape lifecycle and threading constraints per graph_cy_controller and webview_threading.

Jump to outbound references

Jump to inbound references

Navigation

Source file

reqlan rq/extension/module/ideas_summary/graphical_graph.rq

community 27

community cluster

graphical_graph.rq

file cluster

reqlan rq/extension/module/ideas_summary

folder cluster

status: Not present

status cluster

tag: Not present

tag cluster

Printable page

Static print-friendly idea sheet.

Attributes

No attributes declared.

Ancestor context

key_panel_toggle

the key panel should be able to toggle inclusion / visibility of the different node types. Node-type rows in ["../../../packages/extension/webviews/ideas-summary/components/GraphKeyPanel.svelte"] are toggle buttons; hidden types render dimmed with a struck-through label. Toggleable types are block, one-liner, ideaset, focused idea, and external file — GraphNodeTypeId in ["../../../packages/extension/webviews/shared/graph/graph-theme.ts"], classified per node by graphNodeTypeId ( same priority as node fill colour ). GraphView tracks hidden types and calls GraphCyController. setHiddenNodeTypes in ["../../../packages/extension/webviews/shared/graph/graph-cy-controller.ts"], which flags matching nodes with data typeHidden; a display: none stylesheet rule in ["../../../packages/extension/webviews/shared/graph/graph-cytoscape.ts"] hides them, and cytoscape hides edges whose endpoint is hidden. Compound containers whose members are all hidden are hidden too. Hiding is client-side visibility only: the slice still contains the nodes, node / edge counts are unchanged, and flags reapply after every slice sync. Key open state and hidden node types persist per [graph_ui_persistence].

control_panel

Floating panel in ["../../../packages/extension/webviews/ideas-summary/components/GraphControlPanel.svelte"], toggled from [ui_controls]. Provides layout algorithm selection, live-physics toggle, compound grouping, physics force sliders, max node count, and truncation basis. Physics tunables call GraphCyController. setPhysicsSettings; node budget changes re-request the graph slice via loadGraph. Mounted as a sibling of the cytoscape container ( not inside it ) so range sliders and selects work with native browser events. When positioned, a ResizeObserver on the surface wrap reclamps panelX / panelY so the panel stays fully inside after the webview is resized; Key panel uses the same reclamp. Open / closed state and all control values persist per [graph_ui_persistence].

graph_ui_persistence

Key and Controls state is stored in VS Code ExtensionContext. workspaceState under key GRAPH_UI_WORKSPACE_STATE_KEY ( reqlan. ideasSummary. graphUi ). Shape and normalisation live in ["../../../packages/extension/src/webview_module/shared/graph-ui-state.ts"]; the host reads / writes it from ["../../../packages/extension/src/webview_module/ideas-summary-panel.ts"]. On webview ready the extension posts graphUiState; the webview posts persistGraphUiState ( debounced ) whenever AppState. patchGraphUi runs in ["../../../packages/extension/webviews/ideas-summary/state/app.svelte.ts"]. Persisted fields: showKey, showControls, hiddenNodeTypes, layoutId, useCompound, compoundBasisId, animatePhysics, labelMode, maxNodes, truncationBasis, and the five physics sliders ( gravity, repulsion, linkStrength, linkDistance, damping ). GraphView in ["../../../packages/extension/webviews/ideas-summary/components/GraphView.svelte"] treats app. graph. ui as the source of truth and applies layout / physics / hidden types / label mode to GraphCyController when those fields change. The first graph load waits for graphUiState so restored node budget is included in loadGraph.

ui_controls

Controls live in ["../../../packages/extension/webviews/ideas-summary/components/GraphControls.svelte"] and dispatch events to GraphView. [manual_reframe] — " Fit to view " calls GraphCyController. reframeToViewport per [reframe_view]. [auto_reframe] and [reframe_animation] are handled by the shared controller; no extra UI beyond pan / zoom / drag. Labels control cycles [graph_label_modes] ( auto / on / off ) and applies [graph_label_auto] via GraphCyController. setLabelMode. Status and tag filters are multi-select dropdowns per [graph_status_tag_filters]. The Key button toggles a draggable legend panel in ["../../../packages/extension/webviews/ideas-summary/components/GraphKeyPanel.svelte"] over the graph canvas. The Controls button toggles [control_panel]. Overlay panels ( Key and Controls ) are siblings of the cytoscape mount inside a graph-surface-wrap — never children of the cy container — so native form controls receive pointer events.

Outbound references

KindIdeaPathSnippet
file_reference ../../../packages/analytical/src/index-store/webview-graph-queries.ts reqlan rq/packages/analytical/src/index-store/webview-graph-queries.ts webview-graph-queries.ts
file_reference ../../../packages/extension/src/webview_module/ideas-summary-panel.ts reqlan rq/packages/extension/src/webview_module/ideas-summary-panel.ts ideas-summary-panel.ts
file_reference ../../../packages/extension/src/webview_module/shared/graph-ui-state.ts reqlan rq/packages/extension/src/webview_module/shared/graph-ui-state.ts —
file_reference ../../../packages/extension/webviews/ideas-summary/components/GraphControlPanel.svelte reqlan rq/packages/extension/webviews/ideas-summary/components/GraphControlPanel.svelte —
file_reference ../../../packages/extension/webviews/ideas-summary/components/GraphControls.svelte reqlan rq/packages/extension/webviews/ideas-summary/components/GraphControls.svelte —
file_reference ../../../packages/extension/webviews/ideas-summary/components/GraphKeyPanel.svelte reqlan rq/packages/extension/webviews/ideas-summary/components/GraphKeyPanel.svelte —
file_reference ../../../packages/extension/webviews/ideas-summary/components/GraphView.svelte reqlan rq/packages/extension/webviews/ideas-summary/components/GraphView.svelte GraphView.svelte
file_reference ../../../packages/extension/webviews/ideas-summary/lib/vscode.ts reqlan rq/packages/extension/webviews/ideas-summary/lib/vscode.ts —
file_reference ../../../packages/extension/webviews/ideas-summary/state/app.svelte.ts reqlan rq/packages/extension/webviews/ideas-summary/state/app.svelte.ts —
file_reference ../../../packages/extension/webviews/shared/graph/graph-cy-controller.ts reqlan rq/packages/extension/webviews/shared/graph/graph-cy-controller.ts —
file_reference ../../../packages/extension/webviews/shared/graph/graph-cytoscape.ts reqlan rq/packages/extension/webviews/shared/graph/graph-cytoscape.ts —
file_reference ../../../packages/extension/webviews/shared/graph/graph-theme.ts reqlan rq/packages/extension/webviews/shared/graph/graph-theme.ts —
file_reference ../library/graph.rq reqlan rq/extension/module/library/graph.rq —
file_reference ./webview.rq reqlan rq/extension/module/ideas_summary/webview.rq —
references control_panel reqlan rq/extension/module/ideas_summary/graphical_graph.rq control_panel
references graph_ui_persistence reqlan rq/extension/module/ideas_summary/graphical_graph.rq graph_ui_persistence
references key_panel_toggle reqlan rq/extension/module/ideas_summary/graphical_graph.rq key_panel_toggle
references ui_controls reqlan rq/extension/module/ideas_summary/graphical_graph.rq ui_controls

Inbound references

KindIdeaPathSnippet
None

Unresolved references

KindIdeaPathSnippet
references auto_reframe auto_reframe
references compound_graph compound_graph
references graph_cy_controller graph_cy_controller
references graph_label_auto graph_label_auto
references graph_label_modes graph_label_modes
references graph_labels graph_labels
references graph_status_tag_filters graph_status_tag_filters
references ideas_summary ideas_summary
references layout_options layout_options
references layout_physics layout_physics
references manual_reframe manual_reframe
references physics_options physics_options
references reframe_animation reframe_animation
references view_controls view_controls
references webview_threading webview_threading

Local graph

Initialising graph…