An AI-powered tool for exploring and understanding GitHub repositories. Connect any public repo, ask questions in natural language, and get visual explanations with dependency graphs, architecture diagrams, and traceable logic flows.

• Natural language Q&A — Ask how authentication works, where the API layer is, or how services connect
• Interactive visualizations — Dependency maps, request flow diagrams, and architecture graphs rendered on an interactive canvas
• Code viewer — Highlighted code snippets with exact file paths and line numbers
• File tree browser — Navigate the full repository structure
• Configurable LLM backend — Switch between OpenAI and Ollama (local) from the in-app settings

• Next.js 16 / React 19
• CopilotKit for AI chat and actions
• React Flow (@xyflow/react) + dagre for graph layout
• Octokit for GitHub API access
• Zustand for state management
• Tailwind CSS v4

• Node.js 18+
• One of the following LLM backends:
  • Ollama (default) — install from ollama.com and pull a model (default: qwen2.5)
  • OpenAI — an API key with access to chat completions

1. Install dependencies:

npm install

2. (Optional) Set environment variables to override defaults:

# Defaults to Ollama at localhost:11434 with qwen2.5
export OPENAI_BASE_URL="http://localhost:11434/v1"
export OPENAI_API_KEY="ollama"
export OPENAI_MODEL="qwen2.5"

Or configure the LLM provider from the Settings modal in the app UI.

3. Start the development server:

npm run dev

4. Open http://localhost:3000 and enter a GitHub repository (e.g. owner/repo or a full GitHub URL).

src/
├── app/
│   ├── api/
│   │   ├── copilotkit/    # CopilotKit runtime endpoint
│   │   ├── github/        # GitHub API proxy (file, search, tree)
│   │   └── settings/      # LLM settings persistence
│   ├── layout.tsx
│   └── page.tsx
├── components/
│   ├── flow/              # React Flow node types (FileNode, FunctionNode, ModuleNode, CustomEdge)
│   ├── panels/            # Main UI panels (Chat, CodeViewer, Analysis, Repository, VisualizationCanvas)
│   ├── AppLayout.tsx      # Main app shell after repo is loaded
│   ├── CopilotProvider.tsx
│   ├── LandingPage.tsx    # Initial repo input screen
│   ├── RepoInput.tsx
│   └── SettingsModal.tsx
├── hooks/                 # Custom hooks (useCopilotActions, useCopilotContext, useRepository)
├── lib/                   # Core logic (analyzer, github client, graph layout, file fetching)
├── store/                 # Zustand stores (app state, settings)
└── types/                 # TypeScript type definitions

Tests use Vitest with Testing Library.

npx vitest