Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .claude/gw-plans/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ Implementation deviations are logged at the bottom of each plan file.
| Track | Description | Status |
|-------|-------------|--------|
| [Execution](execution/) | FastAPI + LangGraph backend | Phases 1-5 merged |
| [Canvas](canvas/) | React + React Flow frontend | Phase 1 in progress |
| [Canvas](canvas/) | React + React Flow frontend | Phase 1 merged |
| Deployment | Cloud Run + Vercel + CI/CD | Not started (after both tracks) |

## Status Legend
Expand Down
12 changes: 6 additions & 6 deletions .claude/gw-plans/canvas/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ React 19 + React Flow frontend phases. Depends on execution phases 3-4 for API s

| Phase | Plan | Status |
|-------|------|--------|
| 1 | [Canvas core](phase-1-canvas-core/overview.md) -- Home view, Start/LLM/End nodes, edge wiring, config panel, save/load | In progress |
| 1 | [Canvas core](phase-1-canvas-core/overview.md) -- Home view, Start/LLM/End nodes, edge wiring, config panel, save/load | Complete |
| 2 | SSE run panel -- stream display, node highlighting, reconnection | Not started |
| 3 | Full node set -- Tool/Condition/HumanInput nodes, settings page | Not started |
| 4 | Validation, run input modal, state panel | Not started |
Expand All @@ -17,9 +17,9 @@ React 19 + React Flow frontend phases. Depends on execution phases 3-4 for API s

| Part | Plan | Summary | Status |
|------|------|---------|--------|
| 1.1 | [phase-1.1-test-infra-ui-base.md](phase-1-canvas-core/phase-1.1-test-infra-ui-base.md) | Test infra (Vitest), lucide-react, 9 shadcn UI components (Button, Input, Select, Textarea, Dialog, Sheet, Sidebar, Tooltip, Card), CanvasContext | In progress |
| 1.2 | [phase-1.2-node-components.md](phase-1-canvas-core/phase-1.2-node-components.md) | BaseNodeShell + Start/LLM/End node presenters | Not started |
| 1.3 | [phase-1.3-graph-canvas.md](phase-1-canvas-core/phase-1.3-graph-canvas.md) | GraphCanvas container, Toolbar with tooltips, connection validation, canvas hint, starter template | Not started |
| 1.4 | [phase-1.4-config-panel.md](phase-1-canvas-core/phase-1.4-config-panel.md) | NodeConfigPanel with slide transition + config forms | Not started |
| 1.5 | [phase-1.5-save-load.md](phase-1-canvas-core/phase-1.5-save-load.md) | HomeView, GraphCard, NewGraphDialog, editable graph name, save/load, view routing | Not started |
| 1.1 | [phase-1.1-test-infra-ui-base.md](phase-1-canvas-core/phase-1.1-test-infra-ui-base.md) | Test infra (Vitest), lucide-react, 9 shadcn UI components (Button, Input, Select, Textarea, Dialog, Sheet, Sidebar, Tooltip, Card), CanvasContext | Complete |
| 1.2 | [phase-1.2-node-components.md](phase-1-canvas-core/phase-1.2-node-components.md) | BaseNodeShell + Start/LLM/End node presenters | Complete |
| 1.3 | [phase-1.3-graph-canvas.md](phase-1-canvas-core/phase-1.3-graph-canvas.md) | GraphCanvas container, Toolbar with tooltips, connection validation, canvas hint, starter template | Complete |
| 1.4 | [phase-1.4-config-panel.md](phase-1-canvas-core/phase-1.4-config-panel.md) | NodeConfigPanel with slide transition + config forms | Complete |
| 1.5 | [phase-1.5-save-load.md](phase-1-canvas-core/phase-1.5-save-load.md) | HomeView, GraphCard, NewGraphDialog, editable graph name, save/load, view routing | Complete |
| 1.6 | [phase-1.6-floating-toolbar.md](phase-1-canvas-core/phase-1.6-floating-toolbar.md) | Floating toolbar with stamp mode, replaces sidebar toolbar | Complete |
55 changes: 42 additions & 13 deletions .claude/skills/gw-frontend/SKILL.md
Original file line number Diff line number Diff line change
Expand Up @@ -39,25 +39,45 @@ not reachable from components by design. See architecture.md for tsconfig detail

Biome handles formatting and linting. No ESLint.

## Phase 1 patterns

Patterns that emerged during Canvas Phase 1 — follow these in subsequent phases:

