Skip to content

Analyze any GitHub repository or local folder in the browser, with a rebuilt UI - #6

Merged
harsharajkumar-273 merged 2 commits into
mainfrom
claude/practical-thompson-7w19xy
Oct 22, 2026
Merged

harsharajkumar-273 merged 2 commits into
mainfrom
claude/practical-thompson-7w19xy

Conversation

@harsharajkumar-273

@harsharajkumar-273 harsharajkumar-273 commented Oct 22, 2026 •

Copy link
Copy Markdown
Owner

Why

The hosted demo showed one pre-built graph (Flask) that couldn't be changed, and the UI was hard to read: it opened on a hairball of tiny nodes with no starting point.

What changes for a visitor

  • Paste any public GitHub repository (owner/repo, owner/repo@branch, or a github.com link) or drop/choose a local folder. The analysis runs in the visitor's browser (the parser is WebAssembly in a Web Worker), so nothing is uploaded and hosting needs no server.
  • Shareable links: ?repo=owner/repo opens that analysis.
  • Landing, progress, workspace instead of a single dense screen:
    • the landing page has examples, drag-and-drop anywhere, and clear errors (not found / private / GitHub rate limit with the reset time);
    • the workspace opens on a folder map with a "Riskiest to change" list, plus search (/), a file tree, and breadcrumbs;
    • the inspector shows the blast radius with a confidence bar, the affected symbols by distance, tests to run, callers, callees, and the source (with a GitHub link).
  • Readable graphs: the blast radius fans out from the changed code; test functions fold into one node per test file; a very large radius folds into one node per file; selecting a file shows its import neighbourhood; the view frames the selection and re-frames when the canvas resizes.
  • Mobile layout (menu drawer, bottom sheet), keyboard navigation, no console noise.

How

  • @codegraph/parser is split into an environment-neutral core plus a Node entry and a browser entry that finds each .wasm by URL. @codegraph/extractors gets a ./browser entry; node:path is replaced by a small POSIX module, indexFiles is separate from the file-system indexer, and the file-selection rules (filter.ts) are shared by the CLI and the browser loaders.
  • packages/web: repo-input parser, GitHub loader (tree API + raw.githubusercontent.com, 2 API calls per analysis), local-folder loader (prunes node_modules before reading), indexing worker with progress and cancel.
  • Vercel build is now just the web build; the pre-baked graph and build:demo are gone. docs/DEPLOY.md, the README (with a screenshot) and the changelog are updated.
  • codegraph serve marks the page it serves, so the app only probes /api/graph when a graph is waiting.

Testing

  • 98 tests pass (was 67), typecheck clean. New: path helpers against node:path.posix; in-memory indexing gives a graph identical to on-disk indexing on 7 fixtures, including through a fake GitHub; repo-input parsing; file selection and trimming; GitHub errors (404, rate limit with and without readable headers, offline, cancel); local folders; the graph model (test folding, auto-fold, neighbourhood layout, confidence filter). I confirmed the folding and neighbourhood tests fail when those features are disabled.
  • End to end in headless Chromium against the built site, with api.github.com and raw.githubusercontent.com mocked from local clones: analyze, drill down, select a file, code tab, file tree, search and Enter, callers and callees, Escape, return to the landing page, a phone viewport, a folder via the picker, a graph.json, a shared ?repo= link, and each error. 17 of 17 checks pass.
  • Scale (in the browser, instant mocked downloads): Zod (523 files) 6 s, Hono (450) 4 s, NestJS (2,155 files, 11,952 calls) 9 s, under 60 MB of memory.
  • codegraph serve (built bundle) still opens straight onto its graph; the bundled CLI still indexes TypeScript and Python; npm ci and the lockfile are in sync; the packed npm tarball is 0.9 MB (6.7 MB unpacked).

Not verified

The real api.github.com couldn't be reached from the sandbox, so the GitHub loader is tested against mocks that follow GitHub's documented responses and CORS headers (and raw.githubusercontent.com was checked live: it sends access-control-allow-origin: *). After deploying, open ?repo=pallets/flask once to confirm against the real API. A branch name containing / is only understood in the owner/repo@feature/x form.

After merging

In Vercel keep Root Directory at packages/web and redeploy; no settings change.

Makes the in-memory indexing path free of Node-only imports so a page
can analyze a repository without a server:

- parser: split into an environment-neutral core plus a Node entry and a
  browser entry that finds each .wasm by URL (Vite ?url assets)
- extractors: node:path replaced by a small posix module, indexFiles
  moved out of the file-system indexer, the file-selection rules shared
  in filter.ts, and a ./browser entry point
- web: repo-input parser, a GitHub loader (tree API + raw files, with
  rate-limit / not-found / size handling), a local-folder loader for the
  picker and drag-and-drop, and an indexing Web Worker with progress

Parity is tested: path helpers against node:path.posix, and in-memory
indexing against the on-disk indexer on seven fixtures, including via a
fake GitHub. The worker was also run in Chromium on TS, TSX, JS and
Python.

Co-Authored-By: Claude Sonnet 5.5 <[email protected]>
Claude-Session: https://claude.ai/code/session_01ENHRK3kgqcVwqwyjswRViM
The hosted demo was one pre-built graph with an unreadable UI. The page
now takes a public GitHub repository (owner/repo, owner/repo@branch or a
github.com link) or a dropped/chosen local folder and analyzes it in a
Web Worker, with nothing uploaded. ?repo= links are shareable.

UI, rebuilt around landing -> progress -> workspace:
- landing page with examples, drag-and-drop anywhere, clear errors
  (not found, private repo, rate limit with the reset time)
- workspace: overview of the riskiest code, search ("/"), file tree,
  breadcrumbs, a toolbar for view / analysis / confidence / depth
- inspector: blast radius with a confidence bar, grouped impacted
  symbols, tests to run, callers, callees, source with a GitHub link
- graph readability: node cards, blast radius fans out from the changed
  code, test functions fold into one node per test file, a very large
  radius folds into one node per file, selecting a file shows its import
  neighbourhood (ego layout), the view frames the selection and re-frames
  when the canvas resizes
- keyboard, mobile layout (drawer + bottom sheet), no console noise

Also: codegraph serve marks the page it serves so the app only probes
/api/graph when a graph is waiting; the Vercel build is now just the web
build (no pre-baked graph); deploy guide, README and changelog updated.

Verified in headless Chromium against the built site with GitHub's API
mocked from local clones: Flask, Zod (523 files), Hono and NestJS (2,155
files, 9s) analyze and render; folder picker, graph.json, shared links,
errors and the CLI-served mode all work.

Co-Authored-By: Claude Sonnet 5.5 <[email protected]>
Claude-Session: https://claude.ai/code/session_01ENHRK3kgqcVwqwyjswRViM
@vercel

vercel Bot commented Oct 22, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
codegraph Ready Ready Preview Oct 22, 2026 5:01am UTC

@coderabbitai

coderabbitai Bot commented Oct 22, 2026

Copy link
Copy Markdown

Important

  • 🔍 Trigger review

This repository does not receive automatic reviews because it has fewer than 10 stars.

⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: 9f2a8fc2-9c6b-4d8b-885e-eea83c7ec9be
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

@harsharajkumar-273
harsharajkumar-273 merged commit b354cd4 into main Oct 22, 2026
5 checks passed
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.

2 participants