Fix impact-graph MiniMap so it draws the node overview

[Modsofthenation]

Why

The impact graph already mounted React Flow’s MiniMap, but the overview was an empty gray mask. Custom load nodes never declared width/height, and MiniMap reads those off the user node — not the measured DOM box — so it skipped every node.

What changed

• Give load nodes explicit 180×56 dimensions so MiniMap can draw them.
• Theme the overview (node fill, dark mask, accent viewport stroke) so it reads on Obsidian and the light themes.
• Assert .react-flow__minimap-node in the Playwright graph screenshot flow.

Tests

cd ui && npm test && npm run build. Playwright tests/e2e/test_ui_screenshots.py passed; README screenshots regenerated.

  

Summary by CodeRabbit

• New Features

  • Added an improved graph minimap with navigation controls, clearer node colors, selection highlighting, accessibility labeling, and responsive sizing.

• Style

  • Updated the minimap with themed backgrounds, borders, rounded corners, masking, and shadows.
  • Standardized graph node dimensions and clipped overflowing content.

• Bug Fixes

  • Improved screenshot capture reliability by waiting for the graph minimap and its nodes to render before capturing.

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 34df2666-988d-44e2-a382-9205c8b08ee4

📥 Commits

Reviewing files that changed from the base of the PR and between baaad29 and ab21a83.

⛔ Files ignored due to path filters (5)

• docs/screenshots/architecture.png is excluded by !**/*.png
• docs/screenshots/graph.png is excluded by !**/*.png
• docs/screenshots/pull-requests.png is excluded by !**/*.png
• docs/screenshots/review.png is excluded by !**/*.png
• docs/screenshots/settings.png is excluded by !**/*.png

📒 Files selected for processing (6)

• src/loadpath/static/assets/index-DA_Qg5fM.css
• src/loadpath/static/assets/index-gOpwxVBZ.js
• src/loadpath/static/index.html
• tests/e2e/test_ui_screenshots.py
• ui/src/ImpactGraph.tsx
• ui/src/styles.css

---

📝 Walkthrough

Walkthrough

The React Flow graph now uses fixed node dimensions and a configured minimap with theme-aware styling. The screenshot test waits for minimap content, and the HTML entrypoint references regenerated assets.

Changes

React Flow visualization

Layer / File(s)	Summary
Fixed graph node dimensions ui/src/ImpactGraph.tsx, ui/src/styles.css	Graph nodes use shared 180px × 56px dimensions. CSS applies border-box sizing and clips overflow.
Configured minimap presentation ui/src/ImpactGraph.tsx, ui/src/styles.css, src/loadpath/static/assets/index-DA_Qg5fM.css	The minimap uses explicit sizing, accessibility labeling, theme-aware colors, viewport masking, borders, rounded corners, and shadows.
Built asset wiring and screenshot validation src/loadpath/static/index.html, tests/e2e/test_ui_screenshots.py	The entrypoint references the regenerated assets. The screenshot test waits for more than three minimap nodes before capture.

Estimated code review effort: 2 (Simple) | ~10 minutes

Possibly related PRs

• Modsofthenation/Agent-Loop-Builder#15: Related React Flow node sizing and layout changes.
• Modsofthenation/PR-Reviewer#2: Related ImpactGraph.tsx, styles.css, and minimap theming changes.
• Modsofthenation/PR-Reviewer#6: Earlier React Flow graph and minimap changes.

Suggested reviewers: cursoragent

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch cursor/minimap-fix-ccb4

---

_{Comment @coderabbitai help to get the list of available commands.}