amosblomqvist
4e48d13fac
Implements Option B from docs/research/graph-rendering.md. sigma.js v3 (WebGL) is replaced by one canvas, one rAF loop with a dirty flag, and d3-zoom for the camera — eliminating the entire bug class from the sigma-era bolt-on architecture: - Hull/node desync during pan (two independent render loops) is now structurally impossible: hull fills, dashed hull strokes, edges with arrowheads, node discs, region labels, node labels, and hover glow are all drawn in ONE frame under ONE camera. - The settings-change canvas-sizing race (everything shifting up-left) is gone: settings changes only redraw; the canvas and camera persist (verified live: camera identical to 15 decimals across a slider drag). - The GPU floor is gone: idle schedules NO frames at all (verified via pixel-identity over 600ms idle); pan redraws exactly once per frame. components/graph-canvas.ts: GraphCanvasRenderer class plus pure helpers (zoomRatioOf, labelAlpha, fitTransform, arrowGeometry, pickNearest). The sigma camera-ratio convention (1 = fit, smaller = zoomed in) is kept verbatim so persisted labelZoom settings survive the swap; node labels and cluster region labels cross-fade over the same LABELS_FADE_SPAN (0.5, unchanged). Picking is a nearest-node distance check with the 10px pad that replaces the old padded-picking vertex shader. Hull math stays in components/cluster-geometry.ts, reused as-is. No ctx.filter, ever. graph-view.tsx keeps every feature: fetch/refetch on runs-empty, FA2 run-then-freeze layout, localStorage render settings + sanitizers, search filtering with edge drops and card-close, detail card with flipped anchoring and per-source provenance, settings panel, import button, pipeline status chips. Only the renderer plumbing changed. tests/graph-canvas.test.ts pins the pure math: ratio direction, label gate + inverse complement (alphas sum to 1), fit transform padding, arrowhead tip-on-disc-edge and symmetry, picking pad/ties/null cases. Live-verified end-to-end on the real 338-node graph (dev server port 3002): single canvas, paint at fit, hover cursor+glow+fade, click card open/anchored/close, stage click, search filter to zero with hint, label gate opens via slider and zoom, cluster-labels toggle, zoom-to- cursor 0.56px anchor drift, camera persistence across settings, zero idle repaints. sigma dependency removed from package.json; d3-zoom and d3-selection added. Note: the settings feed effect needed isEmpty in its deps — without it the renderer mounted with settings=null and every draw early-returned (blank canvas); caught live, not by typecheck.
76 lines
2.2 KiB
JSON
76 lines
2.2 KiB
JSON
{
|
|
"name": "learning-harness",
|
|
"version": "0.2.0",
|
|
"description": "A standalone learning harness: a teacher agent (AI SDK) with quiz/ask interactions, session artifacts, and a derived knowledge graph of what the learner knows.",
|
|
"type": "module",
|
|
"private": true,
|
|
"scripts": {
|
|
"dev": "next dev",
|
|
"build": "next build",
|
|
"start": "next start",
|
|
"test": "NODE_ENV=test tsx --test tests/*.test.ts tests/*.test.tsx",
|
|
"lint": "eslint .",
|
|
"typecheck": "tsc --noEmit"
|
|
},
|
|
"dependencies": {
|
|
"@ai-sdk/react": "^4.0.79",
|
|
"@earendil-works/pi-agent-core": "^0.85.1",
|
|
"@earendil-works/pi-ai": "^0.85.1",
|
|
"@mozilla/readability": "^0.6.0",
|
|
"@radix-ui/react-use-controllable-state": "^1.2.6",
|
|
"@rive-app/react-webgl2": "^4.32.1",
|
|
"@streamdown/cjk": "^1.0.3",
|
|
"@streamdown/code": "^1.1.1",
|
|
"@streamdown/math": "^1.0.2",
|
|
"@streamdown/mermaid": "^1.0.2",
|
|
"@xyflow/react": "^12.11.3",
|
|
"ai": "^7.0.76",
|
|
"ansi-to-react": "^6.2.6",
|
|
"class-variance-authority": "^0.7.1",
|
|
"clsx": "^2.1.1",
|
|
"cmdk": "^1.1.1",
|
|
"d3-selection": "^3.0.0",
|
|
"d3-zoom": "^3.0.0",
|
|
"embla-carousel-react": "^8.6.0",
|
|
"graphology": "^0.26.0",
|
|
"graphology-communities-louvain": "^2.0.2",
|
|
"graphology-layout-forceatlas2": "^0.10.1",
|
|
"katex": "^0.16.47",
|
|
"linkedom": "^0.18.13",
|
|
"lucide-react": "^1.33.0",
|
|
"media-chrome": "^4.19.2",
|
|
"mermaid": "^11.17.0",
|
|
"motion": "^13.1.1",
|
|
"nanoid": "^6.0.1",
|
|
"next": "^16.3.2",
|
|
"next-themes": "^0.4.6",
|
|
"puppeteer-core": "^25.8.0",
|
|
"radix-ui": "^1.6.7",
|
|
"react": "^19.2.8",
|
|
"react-dom": "^19.2.8",
|
|
"react-jsx-parser": "^2.4.1",
|
|
"remark-breaks": "^4.0.0",
|
|
"streamdown": "^2.5.0",
|
|
"tailwind-merge": "^3.6.0",
|
|
"tokenlens": "^1.3.1",
|
|
"turndown": "^7.2.4",
|
|
"use-stick-to-bottom": "^1.1.6",
|
|
"zod": "^4.4.3"
|
|
},
|
|
"devDependencies": {
|
|
"@next/eslint-plugin-next": "^16.3.3",
|
|
"@tailwindcss/postcss": "^4.3.3",
|
|
"@types/node": "^24.0.0",
|
|
"@types/react": "^19.2.18",
|
|
"@types/react-dom": "^19.2.4",
|
|
"@types/turndown": "^5.0.6",
|
|
"@typescript-eslint/parser": "^8.68.0",
|
|
"eslint": "^9.39.5",
|
|
"eslint-import-resolver-typescript": "^4.4.5",
|
|
"eslint-plugin-import": "^2.32.0",
|
|
"tailwindcss": "^4.3.3",
|
|
"tsx": "^4.19.0",
|
|
"typescript": "^5.6.0"
|
|
}
|
|
}
|