@reactgraph/cli 0.1.1

package/src/parser/extractors/state.ts

@@ -0,0 +1,392 @@
+import type Parser from 'tree-sitter';
+import type { GraphNode, GraphEdge } from '../../graph/schema.js';
+import { nodeId, findAll, findEnclosingFunction } from './types.js';
+import type { ExtractionResult } from './types.js';
+
+/**
+ * State management extractor — detects Zustand, Redux Toolkit, Jotai, and Recoil stores.
+ *
+ * Creation patterns:
+ *   Zustand:  const useStore = create((set) => ({ ... }))
+ *   Redux:    const slice = createSlice({ name, initialState, reducers })
+ *   Jotai:    const atom = atom(defaultValue)
+ *   Recoil:   const state = atom({ key, default })
+ */
+export function extractState(
+  tree: Parser.Tree,
+  filePath: string,
+  sourceCode: string,
+  existingNodes: GraphNode[],
+): ExtractionResult {
+  const nodes: GraphNode[] = [];
+  const edges: GraphEdge[] = [];
+  const root = tree.rootNode;
+
+  // Build function map for edge sources
+  const functionNodes = new Map<string, GraphNode>();
+  for (const n of existingNodes) {
+    if (n.file === filePath && (n.kind === 'Component' || n.kind === 'Hook')) {
+      functionNodes.set(n.name, n);
+    }
+  }
+
+  // Pass 1: Detect store definitions
+  const storeNames = new Map<string, { id: string; library: string }>();
+
+  for (let i = 0; i < root.childCount; i++) {
+    const child = root.child(i)!;
+    const store = detectStoreCreation(child, filePath);
+    if (store) {
+      nodes.push(store);
+      storeNames.set(store.name, { id: store.id, library: store.meta.library as string });
+    }
+
+    if (child.type === 'export_statement') {
+      for (let j = 0; j < child.childCount; j++) {
+        const store2 = detectStoreCreation(child.child(j)!, filePath);
+        if (store2) {
+          store2.exportType = child.text.startsWith('export default') ? 'default' : 'named';
+          nodes.push(store2);
+          storeNames.set(store2.name, { id: store2.id, library: store2.meta.library as string });
+        }
+      }
+    }
+  }
+
+  // Also build a map of stores from other files (via existingNodes)
+  for (const n of existingNodes) {
+    if (n.kind === 'Store' && !storeNames.has(n.name)) {
+      storeNames.set(n.name, { id: n.id, library: (n.meta.library as string) ?? 'unknown' });
+    }
+  }
+
+  // Pass 2: Detect reads/writes in components and hooks
+  const callExprs = findAll(root, 'call_expression');
+  for (const call of callExprs) {
+    const callee = call.childForFieldName('function');
+    if (!callee) continue;
+
+    const enclosingFn = findEnclosingFunction(call);
+    if (!enclosingFn) continue;
+    const enclosingName = getFunctionName(enclosingFn);
+    if (!enclosingName) continue;
+    const enclosingNode = functionNodes.get(enclosingName);
+    if (!enclosingNode) continue;
+
+    // Zustand: useAuthStore() or useAuthStore(selector)
+    const calleeName = callee.type === 'identifier' ? callee.text : null;
+    if (calleeName && storeNames.has(calleeName)) {
+      const store = storeNames.get(calleeName)!;
+      edges.push({
+        source: enclosingNode.id,
+        target: store.id,
+        kind: 'reads_store',
+        meta: { library: store.library },
+      });
+      continue;
+    }
+
+    // Zustand: useAuthStore.getState() — reads
+    if (callee.type === 'member_expression') {
+      const obj = callee.childForFieldName('object');
+      const prop = callee.childForFieldName('property');
+      if (obj && prop) {
+        const objName = obj.text;
+        if (storeNames.has(objName)) {
+          const store = storeNames.get(objName)!;
+          if (prop.text === 'getState') {
+            edges.push({
+              source: enclosingNode.id,
+              target: store.id,
+              kind: 'reads_store',
+              meta: { library: store.library, method: 'getState' },
+            });
+          } else if (prop.text === 'setState') {
+            edges.push({
+              source: enclosingNode.id,
+              target: store.id,
+              kind: 'writes_store',
+              meta: { library: store.library, method: 'setState' },
+            });
+          }
+          continue;
+        }
+      }
+    }
+
+    // Redux: useSelector(selector)
+    if (calleeName === 'useSelector') {
+      // Try to find which slice via the selector argument
+      const args = call.childForFieldName('arguments');
+      const selectorText = args?.child(1)?.text ?? '';
+
+      // Find matching store by checking if selector references store name
+      for (const [name, store] of storeNames) {
+        if (store.library === 'redux' && selectorText.includes(name.replace('Slice', ''))) {
+          edges.push({
+            source: enclosingNode.id,
+            target: store.id,
+            kind: 'reads_store',
+            meta: { library: 'redux', selector: selectorText },
+          });
+        }
+      }
+      // If no specific store found, create a generic edge
+      if (!edges.some(e => e.source === enclosingNode.id && e.kind === 'reads_store')) {
+        edges.push({
+          source: enclosingNode.id,
+          target: 'unresolved:redux-store',
+          kind: 'reads_store',
+          meta: { library: 'redux', selector: selectorText },
+        });
+      }
+      continue;
+    }
+
+    // Redux: useDispatch() — we track dispatch calls separately
+    // The actual writes happen when dispatch(action()) is called
+
+    // Jotai: useAtom(atom), useAtomValue(atom), useSetAtom(atom)
+    if (calleeName === 'useAtom' || calleeName === 'useAtomValue' || calleeName === 'useSetAtom') {
+      const args = call.childForFieldName('arguments');
+      const atomArg = args?.child(1);
+      if (atomArg) {
+        const atomName = atomArg.text;
+        const store = storeNames.get(atomName);
+        const targetId = store?.id ?? `unresolved:${atomName}`;
+
+        if (calleeName === 'useSetAtom') {
+          edges.push({
+            source: enclosingNode.id,
+            target: targetId,
+            kind: 'writes_store',
+            meta: { library: 'jotai' },
+          });
+        } else if (calleeName === 'useAtomValue') {
+          edges.push({
+            source: enclosingNode.id,
+            target: targetId,
+            kind: 'reads_store',
+            meta: { library: 'jotai' },
+          });
+        } else {
+          // useAtom — both read and write
+          edges.push({
+            source: enclosingNode.id,
+            target: targetId,
+            kind: 'reads_store',
+            meta: { library: 'jotai' },
+          });
+          edges.push({
+            source: enclosingNode.id,
+            target: targetId,
+            kind: 'writes_store',
+            meta: { library: 'jotai' },
+          });
+        }
+      }
+      continue;
+    }
+
+    // Recoil: useRecoilState, useRecoilValue, useSetRecoilState
+    if (calleeName === 'useRecoilState' || calleeName === 'useRecoilValue' || calleeName === 'useSetRecoilState') {
+      const args = call.childForFieldName('arguments');
+      const atomArg = args?.child(1);
+      if (atomArg) {
+        const atomName = atomArg.text;
+        const store = storeNames.get(atomName);
+        const targetId = store?.id ?? `unresolved:${atomName}`;
+
+        if (calleeName === 'useSetRecoilState') {
+          edges.push({
+            source: enclosingNode.id,
+            target: targetId,
+            kind: 'writes_store',
+            meta: { library: 'recoil' },
+          });
+        } else if (calleeName === 'useRecoilValue') {
+          edges.push({
+            source: enclosingNode.id,
+            target: targetId,
+            kind: 'reads_store',
+            meta: { library: 'recoil' },
+          });
+        } else {
+          edges.push({
+            source: enclosingNode.id,
+            target: targetId,
+            kind: 'reads_store',
+            meta: { library: 'recoil' },
+          });
+          edges.push({
+            source: enclosingNode.id,
+            target: targetId,
+            kind: 'writes_store',
+            meta: { library: 'recoil' },
+          });
+        }
+      }
+      continue;
+    }
+  }
+
+  return { nodes, edges };
+}
+
+function detectStoreCreation(node: Parser.SyntaxNode, filePath: string): GraphNode | null {
+  if (node.type !== 'lexical_declaration') return null;
+
+  const declarator = findDirectChild(node, 'variable_declarator');
+  if (!declarator) return null;
+
+  const nameNode = declarator.childForFieldName('name');
+  const value = declarator.childForFieldName('value');
+  if (!nameNode || !value) return null;
+
+  if (value.type !== 'call_expression') return null;
+
+  const callee = value.childForFieldName('function');
+  if (!callee) return null;
+
+  const calleeName = callee.text;
+
+  // Zustand: create(...) or create<Type>(...)
+  if (calleeName === 'create') {
+    const shape = extractObjectShape(value);
+    return {
+      id: nodeId(filePath, nameNode.text),
+      kind: 'Store',
+      name: nameNode.text,
+      file: filePath,
+      line: node.startPosition.row + 1,
+      exportType: 'none',
+      meta: { library: 'zustand', shape },
+    };
+  }
+
+  // Redux: createSlice({ name, initialState, reducers })
+  if (calleeName === 'createSlice') {
+    const shape = extractSliceShape(value);
+    return {
+      id: nodeId(filePath, nameNode.text),
+      kind: 'Store',
+      name: nameNode.text,
+      file: filePath,
+      line: node.startPosition.row + 1,
+      exportType: 'none',
+      meta: { library: 'redux', shape },
+    };
+  }
+
+  // Jotai: atom(defaultValue)
+  if (calleeName === 'atom') {
+    // Distinguish Jotai from Recoil: Recoil's atom takes { key, default }
+    const args = value.childForFieldName('arguments');
+    const firstArg = args?.child(1);
+    const isRecoil = firstArg?.type === 'object' && firstArg.text.includes('key');
+
+    if (isRecoil) {
+      return {
+        id: nodeId(filePath, nameNode.text),
+        kind: 'Store',
+        name: nameNode.text,
+        file: filePath,
+        line: node.startPosition.row + 1,
+        exportType: 'none',
+        meta: { library: 'recoil' },
+      };
+    }
+
+    return {
+      id: nodeId(filePath, nameNode.text),
+      kind: 'Store',
+      name: nameNode.text,
+      file: filePath,
+      line: node.startPosition.row + 1,
+      exportType: 'none',
+      meta: { library: 'jotai' },
+    };
+  }
+
+  return null;
+}
+
+function extractObjectShape(callNode: Parser.SyntaxNode): string[] {
+  // Look for the object returned by the zustand creator function
+  const args = callNode.childForFieldName('arguments');
+  if (!args) return [];
+
+  // The first arg to create() is (set) => ({ key1, key2, ... })
+  const creator = args.child(1);
+  if (!creator) return [];
+
+  // Find object or parenthesized_expression containing object
+  const objects = findAll(creator, 'object');
+  if (objects.length === 0) return [];
+
+  const obj = objects[0]!;
+  const keys: string[] = [];
+  for (let i = 0; i < obj.childCount; i++) {
+    const child = obj.child(i)!;
+    if (child.type === 'pair' || child.type === 'method_definition') {
+      const key = child.childForFieldName('key') ?? child.childForFieldName('name');
+      if (key) keys.push(key.text);
+    } else if (child.type === 'shorthand_property') {
+      keys.push(child.text);
+    }
+  }
+
+  return keys;
+}
+
+function extractSliceShape(callNode: Parser.SyntaxNode): string[] {
+  // createSlice({ initialState: { key1, key2 }, reducers: { ... } })
+  const args = callNode.childForFieldName('arguments');
+  if (!args) return [];
+
+  const configObj = args.child(1);
+  if (!configObj || configObj.type !== 'object') return [];
+
+  // Find initialState property
+  for (let i = 0; i < configObj.childCount; i++) {
+    const child = configObj.child(i)!;
+    if (child.type === 'pair') {
+      const key = child.childForFieldName('key');
+      if (key?.text === 'initialState') {
+        const val = child.childForFieldName('value');
+        if (val?.type === 'object') {
+          const keys: string[] = [];
+          for (let j = 0; j < val.childCount; j++) {
+            const prop = val.child(j)!;
+            if (prop.type === 'pair') {
+              const k = prop.childForFieldName('key');
+              if (k) keys.push(k.text);
+            }
+          }
+          return keys;
+        }
+      }
+    }
+  }
+
+  return [];
+}
+
+function getFunctionName(node: Parser.SyntaxNode): string | null {
+  const nameField = node.childForFieldName('name');
+  if (nameField) return nameField.text;
+  if (node.type === 'arrow_function' || node.type === 'function_expression') {
+    const parent = node.parent;
+    if (parent?.type === 'variable_declarator') {
+      return parent.childForFieldName('name')?.text ?? null;
+    }
+  }
+  return null;
+}
+
+function findDirectChild(node: Parser.SyntaxNode, type: string): Parser.SyntaxNode | null {
+  for (let i = 0; i < node.childCount; i++) {
+    if (node.child(i)!.type === type) return node.child(i)!;
+  }
+  return null;
+}

