22
33This document provides essential context for AI assistants working on the Anode project.
44
5+ For current work state and immediate next steps, see ` HANDOFF.md ` - it focuses on where development was left off and what to work on next.
6+
57## Project Overview
68
79Anode is a real-time collaborative notebook system built on LiveStore, an event-sourcing based local-first data synchronization library. The project uses a monorepo structure with TypeScript and pnpm workspaces.
@@ -10,7 +12,7 @@ Anode is a real-time collaborative notebook system built on LiveStore, an event-
1012
1113## Architecture
1214
13- - ** Schema Package ** (` @anode /schema` ): LiveStore schema definitions (events, state, materializers)
15+ - ** Shared Schema ** (` shared /schema.ts ` ): LiveStore schema definitions (events, state, materializers) - TypeScript source file directly imported by all packages with full type inference
1416- ** Web Client** (` @anode/web-client ` ): React-based web interface
1517- ** Document Worker** (` @anode/docworker ` ): Cloudflare Worker for sync backend
1618- ** Kernel Client** (` @anode/dev-server-kernel-ls-client ` ): Python execution server (manual start per notebook)
@@ -22,111 +24,54 @@ Anode is a real-time collaborative notebook system built on LiveStore, an event-
2224- ** React** : UI framework
2325- ** TypeScript** : Primary language
2426
25- ## Current Architecture - Fully Operational
27+ ## Current Working State
28+
29+ ### What's Working ✅
30+ - ✅ ** Instant Python execution** with zero polling delays
31+ - ✅ ** Rich output rendering** - HTML tables, SVG plots, markdown, JSON
32+ - ✅ ** Pandas DataFrames** with styled HTML table output
33+ - ✅ ** Matplotlib plots** as crisp SVG vector graphics
34+ - ✅ ** Real-time collaboration** across multiple users
35+ - ✅ ** AI cell integration** with mock responses and markdown rendering
36+ - ✅ ** Offline-first operation** with sync when connected
37+ - ✅ ** Comprehensive testing** (60 passing tests)
2638
27- ### ** Simplified Notebook/Store Relationship **
39+ ### Core Architecture Features
2840- ` NOTEBOOK_ID = STORE_ID ` : Each notebook gets its own LiveStore database
29- - URL routing: Access notebooks via ` ?notebook=notebook-id `
30- - Single notebook per store eliminates data boundary confusion
31- - All events naturally scoped to one notebook
32-
33- ### ** Reactive Execution Queue System**
34- - Flow: ` executionRequested ` → ` executionAssigned ` → ` executionStarted ` → ` executionCompleted `
35- - ** Kernels use reactive ` queryDb ` subscriptions** for instant work detection (no polling)
36- - ** Zero-latency execution** - cells execute immediately when run
37- - Session-based assignment with auth enforcement planned
38- - ** Fully operational** - working end-to-end with lightning-fast response
39-
40- ### ** Rich Output System**
41- - ** Multiple media types** : text/plain, text/markdown, text/html, image/svg+xml
42- - ** Pandas DataFrames** : Professional HTML table styling with borders and formatting
43- - ** Matplotlib plots** : SVG vector graphics with crisp rendering
44- - ** AI responses** : Rich markdown with syntax highlighting and code blocks
45- - ** Media type prioritization** : Best format automatically selected for display
46- - ** Fallback support** : Always includes plain text as backup
47-
48- ### ** Kernel Session Tracking**
49- - Each kernel restart gets unique ` sessionId `
50- - 30-second heartbeat mechanism
51- - Session IDs tracked in execution queue
52- - Manual kernel management (start one per notebook)
53-
54- ## Development Setup
55-
56- ### Common Commands
41+ - ** Reactive execution** : ` executionRequested ` → ` executionAssigned ` → ` executionStarted ` → ` executionCompleted `
42+ - ** Zero-latency** : Kernels use reactive ` queryDb ` subscriptions for instant work detection
43+ - ** Session-based kernels** : Each kernel restart gets unique ` sessionId `
44+
45+ ## Development Commands
46+
5747``` bash
5848# Start core services (web + sync)
5949pnpm dev
6050
6151# Start kernel for specific notebook (manual)
6252NOTEBOOK_ID=notebook-123-abc pnpm dev:kernel
6353
64- # Individual services
65- pnpm dev:web-only
66- pnpm dev:sync-only
67-
68- # Development utilities
54+ # Utilities
6955pnpm reset-storage # Clear all local storage
70- pnpm build:schema # Required after schema changes
7156```
7257
73- ## Current Working State
74- ## What's Working ✅
75-
76- - ✅ ** Instant Python execution** with zero polling delays
77- - ✅ ** Rich output rendering** - HTML tables, SVG plots, markdown, JSON
78- - ✅ ** Pandas DataFrames** with styled HTML table output
79- - ✅ ** Matplotlib plots** as crisp SVG vector graphics
80- - ✅ ** Real-time collaboration** across multiple users
81- - ✅ ** Reactive architecture** using LiveStore's ` queryDb ` subscriptions
82- - ✅ ** Multiple isolated notebooks** with separate kernels
83- - ✅ ** AI cell integration** with mock responses and markdown rendering
84- - ✅ ** Offline-first operation** with sync when connected
85- - ✅ ** Event sourcing** for complete history and debugging
86- - ✅ ** Session management** with kernel isolation
87- - ✅ ** Comprehensive testing** (68 passing tests)
88-
89- ## Next Phase: Real AI Integration & Automation 🤖
58+ ## Next Phase: Real AI Integration
9059
91- ** Priority Focus** : AI ↔ Python ↔ User interactions with enterprise-grade features
60+ ** Priority Focus** : Replace mock AI responses with real API integration
9261
9362### Immediate Goals
94- - ** Real AI API Integration** - Replace mock responses with OpenAI, Anthropic, local model calls
95- - ** Automatic Kernel Management** - One-click notebook startup with auto-kernel lifecycle
63+ - ** Real AI API Integration** - OpenAI, Anthropic, local model calls
64+ - ** Automatic Kernel Management** - One-click notebook startup
9665- ** Authentication System** - Google OAuth with proper session management
97- - ** Code Completions** - LSP + kernel-based suggestions with Pyodide integration
98- - ** SQL Cell Implementation** - Real database connections and query execution
99-
100- ### Rich Output System ✅ COMPLETED
101- - ** Multiple Media Types** - text/plain, text/markdown, text/html, image/svg+xml
102- - ** Pandas DataFrames** - Professional HTML table styling with proper formatting
103- - ** Matplotlib Integration** - SVG vector graphics with interactive rendering
104- - ** AI Markdown Responses** - Rich formatted responses with syntax highlighting
105- - ** Media Type Detection** - Automatic selection of best display format
106-
107- ### Medium-term Roadmap
108- - ** Interactive Outputs** - Widgets, 3D plots, and dynamic visualizations
109- - ** Real-time Collaboration** - Live cursors and presence indicators
110- - ** Advanced Cell Operations** - Multi-select, drag-and-drop reordering
111- - ** Performance Optimization** - Handle large notebooks and datasets efficiently
112-
113- ### Recent Major Achievements ✅
114- - ✅ ** Rich Output System** - HTML tables, SVG plots, markdown rendering
115- - ✅ ** Pandas DataFrame Support** - Professional table styling matching Jupyter quality
116- - ✅ ** Matplotlib Integration** - Crisp vector graphics with proper rendering
117- - ✅ ** Fluid notebook navigation** with arrow keys
118- - ✅ ** Always-on textareas** replacing click-to-edit model
119- - ✅ ** Clean, focus-driven interface** design
120- - ✅ ** Standard keyboard shortcuts** (Shift+Enter, Ctrl+Enter)
121- - ✅ ** Consistent behavior** across all cell types
66+ - ** Code Completions** - LSP + kernel-based suggestions
67+ - ** SQL Cell Implementation** - Real database connections
12268
12369## Important Considerations
12470
12571### Schema Design
126- - Schema package must be built before dependent packages can consume changes
127- - Single ` notebook ` table per store (not ` notebooks ` )
128- - ` kernelSessions ` and ` executionQueue ` tables for lifecycle management
129- - ** No timestamp fields** - eliminated for simplicity and stability (LiveStore handles timing automatically)
72+ - ** Direct TypeScript imports** : ` shared/schema.ts ` provides zero-build-step imports with full type inference across all packages
73+ - ** Single source of truth** : No compiled artifacts needed - TypeScript handles type checking from source
74+ - ** No timestamp fields** - LiveStore handles timing automatically
13075
13176### Local-First Architecture
13277- All data operations happen locally first
@@ -143,73 +88,37 @@ pnpm build:schema # Required after schema changes
14388## File Structure
14489```
14590anode/
91+ ├── shared/
92+ │ └── schema.ts # LiveStore schema - TypeScript source directly imported by all packages
14693├── packages/
147- │ ├── schema/ # LiveStore schema definitions
14894│ ├── web-client/ # React web application
14995│ ├── docworker/ # Cloudflare Worker sync backend
15096│ └── dev-server-kernel-ls-client/ # Python kernel server
151- ├── start-dev.sh # Development startup script
152- ├── reset-local-storage.cjs # Clean development state
15397├── package.json # Root workspace configuration
15498└── pnpm-workspace.yaml # Dependency catalog
15599```
156100
157- ## Troubleshooting
158-
159- ### Common Issues
160- - ** Build failures** : Run ` pnpm build:schema ` first
161- - ** Sync issues** : Check document worker deployment
162- - ** Execution not working** : Start kernel manually with ` NOTEBOOK_ID=your-notebook-id pnpm dev:kernel `
163- - ** Stale state** : Run ` pnpm reset-storage ` to clear everything
164-
165- ### Debugging
166- - Browser console for client-side issues
167- - Wrangler logs for worker debugging
168- - Terminal output for kernel server issues
169- - Comprehensive logging in kernel for execution flow
170-
171101## Notes for AI Assistants
172102
173- ### Current State - Fully Operational + Rich Outputs
174- - ** Zero-latency execution** with reactive architecture breakthrough
175- - ** Rich output rendering** ✅ COMPLETED - HTML tables, SVG plots, markdown
176- - ** AI cell integration** ✅ COMPLETED - Unified execution queue system
177- - ** Pandas DataFrame support** ✅ COMPLETED - Professional HTML table styling
178- - ** Matplotlib integration** ✅ COMPLETED - SVG vector graphics rendering
179- - ** Mock AI responses** ✅ WORKING - Rich markdown formatting
180- - Manual kernel management (automation planned)
181- - Simplified schemas for reliability and rapid development
182- - Each notebook = separate LiveStore database for clean isolation
183- - ** Stable reactive architecture** leveraging LiveStore's capabilities
184- - Ready for real AI API integration and advanced features
185-
186- ### Communication Style
187- - Use authentic developer voice - uncertainty is fine, just be explicit
188- - Focus on AI ↔ Python ↔ User interaction goals as primary differentiator
189- - Acknowledge both technical, UX, and rich output achievements completed
190- - Emphasize production readiness and Jupyter-quality output rendering
191- - Balance current capabilities with enterprise collaboration roadmap
103+ ### Current State - Ready for AI Integration
104+ - ** Zero-latency execution** with reactive architecture
105+ - ** Rich output rendering** completed - HTML tables, SVG plots, markdown
106+ - ** Mock AI responses** working - ready for real API integration
107+ - ** Zero-build schema architecture** - Direct TypeScript imports eliminate build complexity
108+ - ** Production-ready foundation** for AI-native collaborative notebooks
192109
193- ### Key Insights for Development
110+ ### Key Development Insights
194111- ** Reactive architecture breakthrough** - Zero-latency execution achieved
195- - ** Rich output system completion** - HTML tables, SVG plots, markdown rendering
196- - ** Pandas DataFrame integration** - Professional styling matching Jupyter quality
197- - ** Matplotlib SVG rendering** - Crisp vector graphics with proper display
198- - ** Fluid UX transformation** - Jupyter-like navigation and interaction completed
199112- ** Unified execution system** - AI cells work exactly like code cells through execution queue
200- - Simple schemas enable rapid prototyping and reliable operation
201- - Event sourcing provides excellent debugging and audit capabilities
202- - Local-first design enables offline work and instant responsiveness
203- - ** Proper event deferral** resolves LiveStore execution segment conflicts effectively
204- - Session-based kernel management enables clean isolation and scaling
113+ - ** Event sourcing** provides excellent debugging and audit capabilities
114+ - ** Proper event deferral** resolves LiveStore execution segment conflicts
205115- ** Focus-based UI patterns** create clean, keyboard-driven workflows
206- - ** Consistent cross-cell behavior** enables predictable user experience
207- - ** AI integration architecture** - Mock responses working, ready for real API integration
208-
209- ** Current Development Cycle** : Major UX improvements and rich output system completed in June 2025, creating a fluid notebook experience with Jupyter-quality output rendering while maintaining real-time collaboration advantages.
210116
211- The system provides a ** production-ready foundation** for AI-native collaborative notebooks with modern UX, professional-quality output rendering, and is positioned for advanced enterprise features.
117+ ### Communication Style
118+ - Use authentic developer voice - uncertainty is fine, just be explicit
119+ - Focus on AI ↔ Python ↔ User interaction goals as primary differentiator
120+ - Emphasize production readiness and Jupyter-quality output rendering
212121
213122## Important Note on Timestamps
214123
215- ** Do NOT use manual timestamps in code or events.** LiveStore automatically handles all timing through its event sourcing system. Focus development on features and architecture rather than timestamp management - this was a key lesson learned that improved system stability significantly .
124+ ** Do NOT use manual timestamps in code or events.** LiveStore automatically handles all timing through its event sourcing system. Focus development on features and architecture rather than timestamp management.
0 commit comments