ng-dependency-graph icon indicating copy to clipboard operation
ng-dependency-graph copied to clipboard

Add JSON export functionality for dependency graph data

Open Copilot opened this issue 5 months ago • 1 comments

This PR implements a comprehensive JSON export feature for the AngularJS dependency graph extension, allowing users to export their current graph data for external analysis and integration workflows.

Changes

UI Enhancement:

  • Added an "Export as JSON" button in the Options section of the info panel
  • Applied consistent styling that matches the existing UI design

Core Implementation:

  • Created exportService.js with methods to serialize graph data and handle file downloads
  • Updated InfoPanelCtrl.js to handle export functionality with proper error handling
  • Added the new service to the application module loading sequence

Export Features:

  • Exports complete graph structure including all nodes, links, and dependency relationships
  • Captures current view state (active filters, scope selection, selected node)
  • Includes node positions for visual state recreation
  • Adds comprehensive metadata (export timestamp, version, graph statistics)
  • Handles circular references properly to create clean JSON output
  • Works seamlessly with both modules and components views

Data Structure: The exported JSON follows a structured format containing:

{
  "metadata": {
    "exportedAt": "2025-09-08T10:20:12.186Z",
    "exportVersion": "1.0.0",
    "scope": "components",
    "totalNodes": 60,
    "totalLinks": 77
  },
  "currentView": {
    "scope": "components",
    "filters": { /* current filter state */ },
    "options": { /* current options state */ },
    "selectedNode": { /* currently selected node */ }
  },
  "graph": {
    "nodes": [ /* all graph nodes with dependencies */ ],
    "links": [ /* all connections between nodes */ ]
  }
}

Testing & Quality:

  • Created comprehensive unit tests covering all export scenarios
  • Manually tested functionality in both modules and components views
  • Verified proper error handling for edge cases
  • Updated README.md documentation with feature details

The feature enables users to backup their current graph state, perform external data analysis, and integrate dependency information with other development tools and workflows.

Export Feature

Fixes #22.


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

Copilot avatar Sep 08 '25 10:09 Copilot