package/src/parser/extractors/types.ts

@@ -0,0 +1,71 @@
+import type Parser from 'tree-sitter';
+import type { GraphNode, GraphEdge } from '../../graph/schema.js';
+
+export interface ExtractionResult {
+  nodes: GraphNode[];
+  edges: GraphEdge[];
+}
+
+export type Extractor = (
+  tree: Parser.Tree,
+  filePath: string,
+  sourceCode: string,
+  existingNodes: GraphNode[],
+) => ExtractionResult;
+
+/** Generate a stable node ID from file path and name */
+export function nodeId(filePath: string, name: string): string {
+  return `${filePath}:${name}`;
+}
+
+/** Check if a name starts with uppercase (React component convention) */
+export function isPascalCase(name: string): boolean {
+  return /^[A-Z]/.test(name);
+}
+
+/** Check if a name matches hook convention: use + uppercase char */
+export function isHookName(name: string): boolean {
+  return /^use[A-Z]/.test(name);
+}
+
+/** Walk all descendants of a tree-sitter node */
+export function* walkTree(node: Parser.SyntaxNode): Generator<Parser.SyntaxNode> {
+  yield node;
+  for (let i = 0; i < node.childCount; i++) {
+    yield* walkTree(node.child(i)!);
+  }
+}
+
+/** Find all descendants matching a type */
+export function findAll(node: Parser.SyntaxNode, type: string): Parser.SyntaxNode[] {
+  const results: Parser.SyntaxNode[] = [];
+  for (const n of walkTree(node)) {
+    if (n.type === type) results.push(n);
+  }
+  return results;
+}
+
+/** Find first descendant matching a type */
+export function findFirst(node: Parser.SyntaxNode, type: string): Parser.SyntaxNode | null {
+  for (const n of walkTree(node)) {
+    if (n.type === type) return n;
+  }
+  return null;
+}
+
+/** Walk up to find the nearest enclosing function/arrow */
+export function findEnclosingFunction(node: Parser.SyntaxNode): Parser.SyntaxNode | null {
+  let current = node.parent;
+  while (current) {
+    if (
+      current.type === 'function_declaration' ||
+      current.type === 'arrow_function' ||
+      current.type === 'function_expression' ||
+      current.type === 'method_definition'
+    ) {
+      return current;
+    }
+    current = current.parent;
+  }
+  return null;
+}

