@@ -0,0 +1,15 @@
+/* Same-origin, read-only graph API. Responses are operation JSON payloads. */
+export async function fetchRead<T>(
+  endpoint: "projects" | "schema" | "snippet",
+  args: Record<string, string | number | boolean> = {},
+): Promise<T> {
+  const query = new URLSearchParams();
+  for (const [key, value] of Object.entries(args)) query.set(key, String(value));
+  const res = await fetch(`/api/${endpoint}?${query}`);
+  if (!res.ok) {
+    // Error bodies are not always JSON (plain-text 404, proxy error pages).
+    const body = (await res.json().catch(() => null)) as { error?: string } | null;
+    throw new Error(body?.error ?? `HTTP ${res.status}: ${res.statusText}`);
+  }
+  return (await res.json()) as T;
+}
@@ -1,17 +1,11 @@
 /* @vitest-environment jsdom */
 import "@testing-library/jest-dom/vitest";
 import { fireEvent, render, screen } from "@testing-library/react";
-import { describe, expect, it, vi } from "vitest";
+import { afterEach, describe, expect, it, vi } from "vitest";
 import { NodeDetailPanel } from "./NodeDetailPanel";
 import type { GraphNode, RepoInfo } from "../lib/types";
 
-/* Mock the RPC layer so "Show code" resolves without a backend. */
-const callToolMock = vi.fn();
-vi.mock("../api/rpc", () => ({
-  callTool: (...args: unknown[]) => callToolMock(...args),
-  RpcError: class extends Error {},
-}));
-
+const fetchMock = vi.fn();
 const NODE: GraphNode = {
   id: 7,
   x: 0,
@@ -40,10 +34,12 @@ const REPO: RepoInfo = {
 };
 
 describe("NodeDetailPanel code preview + deep-link", () => {
+  afterEach(() => vi.unstubAllGlobals());
   it("renders fetched source as escaped text, never as injected HTML", async () => {
     /* A payload that would execute if the code were rendered as raw HTML. */
     const payload = "<script>window.__pwned = true;</script>\nconst answer = 42;";
-    callToolMock.mockResolvedValueOnce({ source: payload });
+    vi.stubGlobal("fetch", fetchMock);
+    fetchMock.mockResolvedValueOnce({ ok: true, json: async () => ({ source: payload }) });
 
     const { container } = render(
       <NodeDetailPanel
@@ -68,12 +64,9 @@ describe("NodeDetailPanel code preview + deep-link", () => {
     /* …but was NOT parsed into a real <script> element, and did not execute. */
     expect(container.querySelector("script")).toBeNull();
     expect((window as unknown as { __pwned?: boolean }).__pwned).toBeUndefined();
-    expect(callToolMock).toHaveBeenCalledWith("get_code_snippet", {
-      qualified_name: "app::render",
-      project: "demo",
-      format: "json",
-      source_mode: "full",
-    });
+    expect(fetchMock).toHaveBeenCalledWith(
+      "/api/snippet?qualified_name=app%3A%3Arender&project=demo&source_mode=full",
+    );
   });
 
   it("builds an https GitHub deep-link with URL-encoded path segments", () => {
 
@@ -1,7 +1,7 @@
 import { useMemo, useState, useEffect } from "react";
 import { ScrollArea } from "@/components/ui/scroll-area";
 import { colorForLabel } from "../lib/colors";
-import { callTool } from "../api/rpc";
+import { fetchRead } from "../api/native";
 import type { GraphNode, GraphEdge, RepoInfo } from "../lib/types";
 
 interface Connection {
@@ -73,10 +73,9 @@ export function NodeDetailPanel({
     setCodeLoading(true);
     setCodeError(null);
     try {
-      const res = await callTool<SnippetResult>("get_code_snippet", {
+      const res = await fetchRead<SnippetResult>("snippet", {
         qualified_name: node.qualified_name,
         project,
-        format: "json",
         source_mode: "full",
       });
       setCode(res.source ?? "(source not available)");
 
@@ -10,10 +10,8 @@ function mockProjectsFetch(extra?: (url: string, init?: RequestInit) => Response
     const url = String(input);
     const overridden = extra?.(url, init);
     if (overridden) return overridden;
-    if (url === "/rpc") {
-      return new Response(JSON.stringify({
-        result: { content: [{ text: JSON.stringify({ projects: [], has_more: false }) }] },
-      }), { status: 200, headers: { "Content-Type": "application/json" } });
+    if (url.startsWith("/api/projects")) {
+      return new Response(JSON.stringify({ projects: [], has_more: false }), { status: 200, headers: { "Content-Type": "application/json" } });
     }
     if (url.startsWith("/api/ui-config")) {
       return new Response(JSON.stringify({ lang: "en" }), {
@@ -211,10 +209,8 @@ describe("StatsTab index modal", () => {
   it("posts empty ADR content when deleting an existing ADR", async () => {
     let saved: unknown = null;
     mockProjectsFetch((url, init) => {
-      if (url === "/rpc") {
-        const body = JSON.parse(String(init?.body));
-        const tool = body.params?.name;
-        const result = tool === "list_projects"
+      if (url.startsWith("/api/projects") || url.startsWith("/api/schema")) {
+        const result = url.startsWith("/api/projects")
           ? {
               projects: [{
                 name: "demo",
@@ -226,9 +222,7 @@ describe("StatsTab index modal", () => {
           : {
               node_labels: [], edge_types: [], total_nodes: 0, total_edges: 0, has_more: false,
             };
-        return new Response(JSON.stringify({
-          result: { content: [{ text: JSON.stringify(result) }] },
-        }), { status: 200, headers: { "Content-Type": "application/json" } });
+        return new Response(JSON.stringify(result), { status: 200, headers: { "Content-Type": "application/json" } });
       }
       if (url.startsWith("/api/adr")) {
         if (init?.method === "POST") {
 
@@ -1,57 +1,57 @@
 /* @vitest-environment jsdom */
 import { renderHook, waitFor } from "@testing-library/react";
-import { beforeEach, describe, expect, it, vi } from "vitest";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
 import { useProjects } from "./useProjects";
 
-const callToolMock = vi.fn();
-vi.mock("../api/rpc", () => ({
-  callTool: (...args: unknown[]) => callToolMock(...args),
-}));
-
+const fetchMock = vi.fn();
 describe("useProjects machine-readable pagination", () => {
-  beforeEach(() => callToolMock.mockReset());
+  beforeEach(() => {
+    fetchMock.mockReset();
+    vi.stubGlobal("fetch", fetchMock);
+  });
+
+  afterEach(() => vi.unstubAllGlobals());
 
   it("requests JSON and merges every project and schema page", async () => {
-    callToolMock.mockImplementation(async (name: string, args: Record<string, unknown>) => {
-      if (name === "list_projects") {
-        if (args.offset === 0) {
+    fetchMock.mockImplementation(async (input: string) => {
+      const [name, query] = input.slice(5).split("?");
+      const args = Object.fromEntries(new URLSearchParams(query));
+      const page = await (async () => {
+        if (name === "projects") {
+          if (args.offset === "0") {
+            return {
+              projects: [{ name: "alpha", root_path: "/alpha", indexed_at: "now" }],
+              has_more: true,
+              next_offset: 1,
+            };
+          }
           return {
-            projects: [{ name: "alpha", root_path: "/alpha", indexed_at: "now" }],
-            has_more: true,
-            next_offset: 1,
+            projects: [{ name: "beta", root_path: "/beta", indexed_at: "now" }],
+            has_more: false,
           };
         }
-        return {
-          projects: [{ name: "beta", root_path: "/beta", indexed_at: "now" }],
-          has_more: false,
-        };
-      }
-      if (name === "get_graph_schema" && args.project === "alpha") {
-        if (args.offset === 0) {
+        if (name === "schema" && args.project === "alpha") {
+          if (args.offset === "0") {
+            return {
+              node_labels: [{ label: "Function", count: 3 }],
+              edge_types: [],
+              has_more: true,
+              next_offset: 1,
+            };
+          }
           return {
-            node_labels: [{ label: "Function", count: 3 }],
-            edge_types: [],
-            total_nodes: 3,
-            total_edges: 2,
-            has_more: true,
-            next_offset: 1,
+            node_labels: [],
+            edge_types: [{ type: "CALLS", count: 2 }],
+            has_more: false,
           };
         }
         return {
-          node_labels: [],
-          edge_types: [{ type: "CALLS", count: 2 }],
-          total_nodes: 3,
-          total_edges: 2,
+          node_labels: [{ label: "Class", count: 1 }],
+          edge_types: [],
           has_more: false,
         };
-      }
-      return {
-        node_labels: [{ label: "Class", count: 1 }],
-        edge_types: [],
-        total_nodes: 1,
-        total_edges: 0,
-        has_more: false,
-      };
+      })();
+      return { ok: true, json: async () => page };
     });
 
     const { result } = renderHook(() => useProjects());
@@ -64,23 +64,21 @@ describe("useProjects machine-readable pagination", () => {
     expect(result.current.projects[0].schema?.edge_types).toEqual([
       { type: "CALLS", count: 2 },
     ]);
-    expect(callToolMock).toHaveBeenCalledWith("list_projects", {
-      format: "json",
-      detail: "stats",
-      limit: 500,
-      offset: 0,
-    });
-    expect(callToolMock).toHaveBeenCalledWith("list_projects", {
-      format: "json",
-      detail: "stats",
-      limit: 500,
-      offset: 1,
-    });
-    expect(callToolMock).toHaveBeenCalledWith("get_graph_schema", {
-      project: "alpha",
-      format: "json",
-      limit: 500,
-      offset: 1,
+    expect(result.current.projects[0].schema?.total_nodes).toBe(3);
+    expect(result.current.projects[0].schema?.total_edges).toBe(2);
+    expect(fetchMock).toHaveBeenCalledWith("/api/projects?limit=500&offset=0");
+    expect(fetchMock).toHaveBeenCalledWith("/api/projects?limit=500&offset=1");
+    expect(fetchMock).toHaveBeenCalledWith("/api/schema?project=alpha&limit=500&offset=1");
+  });
+  it("reports native API errors", async () => {
+    fetchMock.mockResolvedValue({
+      ok: false,
+      status: 400,
+      json: async () => ({ error: "cannot read cache directory" }),
     });
+    const { result } = renderHook(() => useProjects());
+    await waitFor(() => expect(result.current.loading).toBe(false));
+    expect(result.current.error).toBe("cannot read cache directory");
+    expect(result.current.projects).toEqual([]);
   });
 });
@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useState } from "react";
-import { callTool } from "../api/rpc";
+import { fetchRead } from "../api/native";
 import type { Project, SchemaInfo } from "../lib/types";
 
 interface ProjectInfo {
@@ -13,7 +13,7 @@ interface ProjectPage {
   next_offset?: number;
 }
 
-interface SchemaPage extends SchemaInfo {
+interface SchemaPage extends Omit<SchemaInfo, "total_nodes" | "total_edges"> {
   has_more?: boolean;
   next_offset?: number;
 }
@@ -35,9 +35,7 @@ async function fetchAllProjects(): Promise<Project[]> {
   const projects: Project[] = [];
   let offset = 0;
   for (;;) {
-    const page = await callTool<ProjectPage>("list_projects", {
-      format: "json",
-      detail: "stats",
+    const page = await fetchRead<ProjectPage>("projects", {
       limit: PAGE_LIMIT,
       offset,
     });
@@ -54,9 +52,8 @@ async function fetchFullSchema(project: string): Promise<SchemaInfo> {
   let firstPage: SchemaPage | null = null;
   let offset = 0;
   for (;;) {
-    const page = await callTool<SchemaPage>("get_graph_schema", {
+    const page = await fetchRead<SchemaPage>("schema", {
       project,
-      format: "json",
       limit: PAGE_LIMIT,
       offset,
     });
@@ -65,7 +62,13 @@ async function fetchFullSchema(project: string): Promise<SchemaInfo> {
     edgeTypes.push(...(page.edge_types ?? []));
     const next = nextPageOffset(page, offset);
     if (next === null) {
-      return { ...firstPage, node_labels: nodeLabels, edge_types: edgeTypes };
+      return {
+        ...firstPage,
+        node_labels: nodeLabels,
+        edge_types: edgeTypes,
+        total_nodes: nodeLabels.reduce((total, label) => total + label.count, 0),
+        total_edges: edgeTypes.reduce((total, edge) => total + edge.count, 0),
+      };
     }
     offset = next;
   }
 
@@ -50,7 +50,6 @@ export default defineConfig({
     port: 5173,
     strictPort: true,
     proxy: {
-      "/rpc": uiBackendProxy(),
       "/api": uiBackendProxy(),
     },
   },