Skip to content

feat: add codegraph view — interactive zoomable HTML graph#1198

Open
rohitagr0310 wants to merge 4 commits into
colbymchenry:mainfrom
rohitagr0310:feat/view-command-clean
Open

feat: add codegraph view — interactive zoomable HTML graph#1198
rohitagr0310 wants to merge 4 commits into
colbymchenry:mainfrom
rohitagr0310:feat/view-command-clean

Conversation

@rohitagr0310

@rohitagr0310 rohitagr0310 commented Jul 7, 2026

Copy link
Copy Markdown

Closes #1197

What this adds

A codegraph view command that renders the indexed graph as a single self-contained HTML file and opens it in your browser automatically.

codegraph view                       # whole graph — opens in browser
codegraph view --no-open             # write HTML only, no browser
codegraph view --file campaign.ts    # this file's symbols + 1-hop neighbors
codegraph view --symbol run_campaign # this symbol + immediate neighborhood
codegraph view --include-imports     # show import/export/reference edges
codegraph view --max-nodes 400       # raise node cap (default 250)
codegraph view -o graph.html         # override output path

Design decisions

  • Auto-open by defaultcodegraph view starts a loopback-only HTTP server and opens the browser immediately; --no-open writes the file only
  • Fully offline — vis-network is inlined at build time, no CDN, matches CodeGraph's local-first design
  • No working-tree litter — default output is <project>/.codegraph/codegraph_view.html (already gitignored)
  • Zero new runtime deps — vis-network bundled into assets/vis-network.min.js, copied to dist/ by copy-assets
  • Narrow public APICodeGraph.getGraphView() wraps data assembly; raw DB handle stays private

Files changed

File Change
src/graph/viewer.ts New — data assembly, renderViewerHtml, EmptyGraphViewError
src/bin/codegraph.ts New view subcommand
src/index.ts New getGraphView() public method
assets/vis-network.min.js Inlined vis-network (bundled, not fetched)
__tests__/cli-view-command.test.ts New — contract tests for the command
README.md Docs for codegraph view

rohitagarwal-sp18 and others added 4 commits July 7, 2026 13:29
Renders the index as a zoomable, searchable HTML graph (nodes colored
by kind, sized by degree). vis-network is bundled and inlined so the
page works fully offline — no CDN — matching CodeGraph's local-first
design. `--open` serves it on a loopback port and opens the browser.

Data assembly lives in src/graph/viewer.ts and is exposed via a narrow
typed CodeGraph.getGraphView(), keeping the raw SQLite handle private.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Write codegraph_view.html inside the project's .codegraph/ directory by
default instead of the current working directory. That dir is already
gitignored, so a `view` never litters the working tree. An explicit -o
is still honored, resolved against the cwd.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
`codegraph view` now opens the graph in the browser immediately without
requiring an extra flag. Use `--no-open` to write the HTML file only.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@rohitagr0310

Copy link
Copy Markdown
Author

Screenshots

Whole-graph view — codegraph view

250 highest-degree symbols, nodes colored by kind, sized by connection count:

Whole graph view


Symbol neighborhood — codegraph view --symbol ExtractionOrchestrator

Scoped to one symbol + its immediate callers/callees. Edge labels show relationship kind (calls, contains, instantiates):

Symbol neighborhood view

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat: add codegraph view — interactive zoomable HTML graph

2 participants