package/src/parser/indexer.ts

@@ -0,0 +1,197 @@
+import { readFile, writeFile, mkdir } from 'node:fs/promises';
+import { createHash } from 'node:crypto';
+import { join } from 'node:path';
+import { ReactGraph } from '../graph/graph.js';
+import { saveGraph, loadGraph } from '../graph/serialize.js';
+import { walkProject } from './walker.js';
+import { processFile } from './pipeline.js';
+import type { GraphNode } from '../graph/schema.js';
+
+export interface IndexStats {
+  totalFiles: number;
+  parsedFiles: number;
+  skippedFiles: number;
+  nodes: number;
+  edges: number;
+  durationMs: number;
+}
+
+interface FileHashes {
+  [relativePath: string]: string;
+}
+
+export async function indexProject(
+  projectDir: string,
+  exclude: string[] = [],
+  onProgress?: (file: string, current: number, total: number) => void,
+): Promise<{ graph: ReactGraph; stats: IndexStats }> {
+  const start = Date.now();
+
+  const files = await walkProject(projectDir, exclude);
+
+  const oldHashes = await loadHashes(projectDir);
+  const existingGraph = await loadGraph(projectDir);
+  const newHashes: FileHashes = {};
+
+  // --- Pass 1: Extract all nodes + intra-file edges ---
+  // Accumulate globalNodes so later files can see stores/contexts from earlier ones
+  const globalNodes: GraphNode[] = [];
+  const graph = new ReactGraph();
+  let parsedFiles = 0;
+  let skippedFiles = 0;
+  const parsedFilePaths: string[] = []; // track which files we actually parsed
+
+  for (let i = 0; i < files.length; i++) {
+    const { absolutePath, relativePath } = files[i]!;
+
+    onProgress?.(relativePath, i + 1, files.length);
+
+    const content = await readFile(absolutePath, 'utf-8');
+    const hash = computeHash(content);
+    newHashes[relativePath] = hash;
+
+    // Reuse from cache if unchanged
+    if (oldHashes[relativePath] === hash && existingGraph) {
+      const existingNodes = existingGraph.getNodesByFile(relativePath);
+      for (const node of existingNodes) {
+        graph.addNode(node);
+        globalNodes.push(node);
+      }
+      const existingEdges = existingNodes.flatMap(n => [
+        ...existingGraph.getEdgesFrom(n.id),
+        ...existingGraph.getEdgesTo(n.id),
+      ]);
+      const seen = new Set<string>();
+      for (const edge of existingEdges) {
+        const key = `${edge.source}|${edge.target}|${edge.kind}`;
+        if (!seen.has(key)) {
+          seen.add(key);
+          graph.addEdge(edge);
+        }
+      }
+      skippedFiles++;
+      continue;
+    }
+
+    try {
+      const result = await processFile(relativePath, projectDir, globalNodes);
+      for (const node of result.nodes) {
+        graph.addNode(node);
+        globalNodes.push(node);
+      }
+      for (const edge of result.edges) graph.addEdge(edge);
+      parsedFiles++;
+      parsedFilePaths.push(relativePath);
+    } catch (err) {
+      console.error(`Warning: failed to parse ${relativePath}: ${err}`);
+      parsedFiles++;
+    }
+  }
+
+  // --- Pass 2: Re-process early files that missed cross-file references ---
+  // Files processed before stores/contexts were discovered may lack edges.
+  // Re-run only files that were parsed in pass 1 AND processed before a
+  // store/context/hook was discovered in a later file.
+  const crossFileNodeKinds = new Set(['Store', 'Context', 'Hook', 'Component']);
+  const allCrossFileNodes = globalNodes.filter(n => crossFileNodeKinds.has(n.kind));
+
+  if (allCrossFileNodes.length > 0 && parsedFilePaths.length > 1) {
+    // Find files that were processed before cross-file targets existed
+    const crossFileNodeFiles = new Set(allCrossFileNodes.map(n => n.file));
+
+    for (const filePath of parsedFilePaths) {
+      // Skip files that define the cross-file nodes themselves
+      if (crossFileNodeFiles.has(filePath)) continue;
+
+      // Re-process with full global node visibility
+      try {
+        // Remove old edges from this file's nodes
+        graph.removeNodesByFile(filePath);
+
+        const result = await processFile(filePath, projectDir, globalNodes);
+        for (const node of result.nodes) graph.addNode(node);
+        for (const edge of result.edges) graph.addEdge(edge);
+      } catch {
+        // Already processed in pass 1, skip errors
+      }
+    }
+  }
+
+  // Resolution pass: replace remaining unresolved targets
+  resolveUnresolvedEdges(graph);
+
+  await saveGraph(graph, projectDir);
+  await saveHashes(projectDir, newHashes);
+
+  const stats: IndexStats = {
+    totalFiles: files.length,
+    parsedFiles,
+    skippedFiles,
+    nodes: graph.stats().totalNodes,
+    edges: graph.stats().totalEdges,
+    durationMs: Date.now() - start,
+  };
+
+  return { graph, stats };
+}
+
+function computeHash(content: string): string {
+  return createHash('sha256').update(content).digest('hex').slice(0, 16);
+}
+
+async function loadHashes(projectDir: string): Promise<FileHashes> {
+  try {
+    const raw = await readFile(join(projectDir, '.reactgraph', 'file-hashes.json'), 'utf-8');
+    return JSON.parse(raw);
+  } catch {
+    return {};
+  }
+}
+
+async function saveHashes(projectDir: string, hashes: FileHashes): Promise<void> {
+  const dir = join(projectDir, '.reactgraph');
+  await mkdir(dir, { recursive: true });
+  await writeFile(join(dir, 'file-hashes.json'), JSON.stringify(hashes, null, 2));
+}
+
+/**
+ * Replace unresolved edge targets with actual node IDs.
+ */
+function resolveUnresolvedEdges(graph: ReactGraph): void {
+  const allNodes = graph.getAllNodes();
+  const nameToId = new Map<string, string>();
+
+  for (const node of allNodes) {
+    if (node.kind === 'Component' || node.kind === 'Hook' || node.kind === 'Store' || node.kind === 'Context') {
+      if (!nameToId.has(node.name)) {
+        nameToId.set(node.name, node.id);
+      }
+    }
+  }
+
+  const oldEdges = graph.getAllEdges();
+  const resolvedEdges = oldEdges.map(edge => {
+    let { source, target } = edge;
+    let changed = false;
+
+    if (source.startsWith('unresolved:')) {
+      const name = source.slice(11);
+      const resolved = nameToId.get(name);
+      if (resolved) { source = resolved; changed = true; }
+    }
+
+    if (target.startsWith('unresolved:')) {
+      const name = target.slice(11);
+      const resolved = nameToId.get(name);
+      if (resolved) { target = resolved; changed = true; }
+    }
+
+    return changed ? { ...edge, source, target } : edge;
+  });
+
+  if (resolvedEdges.some((e, i) => e !== oldEdges[i])) {
+    graph.clear();
+    for (const node of allNodes) graph.addNode(node);
+    for (const edge of resolvedEdges) graph.addEdge(edge);
+  }
+}