feat: replace d3 canvas graph renderer with Sigma.js WebGL renderer

[shaunpatterson]

What

Replaces the hand-rolled d3-force canvas renderer (~1100 lines of manual hit-testing, arc geometry and label culling) with sigma.js v3 + graphology, the WebGL graph rendering stack used for large-scale network visualization.

Why

• Scale: WebGL rendering handles tens of thousands of nodes; the 2D canvas renderer degrades past a few hundred and culls labels aggressively (>50 nodes zoomed out, >500 always).
• Responsiveness: ForceAtlas2 layout runs in a web worker (graphology-layout-forceatlas2/worker) — the UI thread never blocks during layout. Auto-stops after 4s.
• Less code to maintain: hit-testing, label collision, hover/drag mechanics, and camera handling come from the library instead of bespoke canvas math.

Feature parity

Capability	Status
Hover/select nodes & edges, properties panel	✅ same callbacks, original node/edge objects
Double-click to expand/collapse	✅
Drag node to pin	✅
Parallel edges between same nodes	✅ fan out as distinct curves (@sigma/edge-curve)
searchNode/focusNode/zoomToFit ref API (toolbar)	✅ same matching semantics
highlightPredicate, active edge emphasis	✅ via sigma reducers
New	degree-scaled node sizes; neighbor highlighting dims non-neighbors on hover

One contract worth calling out: d3-force used to mutate edge source/target from uid strings into node object references, and both EdgeProperties and GraphParser.collapseNode depend on that. buildGraph preserves the mutation, with unit tests pinning it.

Testing

• buildGraph (graphology construction, endpoint resolution, curvature fanning, degree sizing, position reuse): 12/12 tests pass.
• sigma is mocked under Jest — jsdom has no WebGL2RenderingContext (full-suite repair is fix: repair broken Jest test suite (16/18 suites failing) #410).
• npm run build (webpack 5) passes.
• Browser smoke test (client/scripts/graph-smoke.mjs, included): seeds a local Dgraph v25 (ACL) cluster, logs in through the real UI, runs a query, asserts the WebGL canvas layers render the expected graph, and exercises search + zoom-to-fit. Passes with zero page errors.

d3 is dropped from dependencies (D3Graph was its only consumer).

🤖 Generated with Claude Code

[shaunpatterson]

Scope update: this PR now also includes the graph toolkit built on top of the new renderer (825cf76):

• Style rules (Neo4j Bloom-style): a Graph styles toolbar panel lists every group in the current result with a color picker and node-size slider; overrides apply live via sigma reducers and persist in localStorage (lib/graphStyles.js, 11 unit tests).
• Layout switcher: Force (ForceAtlas2 worker) / Circular / Packed (circlepack clustered by group), with auto camera fit on static layouts.
• Legend filtering: clicking a predicate chip in the entity selector hides/shows that predicate's nodes and edges without re-querying; hidden chips render dimmed with strikethrough.

All three were exercised in a real browser against a live Dgraph v25 (layout switching, style panel color changes, chip toggling) with zero page errors. Unit suite and production build green.

[shaunpatterson]

Scope update: four graph-exploration features added

Building on the Sigma.js renderer, this branch now also includes four analyst-focused features (each its own commit, each with unit tests; verified end-to-end in the real UI against a local Dgraph):

• Color by community / size by centrality (c008a97) — Louvain communities + betweenness centrality via the graphology ecosystem, as optional node modes. Defaults (predicate color, degree size) render identically to before.
• Find shortest path (474c0fd) — toggle path mode, click two nodes, BFS over the rendered subgraph highlights the route; banner reports hop count.
• Faceted filtering (8e69188) — hide nodes by degree range or attribute predicate (contains / = / ≠ / > / < / exists); edges drop with either endpoint.
• Timeline (be68a4d) — detects ISO datetime attributes and offers a scrubber + play to reveal nodes over time.

All applied via the existing SigmaGraph reducer architecture. New deps: graphology-communities-louvain, graphology-metrics. +44 unit tests across 4 new lib modules.

[rahst12]

SigmaJS v4 is coming along. There's been a lot of development on that line over the past year. I'd recommend checking that out for long-term support/stability of the product. It improves on SigmaJS v3 quite a bit. Looks like they're also actively developing it and taking feedback with rapid fixes when things are found. gdotv is using it too. Discussion Post: jacomyal/sigma.js#1539 (reply in thread)