feat(export): add GraphML, GraphSON, Neo4j CSV and interactive viewer#268
feat(export): add GraphML, GraphSON, Neo4j CSV and interactive viewer#268carlos-alm merged 5 commits intomainfrom
Conversation
…e HTML viewer Add three new export formats for graph database interoperability: - GraphML (XML standard) with file-level and function-level modes - GraphSON (TinkerPop v3) for Gremlin/JanusGraph compatibility - Neo4j CSV (bulk import) with separate nodes/relationships files Add interactive HTML viewer (`codegraph plot`) powered by vis-network: - Hierarchical, force, and radial layouts with physics toggle - Node coloring by kind or role, search/filter, legend panel - Configurable via .plotDotCfg JSON file Update CLI export command, MCP export_graph tool, and programmatic API to support all six formats. Impact: 12 functions changed, 6 affected
|
Claude finished @carlos-alm's task —— View job Review of PR #268: Export Formats and Interactive ViewerRoot Cause AnalysisProblem Being Solved: Adding export capabilities for popular graph database formats (GraphML, GraphSON, Neo4j CSV) and an interactive HTML viewer. This addresses a real need for graph database interoperability and visualization. Why This Approach: The implementation follows existing export patterns, adding three new export functions alongside DOT/Mermaid/JSON formats. The interactive viewer uses vis-network and is well-separated into its own module. Risk Assessment: Low risk - this is a pure feature addition with comprehensive test coverage. No existing functionality is modified. Configuration Changes ✅No configuration changes detected - no modifications to Test Integrity ✅Excellent test coverage - 21 new tests covering all new export formats:
All tests use proper isolation with in-memory databases and test realistic scenarios including edge cases like XML escaping and empty graphs. Code Quality ✅Security
Performance & Scalability
Implementation Quality
Standards Compliance
Minor Issues Identified
Final Recommendation
Excellent work! This PR significantly enhances codegraph's export capabilities while maintaining high code quality standards. |
Greptile SummaryAdds GraphML, GraphSON, Neo4j CSV export formats and a sophisticated interactive HTML viewer with drill-down navigation, Louvain community clustering, complexity overlays, and risk highlighting. The implementation includes proper data enrichment with complexity metrics, fan-in/fan-out counts, and community IDs. Security improvements verified:
Key additions:
Issue found:
Confidence Score: 4/5
Important Files Changed
Flowchart%%{init: {'theme': 'neutral'}}%%
flowchart TD
A[CLI plot command] --> B[Load .plotDotCfg]
B --> C[prepareGraphData]
C --> D[Query DB for nodes/edges]
D --> E[Compute complexity metrics]
E --> F[Calculate fan-in/fan-out]
F --> G[Run Louvain clustering]
G --> H[Flag risk nodes]
H --> I[Apply seed strategy]
I --> J[generatePlotHTML]
J --> K[Embed data as JSON]
K --> L[Write HTML file]
L --> M{--no-open?}
M -->|No| N[execFile browser open]
M -->|Yes| O[Done]
N --> O
P[Browser loads HTML] --> Q[vis-network renders graph]
Q --> R[User interacts]
R --> S{Action}
S -->|Click node| T[Expand neighbors / Show detail]
S -->|Double-click| U[Collapse node]
S -->|Change controls| V[Update appearance/clustering]
T --> Q
U --> Q
V --> Q
Last reviewed commit: 15418fd |
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
src/cli.js
Outdated
| const cmd = | ||
| process.platform === 'win32' | ||
| ? `start "" "${outPath}"` | ||
| : process.platform === 'darwin' | ||
| ? `open "${outPath}"` | ||
| : `xdg-open "${outPath}"`; | ||
| exec(cmd, (err) => { |
There was a problem hiding this comment.
paths with special characters (quotes, backticks, parentheses) will cause the shell command to fail or behave unexpectedly
consider using child_process.spawn or properly escaping the path before passing to shell
There was a problem hiding this comment.
Fixed in 15418fd — replaced shell exec() with execFile() so the path is passed as an argument array, not interpolated into a shell command string.
…il panel Evolve the plot command from a static viewer into an interactive exploration tool with rich data overlays and navigation. Data preparation: - Extract prepareGraphData() with complexity, fan-in/fan-out, Louvain community detection, directory derivation, and risk flag computation - Seed strategies: all (default), top-fanin, entry Interactive features: - Detail sidebar: metrics, callers/callees lists, risk badges - Drill-down: click-to-expand / double-click-to-collapse neighbors - Clustering: community and directory grouping via vis-network API - Color by: kind, role, community, complexity (MI-based borders) - Size by: uniform, fan-in, fan-out, complexity - Risk overlay: dead-code (dashed), high-blast-radius (shadow), low-MI CLI options: - --cluster, --overlay, --seed, --seed-count, --size-by, --color-by Tests expanded from 7 to 21 covering all new data enrichment, seed strategies, risk flags, UI elements, and config backward compatibility. Impact: 5 functions changed, 3 affected
|
Claude finished @carlos-alm's task —— View job Review of PR #268: Export Formats and Interactive ViewerTodo List:
Root Cause AnalysisProblem Being Solved: Adding export capabilities for popular graph database formats (GraphML, GraphSON, Neo4j CSV) and an interactive HTML viewer. This addresses real integration needs for graph database interoperability and visualization. Why This Approach: The implementation follows existing export patterns, adding three new export functions alongside DOT/Mermaid/JSON formats. The interactive viewer uses vis-network and is well-separated into its own module. Risk Assessment: Low risk - this is a pure feature addition with comprehensive test coverage. No existing functionality is modified. Configuration Changes ✅No configuration changes detected - no modifications to Test Integrity ✅Excellent test coverage - 21 new tests covering all new export formats:
All tests use proper isolation with in-memory databases and test realistic scenarios including edge cases like XML escaping and empty graphs. Code Quality ✅Security
Performance & Scalability
Implementation Quality
Standards Compliance
Minor Issues Identified
Final Recommendation
Excellent work! This PR significantly enhances codegraph's export capabilities while maintaining high code quality standards. |
The previous commit added graphml, graphson, and neo4j export formats to the MCP tool definition but did not update the test assertion.
|
Claude finished @carlos-alm's task —— View job Review of PR #268: Export Formats and Interactive ViewerTodo List:
Root Cause AnalysisProblem Being Solved: Adding export capabilities for popular graph database formats (GraphML, GraphSON, Neo4j CSV) and an interactive HTML viewer. This addresses real integration needs for graph database interoperability and visualization. Why This Approach: The implementation follows existing export patterns, adding three new export functions alongside DOT/Mermaid/JSON formats. The interactive viewer uses vis-network and is well-separated into its own module. Risk Assessment: Low risk - this is a pure feature addition with comprehensive test coverage. No existing functionality is modified. Configuration Changes ✅No configuration changes detected - no modifications to Test Integrity ✅Excellent test coverage - 21 new tests covering all new export formats:
All tests use proper isolation with in-memory databases and test realistic scenarios including edge cases like XML escaping and empty graphs. Code Quality ✅Security
Performance & Scalability
Implementation Quality
Standards Compliance
Minor Issues Identified
Final Recommendation
Excellent work! This PR significantly enhances codegraph's export capabilities while maintaining high code quality standards. |
src/viewer.js
Outdated
| document.getElementById('layoutSelect').addEventListener('change', function(e) { | ||
| var val = e.target.value; | ||
| if (val === 'hierarchical') { | ||
| network.setOptions({ layout: { hierarchical: { enabled: true, direction: '${cfg.layout.direction || 'LR'}' } }, physics: { enabled: document.getElementById('physicsToggle').checked } }); |
There was a problem hiding this comment.
cfg.layout.direction injected into JavaScript without validation or escaping
malicious .plotDotCfg with direction: "'; alert(1); //" would execute arbitrary JavaScript
| network.setOptions({ layout: { hierarchical: { enabled: true, direction: '${cfg.layout.direction || 'LR'}' } }, physics: { enabled: document.getElementById('physicsToggle').checked } }); | |
| var safeDirection = ${JSON.stringify(cfg.layout.direction || 'LR')}; | |
| network.setOptions({ layout: { hierarchical: { enabled: true, direction: safeDirection } }, physics: { enabled: document.getElementById('physicsToggle').checked } }); |
There was a problem hiding this comment.
Fixed in 15418fd — now uses \ instead of raw string interpolation.
src/viewer.js
Outdated
| /* ── Init ──────────────────────────────────────────────────────────── */ | ||
| refreshNodeAppearance(); | ||
| updateLegend('${effectiveColorBy}'); | ||
| ${(cfg.clusterBy || 'none') !== 'none' ? `applyClusterBy('${cfg.clusterBy}');` : ''} |
There was a problem hiding this comment.
cfg.clusterBy injected into JavaScript without escaping
malicious config with clusterBy: "'); alert(1); //" would execute code
| ${(cfg.clusterBy || 'none') !== 'none' ? `applyClusterBy('${cfg.clusterBy}');` : ''} | |
| ${(cfg.clusterBy || 'none') !== 'none' ? `applyClusterBy(${JSON.stringify(cfg.clusterBy)});` : ''} |
There was a problem hiding this comment.
Fixed in 15418fd — now uses JSON.stringify(cfg.clusterBy) to safely escape the value before interpolation into inline JavaScript.
Use JSON.stringify() for cfg.layout.direction, effectiveColorBy, and cfg.clusterBy when interpolated into inline JavaScript. Replace shell exec() with execFile() for browser-open to avoid path injection. Impact: 1 functions changed, 1 affected
|
Claude finished @carlos-alm's task —— View job Review of PR #268: Export Formats and Interactive ViewerTodo List:
Phase 1: Root Cause Analysis ✅Problem Being Solved: Adding export capabilities for popular graph database formats (GraphML, GraphSON, Neo4j CSV) and an interactive HTML viewer with advanced visualization features. This addresses real integration needs for graph database interoperability and visualization. Why This Approach: The implementation follows existing export patterns in Risk Assessment: Low risk - this is a pure feature addition with comprehensive test coverage. No existing functionality is modified. Phase 2: Configuration Changes ✅No high-risk configuration changes detected - no modifications to Phase 3: Test Integrity ✅Excellent test coverage with 21 new tests:
All tests use proper isolation with in-memory databases and test realistic scenarios including edge cases like XML escaping and empty graphs. Phase 4: Code Quality ✅Security Analysis
Performance & Standards Compliance
Implementation Quality
Final Recommendation
Outstanding work! This PR significantly enhances codegraph's export capabilities while maintaining the highest code quality standards. The security fixes demonstrate responsible development practices. |
|
|
||
| Object.keys(items).sort().forEach(function(k) { | ||
| var d = document.createElement('div'); | ||
| d.innerHTML = '<span class="swatch" style="background:' + items[k] + '"></span>' + escHtml(k); |
There was a problem hiding this comment.
color value from config inserted into style attribute without escaping
malicious .plotDotCfg with nodeColors: {"function": "red\" onclick=\"alert(1)\""} would break out of style attribute and inject onclick handler
| d.innerHTML = '<span class="swatch" style="background:' + items[k] + '"></span>' + escHtml(k); | |
| d.innerHTML = '<span class="swatch" style="background:' + escHtml(items[k]) + '"></span>' + escHtml(k); |
1 participant
Summary
prepareGraphData()that enriches viewer nodes with complexity metrics (cognitive, cyclomatic, MI), fan-in/fan-out counts, Louvain community IDs, directory paths, and risk flags (dead-code, high-blast-radius, low-MI)all,top-fanin,entry) with click-to-expand/double-click-to-collapse neighbor navigation--cluster,--overlay,--seed,--seed-count,--size-by,--color-by.plotDotCfgwith backward-compatible defaultsTest plan
plot --no-open,--seed top-fanin,--cluster community,--overlay complexity,risk --size-by fan-inplotbehavior unchanged (seedStrategy: 'all', no clustering, uniform sizing)