- **`ApiError` class** with `status` property for structured HTTP error handling (`api/client.ts`)
- **`spliceEdge`** for atomic node-on-edge insertion — removes the old edge and creates two new edges in one store update (`graphSlice.ts`)
- **`useGraphStore.getState()`** inside callbacks to avoid stale closures from Zustand subscriptions
- **`useNodePlacement`** hook encapsulating singleton guards + edge splitting for drop/stamp operations
- **Global toast** via `useUIStore.getState().showToast()` — callable from anywhere (store, hooks, not just components)
- **`encodeURIComponent(id)`** on all API path params to handle special characters in graph IDs

## Package structure

```
packages/canvas/src/
├── components/
│ ├── canvas/ # React Flow nodes, edges, canvas wrapper
│ ├── panels/ # Sidebar, run panel, settings, debug panel
│ └── ui/ # shadcn/ui base components
├── store/
│ ├── graphSlice.ts # graph CRUD, canvas state
│ ├── runSlice.ts # SSE lifecycle, reconnection, run status
│ └── uiSlice.ts # dark mode, panel layout, last-opened graph
│ # persisted via sdk-core Storage → localStorage
│ # never stores credentials
├── api/
│ ├── client.ts # base fetch wrapper (sdk-core Transport)
│ ├── client.ts # base fetch wrapper + ApiError class
│ ├── graphs.ts # graph CRUD
│ └── runs.ts # run + SSE stream + reconnection
└── types/ # re-exports from @graphweave/shared
│ └── runs.ts # run start + SSE stream (stub — Phase 2)
├── components/
│ ├── canvas/ # GraphCanvas, FloatingToolbar, StampGhost, CanvasHint,
│ │ │ CanvasHeader, SnapConnectionLine, CanvasRoute
│ │ └── nodes/ # BaseNodeShell, StartNode, LLMNode, EndNode, nodeTypes
│ ├── home/ # HomeView, GraphCard, NewGraphDialog
│ ├── panels/ # NodeConfigPanel
│ │ └── config/ # StartNodeConfig, LLMNodeConfig, EndNodeConfig
│ └── ui/ # Button, Card, Dialog, DropdownMenu, IconButton,
│ Input, Select, Sheet, Textarea, Toast, Tooltip
├── constants/ # toolbarItems.ts
├── contexts/ # CanvasContext (selectedNode, stampNodeType, rfInstance)
├── hooks/ # useNodePlacement, useNodeDrop, useBeforeUnload
├── store/
│ ├── graphSlice.ts # graph CRUD, nodes/edges, spliceEdge, save/load
│ ├── runSlice.ts # SSE lifecycle (stub — Phase 2)
│ └── uiSlice.ts # darkMode, panelLayout, lastOpenedGraphId,
│ newGraphDialogOpen, toast (message + variant)
├── styles/ # tokens.ts (color/spacing design tokens)
├── types/ # canvas.ts, mappers.ts (NodeSchema ↔ RF Node)
└── utils/ # nodeDefaults.ts (NODE_DEFAULTS, SINGLETON_TYPES, findNearestEdge)
```

## Zustand store shape
Expand All @@ -83,6 +103,15 @@ interface UISlice {
darkMode: boolean
panelLayout: "right" | "bottom"
lastOpenedGraphId: string | null
newGraphDialogOpen: boolean
toastMessage: string | null
toastVariant: "error" | "success" | "info"
toggleDarkMode: () => void
setPanelLayout: (layout: "right" | "bottom") => void
setLastOpenedGraphId: (id: string | null) => void
setNewGraphDialogOpen: (open: boolean) => void
showToast: (message: string, variant?: ToastVariant) => void
dismissToast: () => void
}
```

Expand Down
10 changes: 9 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
**Visual LangGraph builder where your graph runs exactly as drawn** — visually compose nodes, edges, and tools, then stream execution in real time.

> [!NOTE]
> Graphweave is in early development. The scaffold is in place but core features are still being built.
> Graphweave is in early development. The canvas builder and execution backend are functional, but graph execution (run a graph and stream results) is not yet wired end-to-end.

## What is this?

Expand All @@ -15,6 +15,14 @@ Graphweave kills that gap. The canvas **is** the execution. No translation step,

**What you draw is what runs.** GraphSchema maps 1-to-1 to LangGraph primitives. No abstraction layer between the visual and the execution.

## Current status

| Layer | What works | What's next |
|-------|-----------|-------------|
| **Canvas** | Home view, Start/LLM/End nodes, edge wiring, config panel, save/load, floating toolbar | [SSE run panel, full node set →](.claude/gw-plans/canvas/) |
| **Execution** | API key auth, graph CRUD, tool registry (8 tools), migrations | [Graph run + SSE streaming →](.claude/gw-plans/execution/) |
| **Shared** | GraphSchema contract, node types, edge types | Condition + HumanInput wiring |

## Architecture

```
Expand Down
Loading