@feltdb/core 0.4.8 → 0.4.9

package/dist/create/create.js

@@ -72,7 +72,7 @@ export async function createProject(options) {
     const feltdbConfig = {
         namespace: applicationName,
         runtime,
-        storage: runtime === 'browser' ? 'opfs' : 'durable',
+        storage: runtime === 'browser' ? 'indexeddb' : runtime === 'managed' ? 'managed' : 'durable',
         distributed,
         agents: {
             enabled: hasAgents,
@@ -156,16 +156,165 @@ export async function createProject(options) {
     // Create main application files
     const runtimeOptions = runtime === 'browser'
         ? "{ namespace: '" + applicationName + "', browser: true }"
-        : runtime === 'self-hosted'
-            ? "{ namespace: '" + applicationName + "', server: { url: import.meta.env.VITE_FELTDB_URL || 'http://localhost:7700', token: import.meta.env.VITE_FELTDB_API_KEY || '' } }"
-            : "{ namespace: '" + applicationName + "', memory: true }";
+        : runtime === 'managed'
+            ? "{ namespace: import.meta.env.VITE_FELTDB_MANAGED_NAMESPACE || '" + applicationName + "', server: { url: import.meta.env.VITE_FELTDB_MANAGED_URL || import.meta.env.VITE_FELTDB_URL || '', token: import.meta.env.VITE_FELTDB_MANAGED_API_KEY || import.meta.env.VITE_FELTDB_API_KEY || '' } }"
+            : runtime === 'self-hosted'
+                ? "{ namespace: '" + applicationName + "', server: { url: import.meta.env.VITE_FELTDB_URL || 'http://localhost:7700', token: import.meta.env.VITE_FELTDB_API_KEY || '' } }"
+                : "{ namespace: '" + applicationName + "', memory: true }";
     const feltdbTs = `import { createFeltDB } from '@feltdb/core';
 
 export const db = createFeltDB(${runtimeOptions});
 
 // Collections
-export const documents = db.collection('documents');
-export const reports = db.collection('reports');
+export const projects = db.collection('projects');
+export const tasks = db.collection('tasks');
+export const activity = db.collection('activity');
+
+// Types
+export interface Project {
+  id: string;
+  name: string;
+  description: string;
+  status: 'active' | 'archived' | 'completed';
+  createdAt: string;
+  updatedAt: string;
+  metadata?: Record<string, any>;
+}
+
+export interface Task {
+  id: string;
+  projectId: string;
+  title: string;
+  description: string;
+  status: 'todo' | 'in-progress' | 'completed';
+  priority: 'low' | 'medium' | 'high';
+  assignee?: string;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface ActivityEvent {
+  id: string;
+  timestamp: string;
+  type: string;
+  entityType: 'project' | 'task';
+  entityId: string;
+  entityName: string;
+  changes?: Record<string, any>;
+  userId?: string;
+}
+
+// Indexes
+projects.createIndex('status');
+tasks.createIndex('projectId');
+tasks.createIndex('status');
+tasks.createIndex('priority');
+activity.createIndex('timestamp');
+
+// Operations
+export async function createProject(data: Omit<Project, 'id' | 'createdAt' | 'updatedAt'>): Promise<Project> {
+  const project: Project = {
+    id: 'proj_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9),
+    ...data,
+    createdAt: new Date().toISOString(),
+    updatedAt: new Date().toISOString(),
+  };
+  await projects.insert(project);
+  await logActivity({
+    type: 'project_created',
+    entityType: 'project',
+    entityId: project.id,
+    entityName: project.name,
+  });
+  return project;
+}
+
+export async function createTask(data: Omit<Task, 'id' | 'createdAt' | 'updatedAt'>): Promise<Task> {
+  const task: Task = {
+    id: 'task_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9),
+    ...data,
+    createdAt: new Date().toISOString(),
+    updatedAt: new Date().toISOString(),
+  };
+  await tasks.insert(task);
+  await logActivity({
+    type: 'task_created',
+    entityType: 'task',
+    entityId: task.id,
+    entityName: task.title,
+  });
+  return task;
+}
+
+export async function updateTask(id: string, updates: Partial<Task>): Promise<void> {
+  const task = await tasks.findOne({ id });
+  if (!task) throw new Error('Task not found');
+  
+  const updated = {
+    ...task,
+    ...updates,
+    updatedAt: new Date().toISOString(),
+  };
+  await tasks.update({ id }, updated);
+  await logActivity({
+    type: 'task_updated',
+    entityType: 'task',
+    entityId: id,
+    entityName: updated.title,
+    changes: updates,
+  });
+}
+
+export async function updateProject(id: string, updates: Partial<Project>): Promise<void> {
+  const project = await projects.findOne({ id });
+  if (!project) throw new Error('Project not found');
+  
+  const updated = {
+    ...project,
+    ...updates,
+    updatedAt: new Date().toISOString(),
+  };
+  await projects.update({ id }, updated);
+  await logActivity({
+    type: 'project_updated',
+    entityType: 'project',
+    entityId: id,
+    entityName: updated.name,
+    changes: updates,
+  });
+}
+
+export async function getTasksByProject(projectId: string): Promise<Task[]> {
+  return tasks.find({ projectId }) as Promise<Task[]>;
+}
+
+export async function getRecentActivity(limit = 50): Promise<ActivityEvent[]> {
+  const events = await activity.find({});
+  return (events as ActivityEvent[]).sort((a, b) => 
+    new Date(b.timestamp).getTime() - new Date(a.timestamp).getTime()
+  ).slice(0, limit);
+}
+
+export async function getDashboardStats(): Promise<any> {
+  const allTasks = await tasks.find({});
+  const allProjects = await projects.find({});
+  return {
+    totalProjects: allProjects.length,
+    totalTasks: allTasks.length,
+    completedTasks: (allTasks as Task[]).filter(t => t.status === 'completed').length,
+    inProgressTasks: (allTasks as Task[]).filter(t => t.status === 'in-progress').length,
+    activeTasks: (allTasks as Task[]).filter(t => t.status === 'todo').length,
+  };
+}
+
+async function logActivity(event: Omit<ActivityEvent, 'id' | 'timestamp'>): Promise<void> {
+  const activityEvent: ActivityEvent = {
+    id: 'evt_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9),
+    timestamp: new Date().toISOString(),
+    ...event,
+  };
+  await activity.insert(activityEvent);
+}
 `;
     fs.writeFileSync(path.join(srcDir, 'feltdb.ts'), feltdbTs);
     // Create a real local-inference agent for browser projects.
@@ -573,815 +722,387 @@ export const capabilities = {
         </section>`
             : '';
         const appTsx = `import React, { useState, useEffect } from 'react';
-import { db, documents } from './feltdb';
-${agentImport}
+import { useCollection } from '@feltdb/core/react';
+import {
+  projects,
+  tasks,
+  activity,
+  createProject,
+  createTask,
+  updateTask,
+  getDashboardStats,
+} from './feltdb';
+
+type View = 'dashboard' | 'projects' | 'tasks' | 'activity' | 'inspector';
 
 export function App() {
-  const [docs, setDocs] = useState<any[]>([]);
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-  const [addingDoc, setAddingDoc] = useState(false);
-  const [searchTerm, setSearchTerm] = useState('');
-  const [editingId, setEditingId] = useState<string | null>(null);
-  const [editTitle, setEditTitle] = useState('');
-  const [editContent, setEditContent] = useState('');
-  const [deletingId, setDeletingId] = useState<string | null>(null);
-${agentState}
-
-  const loadDocs = async () => {
-    try {
-      setError(null);
-      const allDocs = await documents.find({});
-      setDocs(allDocs.sort((a: any, b: any) =>
-        new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
-      ));
-    } catch (err) {
-      const msg = err instanceof Error ? err.message : 'Failed to load documents';
-      console.error('Error loading documents:', err);
-      setError(msg);
-    } finally {
-      setLoading(false);
-    }
-  };
+  const [currentView, setCurrentView] = useState<View>('dashboard');
+  const [selectedProjectId, setSelectedProjectId] = useState<string>('');
+  const [dashboardStats, setDashboardStats] = useState<any>(null);
+  const [newProjectName, setNewProjectName] = useState('');
+  const [newTaskTitle, setNewTaskTitle] = useState('');
+  const [newTaskProject, setNewTaskProject] = useState('');
+
+  const { data: projectsList } = useCollection(projects);
+  const { data: tasksList } = useCollection(tasks);
+  const { data: activityList } = useCollection(activity);
 
   useEffect(() => {
-    loadDocs();
-  }, []);
+    getDashboardStats().then(setDashboardStats);
+  }, [projectsList, tasksList]);
+
+  const handleCreateProject = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!newProjectName.trim()) return;
+    await createProject({
+      name: newProjectName,
+      description: 'Created via Workspace',
+      status: 'active',
+      metadata: {},
+    });
+    setNewProjectName('');
+  };
 
-  const filteredDocs = docs.filter((doc: any) =>
-    doc.title.toLowerCase().includes(searchTerm.toLowerCase()) ||
-    doc.content.toLowerCase().includes(searchTerm.toLowerCase())
-  );
+  const handleCreateTask = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!newTaskTitle.trim() || !newTaskProject) return;
+    await createTask({
+      projectId: newTaskProject,
+      title: newTaskTitle,
+      description: '',
+      status: 'todo',
+      priority: 'medium',
+    });
+    setNewTaskTitle('');
+  };
 
-  const handleAddDocument = async () => {
-    if (addingDoc) return;
-    setAddingDoc(true);
-    setError(null);
+  const containerStyle: React.CSSProperties = {
+    display: 'flex',
+    minHeight: '100vh',
+    fontFamily: 'system-ui, sans-serif',
+    backgroundColor: '#f5f7fa',
+  };
 
-    try {
-      const newDoc = {
-        id: 'doc_' + Date.now() + '_' + Math.random().toString(36).substr(2, 9),
-        title: 'New Document',
-        content: 'Enter your content here...',
-        createdAt: new Date().toISOString(),
-      };
-      await documents.insert(newDoc);
-      await loadDocs();
-    } catch (err) {
-      const msg = err instanceof Error ? err.message : 'Failed to add document';
-      console.error('Error adding document:', err);
-      setError(msg);
-    } finally {
-      setAddingDoc(false);
-    }
+  const sidebarStyle: React.CSSProperties = {
+    width: '240px',
+    backgroundColor: '#1e293b',
+    color: '#e2e8f0',
+    padding: '20px',
+    borderRight: '1px solid #334155',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: '20px',
   };
 
-  const handleEditStart = (doc: any) => {
-    setEditingId(doc.id);
-    setEditTitle(doc.title);
-    setEditContent(doc.content);
+  const mainStyle: React.CSSProperties = {
+    flex: 1,
+    display: 'flex',
+    flexDirection: 'column',
   };
 
-  const handleEditSave = async () => {
-    if (!editingId) return;
-    setError(null);
+  const headerStyle: React.CSSProperties = {
+    backgroundColor: '#fff',
+    borderBottom: '1px solid #e2e8f0',
+    padding: '20px',
+    display: 'flex',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+  };
 
-    try {
-      const doc = docs.find((d: any) => d.id === editingId);
-      if (doc) {
-        const updatedDoc = {
-          ...doc,
-          title: editTitle,
-          content: editContent,
-          updatedAt: new Date().toISOString(),
-        };
-        await documents.insert(updatedDoc);
-        setEditingId(null);
-        await loadDocs();
-      }
-    } catch (err) {
-      const msg = err instanceof Error ? err.message : 'Failed to save document';
-      console.error('Error saving document:', err);
-      setError(msg);
-    }
+  const contentStyle: React.CSSProperties = {
+    flex: 1,
+    padding: '20px',
+    overflowY: 'auto',
   };
 
-  const handleDelete = async (docId: string) => {
-    if (deletingId) return;
-    setDeletingId(docId);
-    setError(null);
+  const titleStyle: React.CSSProperties = {
+    fontSize: '24px',
+    fontWeight: 'bold',
+    color: '#1e293b',
+  };
 
-    try {
-      const doc = docs.find((d: any) => d.id === docId);
-      if (doc) {
-        await documents.delete(doc);
-        await loadDocs();
-      }
-    } catch (err) {
-      const msg = err instanceof Error ? err.message : 'Failed to delete document';
-      setError(msg);
-    } finally {
-      setDeletingId(null);
-    }
+  const navItemStyle = (active: boolean): React.CSSProperties => ({
+    padding: '10px 12px',
+    borderRadius: '6px',
+    cursor: 'pointer',
+    backgroundColor: active ? '#334155' : 'transparent',
+    color: active ? '#fff' : '#cbd5e1',
+    border: 'none',
+    textAlign: 'left',
+    width: '100%',
+    fontSize: '14px',
+  });
+
+  const statsStyle: React.CSSProperties = {
+    display: 'grid',
+    gridTemplateColumns: 'repeat(auto-fit, minmax(200px, 1fr))',
+    gap: '16px',
+    marginBottom: '24px',
+  };
+
+  const statCardStyle: React.CSSProperties = {
+    backgroundColor: '#fff',
+    padding: '16px',
+    borderRadius: '8px',
+    border: '1px solid #e2e8f0',
+  };
+
+  const formStyle: React.CSSProperties = {
+    display: 'flex',
+    gap: '8px',
+    marginBottom: '20px',
+  };
+
+  const inputStyle: React.CSSProperties = {
+    flex: 1,
+    padding: '8px 12px',
+    border: '1px solid #cbd5e1',
+    borderRadius: '6px',
+    fontSize: '14px',
+  };
+
+  const buttonStyle: React.CSSProperties = {
+    padding: '8px 16px',
+    backgroundColor: '#0284c7',
+    color: '#fff',
+    border: 'none',
+    borderRadius: '6px',
+    cursor: 'pointer',
+    fontSize: '14px',
+  };
+
+  const itemStyle: React.CSSProperties = {
+    backgroundColor: '#fff',
+    padding: '12px',
+    borderRadius: '6px',
+    marginBottom: '8px',
+    border: '1px solid #e2e8f0',
   };
-${agentHandler}
 
   return (
-    <div className="app">
-      <header>
-        <h1>🌊 FeltDB Research App</h1>
-        <p>Distributed document management with agents and capabilities</p>
-      </header>
-
-      <main>
-        <section className="stats">
-          <div className="stat">
-            <span className="label">Documents:</span>
-            <span className="value">{docs.length}</span>
-          </div>
-          <div className="stat">
-            <span className="label">Runtime:</span>
-            <span className="value">${runtime}</span>
-          </div>
-          <div className="stat">
-            <span className="label">Distributed:</span>
-            <span className="value">${distributed ? '✓' : '✗'}</span>
+    <div style={containerStyle}>
+      <div style={sidebarStyle}>
+        <div style={{ fontSize: '16px', fontWeight: 'bold' }}>⚡ FeltDB Workspace</div>
+        <div style={{ display: 'flex', flexDirection: 'column', gap: '4px' }}>
+          <button
+            style={navItemStyle(currentView === 'dashboard')}
+            onClick={() => setCurrentView('dashboard')}
+          >
+            📊 Dashboard
+          </button>
+          <button
+            style={navItemStyle(currentView === 'projects')}
+            onClick={() => setCurrentView('projects')}
+          >
+            📁 Projects
+          </button>
+          <button
+            style={navItemStyle(currentView === 'tasks')}
+            onClick={() => setCurrentView('tasks')}
+          >
+            ✅ Tasks
+          </button>
+          <button
+            style={navItemStyle(currentView === 'activity')}
+            onClick={() => setCurrentView('activity')}
+          >
+            📝 Activity
+          </button>
+          <button
+            style={navItemStyle(currentView === 'inspector')}
+            onClick={() => setCurrentView('inspector')}
+          >
+            🔍 Inspector
+          </button>
+        </div>
+        <div style={{ marginTop: 'auto', fontSize: '12px', color: '#64748b' }}>
+          {projectsList.length} projects • {tasksList.length} tasks
+        </div>
+      </div>
+
+      <div style={mainStyle}>
+        <div style={headerStyle}>
+          <div style={titleStyle}>
+            {currentView === 'dashboard' && '📊 Dashboard'}
+            {currentView === 'projects' && '📁 Projects'}
+            {currentView === 'tasks' && '✅ Tasks'}
+            {currentView === 'activity' && '📝 Activity'}
+            {currentView === 'inspector' && '🔍 Data Inspector'}
           </div>
-        </section>
-
-        {error && (
-          <section className="error-message">
-            <strong>⚠ Error:</strong> {error}
-            <button onClick={() => window.location.reload()} className="retry-btn">
-              Retry
-            </button>
-          </section>
-        )}
-
-        <section className="documents">
-          <div className="docs-header">
-            <h2>📚 Documents</h2>
-            <div className="docs-controls">
-              <input
-                type="text"
-                placeholder="🔍 Search documents..."
-                value={searchTerm}
-                onChange={(e) => setSearchTerm(e.target.value)}
-                className="search-input"
-              />
-              <button
-                onClick={handleAddDocument}
-                disabled={addingDoc || loading}
-                className="primary-btn"
-              >
-                {addingDoc ? '⏳ Adding...' : '➕ New Document'}
-              </button>
+        </div>
+
+        <div style={contentStyle}>
+          {currentView === 'dashboard' && (
+            <div>
+              <div style={statsStyle}>
+                <div style={statCardStyle}>
+                  <div style={{ fontSize: '12px', color: '#64748b' }}>Projects</div>
+                  <div style={{ fontSize: '28px', fontWeight: 'bold' }}>{projectsList.length}</div>
+                </div>
+                <div style={statCardStyle}>
+                  <div style={{ fontSize: '12px', color: '#64748b' }}>Tasks</div>
+                  <div style={{ fontSize: '28px', fontWeight: 'bold' }}>{tasksList.length}</div>
+                </div>
+                <div style={statCardStyle}>
+                  <div style={{ fontSize: '12px', color: '#64748b' }}>Activity Events</div>
+                  <div style={{ fontSize: '28px', fontWeight: 'bold' }}>{activityList.length}</div>
+                </div>
+              </div>
+              <h3>Welcome to FeltDB Workspace!</h3>
+              <p style={{ color: '#64748b', lineHeight: '1.6' }}>
+                This application demonstrates core FeltDB capabilities:<br/>
+                ✅ Collections and relationships (Projects → Tasks)<br/>
+                ✅ Indexed querying for efficient lookups<br/>
+                ✅ Activity logs for audit trails<br/>
+                ✅ Local-first persistence with IndexedDB<br/>
+                ✅ Reactive updates using React hooks<br/>
+                <br/>
+                Create a project to get started! 👇
+              </p>
             </div>
-          </div>
+          )}
 
-          {loading ? (
-            <div className="loading">
-              <div className="spinner"></div>
-              <p>Loading documents...</p>
-            </div>
-          ) : docs.length === 0 ? (
-            <div className="empty-state">
-              <p>📭 No documents yet.</p>
-              <p className="hint">Create one to get started!</p>
-            </div>
-          ) : filteredDocs.length === 0 ? (
-            <div className="empty-state">
-              <p>🔍 No documents match "{searchTerm}"</p>
-            </div>
-          ) : (
-            <div className="docs-grid">
-              {filteredDocs.map((doc: any) => (
-                <div key={doc.id} className="doc-card">
-                  {editingId === doc.id ? (
-                    <div className="edit-mode">
-                      <input
-                        type="text"
-                        value={editTitle}
-                        onChange={(e) => setEditTitle(e.target.value)}
-                        className="edit-title"
-                      />
-                      <textarea
-                        value={editContent}
-                        onChange={(e) => setEditContent(e.target.value)}
-                        className="edit-content"
-                        rows={6}
-                      />
-                      <div className="edit-actions">
-                        <button onClick={handleEditSave} className="save-btn">
-                          ✓ Save
-                        </button>
-                        <button onClick={() => setEditingId(null)} className="cancel-btn">
-                          ✕ Cancel
-                        </button>
+          {currentView === 'projects' && (
+            <div>
+              <form style={formStyle} onSubmit={handleCreateProject}>
+                <input
+                  style={inputStyle}
+                  type="text"
+                  placeholder="New project name..."
+                  value={newProjectName}
+                  onChange={(e) => setNewProjectName(e.target.value)}
+                />
+                <button style={buttonStyle} type="submit">Create</button>
+              </form>
+              <div>
+                {projectsList.map((p: any) => (
+                  <div key={p.id} style={itemStyle}>
+                    <div style={{ fontWeight: 'bold' }}>{p.name}</div>
+                    {p.description && (
+                      <div style={{ fontSize: '14px', color: '#64748b', margin: '4px 0' }}>
+                        {p.description}
                       </div>
+                    )}
+                    <div style={{ fontSize: '12px', color: '#0284c7', marginTop: '4px' }}>
+                      Status: {p.status}
                     </div>
-                  ) : (
-                    <>
-                      <h3>{doc.title}</h3>
-                      <p className="doc-preview">{doc.content.substring(0, 150)}...</p>
-                      <div className="doc-meta">
-                        <small>{new Date(doc.createdAt).toLocaleDateString()}</small>
-                        <span className="doc-size">{doc.content.length} chars</span>
+                  </div>
+                ))}
+                {projectsList.length === 0 && (
+                  <p style={{ color: '#64748b' }}>No projects yet. Create one above!</p>
+                )}
+              </div>
+            </div>
+          )}
+
+          {currentView === 'tasks' && (
+            <div>
+              <form style={formStyle} onSubmit={handleCreateTask}>
+                <select
+                  style={inputStyle}
+                  value={newTaskProject}
+                  onChange={(e) => setNewTaskProject(e.target.value)}
+                >
+                  <option value="">Select a project...</option>
+                  {projectsList.map((p: any) => (
+                    <option key={p.id} value={p.id}>{p.name}</option>
+                  ))}
+                </select>
+                <input
+                  style={inputStyle}
+                  type="text"
+                  placeholder="Task title..."
+                  value={newTaskTitle}
+                  onChange={(e) => setNewTaskTitle(e.target.value)}
+                />
+                <button style={buttonStyle} type="submit">Create</button>
+              </form>
+              <div>
+                {tasksList.map((t: any) => (
+                  <div key={t.id} style={itemStyle}>
+                    <div style={{ fontWeight: 'bold' }}>{t.title}</div>
+                    {t.description && (
+                      <div style={{ fontSize: '14px', color: '#64748b', margin: '4px 0' }}>
+                        {t.description}
                       </div>
-                      <div className="doc-actions">
-                        <button
-                          onClick={() => handleEditStart(doc)}
-                          className="edit-btn"
-                        >
-                          ✎ Edit
-                        </button>
-                        <button
-                          onClick={() => handleDelete(doc.id)}
-                          disabled={deletingId === doc.id}
-                          className="delete-btn"
-                        >
-                          {deletingId === doc.id ? '⏳ Deleting...' : '🗑 Delete'}
-                        </button>
+                    )}
+                    <div style={{ fontSize: '12px', color: '#64748b', marginTop: '4px' }}>
+                      Priority: <strong>{t.priority}</strong> | Status: <strong>{t.status}</strong>
+                    </div>
+                  </div>
+                ))}
+                {tasksList.length === 0 && (
+                  <p style={{ color: '#64748b' }}>No tasks yet. Create one above!</p>
+                )}
+              </div>
+            </div>
+          )}
+
+          {currentView === 'activity' && (
+            <div>
+              {activityList.length === 0 ? (
+                <p style={{ color: '#64748b' }}>No activity yet</p>
+              ) : (
+                <div>
+                  {activityList.slice(-30).map((event: any, idx: number) => (
+                    <div key={idx} style={itemStyle}>
+                      <div style={{ fontSize: '12px', color: '#64748b' }}>
+                        {new Date(event.timestamp).toLocaleString()}
                       </div>
-                    </>
-                  )}
+                      <div style={{ fontWeight: 'bold' }}>{event.type}</div>
+                      {event.entityName && (
+                        <div style={{ fontSize: '14px', marginTop: '4px' }}>
+                          {event.entityName}
+                        </div>
+                      )}
+                    </div>
+                  ))}
+                </div>
+              )}
+            </div>
+          )}
+
+          {currentView === 'inspector' && (
+            <div>
+              <h3>Data Inspector</h3>
+              <p style={{ color: '#64748b', marginBottom: '16px' }}>
+                Developer panel showing FeltDB internals
+              </p>
+              <div style={statCardStyle}>
+                <div style={{ fontWeight: 'bold', marginBottom: '8px' }}>Collections</div>
+                <div style={{ fontSize: '14px', color: '#64748b', lineHeight: '1.6' }}>
+                  📦 projects: {projectsList.length} records<br/>
+                  📦 tasks: {tasksList.length} records<br/>
+                  📦 activity: {activityList.length} events<br/>
                 </div>
-              ))}
+              </div>
+              <div style={statCardStyle}>
+                <div style={{ fontWeight: 'bold', marginBottom: '8px' }}>Storage</div>
+                <div style={{ fontSize: '14px', color: '#64748b', lineHeight: '1.6' }}>
+                  💾 Type: IndexedDB<br/>
+                  🔑 Namespace: FeltDB<br/>
+                  🔄 Sync: Automatic
+                </div>
+              </div>
+              <div style={statCardStyle}>
+                <div style={{ fontWeight: 'bold', marginBottom: '8px' }}>Indexes</div>
+                <div style={{ fontSize: '14px', color: '#64748b', lineHeight: '1.6' }}>
+                  📌 projects.status<br/>
+                  📌 tasks.projectId<br/>
+                  📌 tasks.status<br/>
+                  📌 tasks.priority<br/>
+                  📌 activity.timestamp
+                </div>
+              </div>
             </div>
           )}
-        </section>
-${agentMarkup}
-      </main>
-
-      <style>{\`
-        * { box-sizing: border-box; }
-
-        body {
-          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto;
-          margin: 0;
-          padding: 0;
-          background: #f5f7fa;
-          color: #333;
-        }
-
-        .app {
-          max-width: 1400px;
-          margin: 0 auto;
-          padding: 20px;
-        }
-
-        header {
-          background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-          color: white;
-          padding: 40px 30px;
-          border-radius: 12px;
-          margin-bottom: 30px;
-          box-shadow: 0 8px 24px rgba(102, 126, 234, 0.3);
-        }
-
-        header h1 {
-          margin: 0 0 10px 0;
-          font-size: 32px;
-          font-weight: 700;
-        }
-
-        header p {
-          margin: 0;
-          opacity: 0.95;
-          font-size: 16px;
-        }
-
-        main {
-          background: white;
-          padding: 30px;
-          border-radius: 12px;
-          box-shadow: 0 2px 12px rgba(0,0,0,0.08);
-        }
-
-        .stats {
-          display: grid;
-          grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
-          gap: 20px;
-          margin-bottom: 30px;
-        }
-
-        .stat {
-          padding: 24px;
-          background: linear-gradient(135deg, #f5f7fa 0%, #f9f9f9 100%);
-          border-radius: 8px;
-          border-left: 4px solid #667eea;
-          box-shadow: 0 1px 3px rgba(0,0,0,0.05);
-        }
-
-        .stat .label {
-          display: block;
-          color: #999;
-          font-size: 10px;
-          text-transform: uppercase;
-          letter-spacing: 1px;
-          margin-bottom: 8px;
-          font-weight: 700;
-        }
-
-        .stat .value {
-          display: block;
-          font-size: 32px;
-          font-weight: 700;
-          color: #667eea;
-        }
-
-        .error-message {
-          padding: 16px 20px;
-          background: #fff5f5;
-          border: 1px solid #fca5a5;
-          border-left: 4px solid #f56565;
-          border-radius: 8px;
-          margin-bottom: 20px;
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          color: #c53030;
-        }
-
-        .error-message strong { font-weight: 600; }
-
-        .retry-btn {
-          background: #f56565;
-          padding: 8px 16px;
-          font-size: 12px;
-          margin-left: 15px;
-          border-radius: 4px;
-        }
-
-        .retry-btn:hover { background: #e53e3e; }
-
-        .docs-header {
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          margin-bottom: 24px;
-          gap: 20px;
-        }
-
-        .docs-header h2 {
-          margin: 0;
-          color: #1a202c;
-          font-size: 26px;
-          flex: 1;
-        }
-
-        .docs-controls {
-          display: flex;
-          gap: 12px;
-          flex: 1;
-          max-width: 600px;
-        }
-
-        .search-input {
-          flex: 1;
-          padding: 10px 16px;
-          border: 1px solid #e2e8f0;
-          border-radius: 6px;
-          font-size: 14px;
-          transition: all 0.2s ease;
-        }
-
-        .search-input:focus {
-          outline: none;
-          border-color: #667eea;
-          box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
-        }
-
-        .loading {
-          text-align: center;
-          padding: 60px 20px;
-          color: #999;
-        }
-
-        .spinner {
-          display: inline-block;
-          width: 48px;
-          height: 48px;
-          border: 4px solid #e2e8f0;
-          border-top-color: #667eea;
-          border-radius: 50%;
-          animation: spin 0.8s linear infinite;
-          margin-bottom: 20px;
-        }
-
-        @keyframes spin { to { transform: rotate(360deg); } }
-
-        .empty-state {
-          text-align: center;
-          padding: 60px 20px;
-          color: #999;
-        }
-
-        .empty-state p { margin: 8px 0; font-size: 16px; }
-        .empty-state .hint { font-size: 14px; opacity: 0.8; }
-
-        .docs-grid {
-          display: grid;
-          grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
-          gap: 20px;
-        }
-
-        .doc-card {
-          background: #f9f9f9;
-          border: 1px solid #e2e8f0;
-          border-radius: 8px;
-          padding: 20px;
-          transition: all 0.3s ease;
-          display: flex;
-          flex-direction: column;
-        }
-
-        .doc-card:hover {
-          border-color: #667eea;
-          box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
-          transform: translateY(-2px);
-        }
-
-        .doc-card h3 {
-          margin: 0 0 12px 0;
-          color: #1a202c;
-          font-size: 18px;
-          font-weight: 600;
-          word-break: break-word;
-        }
-
-        .doc-preview {
-          flex: 1;
-          margin: 0 0 12px 0;
-          color: #666;
-          font-size: 14px;
-          line-height: 1.6;
-          display: -webkit-box;
-          -webkit-line-clamp: 3;
-          -webkit-box-orient: vertical;
-          overflow: hidden;
-        }
-
-        .doc-meta {
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-          padding: 12px 0;
-          border-top: 1px solid #e2e8f0;
-          border-bottom: 1px solid #e2e8f0;
-          margin-bottom: 12px;
-          font-size: 12px;
-          color: #999;
-        }
-
-        .doc-size {
-          background: #f0f4ff;
-          padding: 2px 8px;
-          border-radius: 4px;
-          color: #667eea;
-          font-weight: 600;
-        }
-
-        .doc-actions {
-          display: flex;
-          gap: 8px;
-        }
-
-        .edit-btn, .delete-btn, .save-btn, .cancel-btn {
-          flex: 1;
-          padding: 8px 12px;
-          font-size: 13px;
-          border: 1px solid;
-          border-radius: 6px;
-          cursor: pointer;
-          font-weight: 600;
-          transition: all 0.2s ease;
-        }
-
-        .edit-btn {
-          background: #eef2ff;
-          border-color: #667eea;
-          color: #667eea;
-        }
-
-        .edit-btn:hover { background: #e0e7ff; }
-
-        .delete-btn {
-          background: #fee;
-          border-color: #fca5a5;
-          color: #c53030;
-        }
-
-        .delete-btn:hover:not(:disabled) { background: #fdd; }
-        .delete-btn:disabled { opacity: 0.6; cursor: not-allowed; }
-
-        .edit-mode {
-          display: flex;
-          flex-direction: column;
-          gap: 12px;
-        }
-
-        .edit-title, .edit-content {
-          padding: 10px 12px;
-          border: 1px solid #ddd;
-          border-radius: 6px;
-          font-family: inherit;
-          font-size: 14px;
-        }
-
-        .edit-title {
-          font-size: 16px;
-          font-weight: 600;
-        }
-
-        .edit-title:focus, .edit-content:focus {
-          outline: none;
-          border-color: #667eea;
-          box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
-        }
-
-        .edit-actions {
-          display: flex;
-          gap: 8px;
-        }
-
-        .save-btn {
-          background: #667eea;
-          color: white;
-          border: none;
-          flex: 1;
-        }
-
-        .save-btn:hover { background: #5568d3; }
-
-        .cancel-btn {
-          background: #f0f0f0;
-          color: #666;
-          border: none;
-          flex: 1;
-        }
-
-        .cancel-btn:hover { background: #e0e0e0; }
-
-        .primary-btn {
-          background: #667eea;
-          color: white;
-          border: none;
-          padding: 10px 20px;
-          white-space: nowrap;
-        }
-
-        .primary-btn:hover:not(:disabled) { background: #5568d3; }
-        .primary-btn:disabled { opacity: 0.6; cursor: not-allowed; }
-
-        textarea, input {
-          display: block;
-          width: 100%;
-          margin: 12px 0;
-          padding: 12px;
-          font-family: inherit;
-          font-size: 14px;
-          border: 1px solid #ddd;
-          border-radius: 6px;
-          resize: vertical;
-        }
-
-        textarea:focus, input:focus {
-          outline: none;
-          border-color: #667eea;
-          box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
-        }
-
-        .status-badge {
-          display: inline-block;
-          padding: 8px 12px;
-          background: #f0f4ff;
-          color: #667eea;
-          border-radius: 6px;
-          font-size: 12px;
-          font-weight: 600;
-          margin-bottom: 16px;
-        }
-
-        .researcher {
-          border-top: 2px solid #e2e8f0;
-          margin-top: 40px;
-          padding-top: 30px;
-        }
-
-        .researcher h2 {
-          margin-top: 0;
-          color: #1a202c;
-          font-size: 20px;
-        }
-
-        .research-btn {
-          background: #667eea;
-          color: white;
-          border: none;
-          padding: 12px 24px;
-          margin: 16px 0;
-          border-radius: 6px;
-          cursor: pointer;
-          font-weight: 600;
-          transition: all 0.2s ease;
-        }
-
-        .research-btn:hover:not(:disabled) { background: #5568d3; }
-        .research-btn:disabled { opacity: 0.6; cursor: not-allowed; }
-
-        .research-result {
-          background: #f5f8ff;
-          border: 1px solid #d4e0ff;
-          border-radius: 8px;
-          padding: 16px;
-          margin-top: 20px;
-        }
-
-        .ai-modes {
-          display: flex;
-          gap: 16px;
-          margin-bottom: 16px;
-          flex-wrap: wrap;
-        }
-
-        .mode-group {
-          display: flex;
-          flex-direction: column;
-          gap: 6px;
-        }
-
-        .mode-group-label {
-          font-size: 11px;
-          font-weight: 700;
-          text-transform: uppercase;
-          color: #999;
-          letter-spacing: 0.5px;
-        }
-
-        .mode-group {
-          display: flex;
-          gap: 6px;
-          flex-wrap: wrap;
-        }
-
-        .mode-btn {
-          background: #f0f4ff;
-          color: #667eea;
-          border: 1px solid #d4e0ff;
-          padding: 8px 14px;
-          border-radius: 6px;
-          cursor: pointer;
-          font-size: 12px;
-          font-weight: 600;
-          transition: all 0.2s ease;
-        }
-
-        .mode-btn:hover:not(:disabled) {
-          background: #e0e7ff;
-          border-color: #667eea;
-          transform: translateY(-1px);
-        }
-
-        .mode-btn.active {
-          background: #667eea;
-          color: white;
-          border-color: #667eea;
-        }
-
-        .mode-btn.code-mode {
-          background: #fef5e7;
-          color: #c87832;
-          border-color: #f4d29d;
-        }
-
-        .mode-btn.code-mode:hover:not(:disabled) {
-          background: #fdebd0;
-          border-color: #c87832;
-        }
-
-        .mode-btn.code-mode.active {
-          background: #c87832;
-          color: white;
-          border-color: #c87832;
-        }
-
-        .mode-btn:disabled {
-          opacity: 0.5;
-          cursor: not-allowed;
-        }
-
-        .doc-selector {
-          margin-bottom: 16px;
-        }
-
-        .doc-selector label {
-          display: block;
-          font-size: 13px;
-          font-weight: 600;
-          color: #666;
-          margin-bottom: 8px;
-          text-transform: uppercase;
-          letter-spacing: 0.5px;
-        }
-
-        .doc-selector select {
-          width: 100%;
-          padding: 10px 12px;
-          border: 1px solid #ddd;
-          border-radius: 6px;
-          font-family: inherit;
-          font-size: 14px;
-          background: white;
-        }
-
-        .doc-selector select:focus {
-          outline: none;
-          border-color: #667eea;
-          box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
-        }
-
-        .research-result h3 {
-          margin: 0 0 12px 0;
-          color: #667eea;
-          font-size: 16px;
-        }
-
-        .result-content {
-          color: #555;
-          line-height: 1.6;
-          font-size: 14px;
-          margin-bottom: 16px;
-          max-height: 400px;
-          overflow-y: auto;
-          padding: 12px;
-          background: white;
-          border-radius: 4px;
-        }
-
-        .result-actions {
-          display: flex;
-          gap: 8px;
-          flex-wrap: wrap;
-        }
-
-        .save-result-btn, .copy-result-btn {
-          flex: 1;
-          min-width: 140px;
-          background: #48bb78;
-          color: white;
-          border: none;
-          padding: 10px 16px;
-          border-radius: 6px;
-          cursor: pointer;
-          font-weight: 600;
-          font-size: 13px;
-          transition: all 0.2s ease;
-        }
-
-        .save-result-btn:hover {
-          background: #38a169;
-          transform: translateY(-1px);
-        }
-
-        .copy-result-btn {
-          background: #4299e1;
-        }
-
-        .copy-result-btn:hover {
-          background: #3182ce;
-          transform: translateY(-1px);
-        }
-
-        .code-note {
-          font-size: 12px;
-          color: #999;
-          margin-top: 12px;
-          font-style: italic;
-          border-top: 1px solid #e2e8f0;
-          padding-top: 12px;
-        }
-
-        @media (max-width: 768px) {
-          .docs-header {
-            flex-direction: column;
-            align-items: stretch;
-          }
-          .docs-controls {
-            flex-direction: column;
-            max-width: 100%;
-          }
-          .docs-grid {
-            grid-template-columns: 1fr;
-          }
-          header { padding: 24px 20px; }
-          main { padding: 20px; }
-        }
-      \`}</style>
+        </div>
+      </div>
     </div>
   );
 }
 `;
+        ;
         fs.writeFileSync(path.join(srcDir, 'App.tsx'), appTsx);
         const indexTsx = `import React from 'react';
 import ReactDOM from 'react-dom/client';
@@ -1430,12 +1151,20 @@ main().catch(console.error);
 # Copy this file to .env.local and update the values
 
 # API Key for authenticating with FeltDB servers
-# Leave empty for browser runtime, required for self-hosted
+# Leave empty for browser runtime; required for authenticated self-hosted and managed runtimes
 VITE_FELTDB_API_KEY=
 
-# FeltDB Server URL (for self-hosted runtime)
+# FeltDB Server URL (self-hosted or managed runtime)
 VITE_FELTDB_URL=http://localhost:7700
 
+# Managed example: https://runtime.your-app.feltdb.com
+VITE_FELTDB_MANAGED_URL=
+VITE_FELTDB_MANAGED_API_KEY=
+VITE_FELTDB_MANAGED_TENANT_ID=
+VITE_FELTDB_MANAGED_APPLICATION_ID=
+VITE_FELTDB_MANAGED_NAMESPACE=
+VITE_FELTDB_MANAGED_ENVIRONMENT=production
+
 # Override the default self-hosted container image
 # Example: ghcr.io/rkendel1/feltdb:latest
 FELTDB_IMAGE=
@@ -1544,6 +1273,17 @@ npm run dev
 
 The self-hosted instance runs on \`http://localhost:7700\` by default.
 
+## Managed Runtime
+
+\`\`\`json
+{
+  "runtime": "managed",
+  "storage": "managed"
+}
+\`\`\`
+
+Managed mode uses the same application API with a FeltDB-hosted endpoint. The CLI creates \`.env.local\` with \`VITE_FELTDB_MANAGED_URL\` and \`VITE_FELTDB_MANAGED_API_KEY\` after account setup. Studio uses that same connection for state, health, operations, and API-key administration.
+
 ## Vector Search Status
 
 ### Current Status
@@ -1700,8 +1440,10 @@ build/
     // Create README
     const readme = `# ${applicationName}
 
-A FeltDB distributed application with agents and capabilities.
-- **Runtime:** ${runtime}
+A FeltDB Workspace application demonstrating local-first database capabilities.
+
+**Deployment Target:** \`${runtime}\`
+- **Runtime:** ${runtime === 'browser' ? 'Browser (IndexedDB)' : runtime === 'node' ? 'Node.js Server' : runtime === 'managed' ? 'Managed FeltDB' : 'Self-hosted Docker'}
 - **Framework:** ${framework}
 - **Distributed:** ${distributed ? 'Yes' : 'No'}
 - **Agents:** ${hasAgents ? 'Yes' : 'No'}
@@ -1714,21 +1456,42 @@ npm install
 npm run dev
 \`\`\`
 
-The application will be available at http://localhost:5173.
+The application will be available at http://localhost:5173 (or your configured port).
+
+## FeltDB Workspace Showcase
+
+This application demonstrates core FeltDB capabilities:
+
+✅ **Collections & Relationships** - Projects, Tasks, and Activity collections with foreign key relationships
+✅ **Indexed Querying** - Efficient queries by projectId, status, priority, and timestamp
+✅ **Activity/Audit Logs** - Append-only event collection demonstrating immutable history
+✅ **Persistent Storage** - Data persists through page reloads (IndexedDB)
+✅ **Reactive State** - Real-time updates using React hooks
+✅ **Local-first** - Works offline with no server required
+✅ **Data Inspector** - Built-in developer panel to inspect collections and indexes
+
+### Application Features
+
+- **Dashboard** - Overview of projects, tasks, and runtime status
+- **Projects** - Create and manage projects with descriptions
+- **Tasks** - Create tasks within projects with priority and status
+- **Activity Log** - Append-only event history of all changes
+- **Search** - Indexed searching across task titles and descriptions
+- **Data Inspector** - Developer panel showing collections, indexes, and storage info
 
 ## Project Structure
 
 \`\`\`
 ${applicationName}/
-├── feltdb/                 # FeltDB configuration and logic
+├── feltdb/                 # FeltDB configuration
 │   ├── agents/            # Agent definitions
 │   ├── capabilities/      # Capability implementations
 │   ├── workflows/         # Workflow definitions
 │   └── schema/            # Data schemas
 ├── src/                   # Application source code
-│   ├── App.${framework === 'react' ? 'tsx' : 'js'}
-│   ├── feltdb.ts          # FeltDB client initialization
-│   └── index.${framework === 'react' ? 'tsx' : 'js'}
+│   ├── App.${framework === 'react' ? 'tsx' : 'js'}         # Main workspace UI
+│   ├── feltdb.ts          # FeltDB collections and operations
+│   └── index.${framework === 'react' ? 'tsx' : 'js'}       # Entry point
 ├── public/                # Static assets
 ├── index.html
 ├── .feltdb/               # Local FeltDB configuration
@@ -1739,37 +1502,63 @@ ${applicationName}/
 └── README.md
 \`\`\`
 
-## Runtime Options
-
-### Browser (\`browser\`)
-- Local-first, client-side only
-- Uses browser OPFS (Origin Private File System) for storage
-- No server required
-- Best for: Offline-first apps, privacy-focused applications
-- Limitations: Single device scope (data stays local)
-
-### Node.js (\`node\`)
-- Server-side Node.js runtime
-- In-memory or file-based storage
-- Suitable for APIs and backend services
-- Best for: Server-side applications, REST APIs
-- Limitations: Memory-based by default
-
-### Self-Hosted (\`self-hosted\`)
-- Dedicated FeltDB server instance
-- Durable storage with distributed capabilities
-- Requires Docker (image: ghcr.io/rkendel1/feltdb)
-- Best for: Production deployments, multi-user systems
-- Setup: \`npm run dev\` starts the Docker container automatically
+## FeltDB Runtime
+
+This project was created with the **${runtime === 'browser' ? 'Browser' : runtime === 'node' ? 'Node.js Server' : runtime === 'managed' ? 'Managed' : 'Self-hosted'}** runtime.
+
+### Browser Runtime
+
+FeltDB runs locally in the browser and persists through IndexedDB.
+
+- ✅ Zero server/database infrastructure
+- ✅ Works completely offline
+- ✅ Data stays on your device (privacy-first)
+- ✅ Best for: Client-side apps, offline-first experiences, prototypes
+
+**Data Persistence:** IndexedDB (OPFS fallback)
+
+### Node.js Runtime
+
+FeltDB runs as a Node.js server with server-side authority.
+
+- ✅ Server-side FeltDB authority
+- ✅ Persistent file-based storage
+- ✅ Multi-client capable
+- ✅ Best for: Server-side applications, APIs, backend services
+
+**Data Persistence:** File-based storage
+
+### Self-hosted Runtime
+
+FeltDB runs through a dedicated server with Docker Compose and persistent data volume.
+
+- ✅ Production-ready deployment
+- ✅ Multi-node replication
+- ✅ Health checks and orchestration
+- ✅ Best for: Production deployments, multi-user systems
+
+**Data Persistence:** Docker volume (persistent /data)
+
+### Managed Runtime
+
+FeltDB provides the runtime endpoint, durable storage, synchronization, and background workload infrastructure. The CLI configures \`VITE_FELTDB_MANAGED_URL\` and \`VITE_FELTDB_MANAGED_API_KEY\` in \`.env.local\`.
 
 ## Configuration
 
 Configuration is in \`feltdb.config.json\`:
-- \`runtime\`: ${runtime}
-- \`storage\`: ${runtime === 'browser' ? 'opfs' : 'durable'}
-- \`distributed\`: ${distributed}
-- \`agents.enabled\`: ${hasAgents}
-- \`capabilities\`: ${capabilities}
+
+\`\`\`json
+{
+  "namespace": "${applicationName}",
+  "runtime": "${runtime}",
+  "storage": "${runtime === 'browser' ? 'indexeddb' : runtime === 'managed' ? 'managed' : 'durable'}",
+  "distributed": ${distributed},
+  "agents": {
+    "enabled": ${hasAgents}
+  },
+  "capabilities": ["${capabilities}"]
+}
+\`\`\`
 
 ### Environment Variables
 
@@ -1778,9 +1567,12 @@ Create a \`.env.local\` file (copy from \`.env.example\`):
 \`\`\`
 VITE_FELTDB_API_KEY=your_api_key_here
 VITE_FELTDB_URL=http://localhost:7700
+VITE_FELTDB_MANAGED_API_KEY=your_managed_api_key_here
+VITE_FELTDB_MANAGED_URL=https://api.feltdb.com
+VITE_FELTDB_WEBSOCKET_URL=ws://localhost:7700
 \`\`\`
 
-These are used when connecting to a self-hosted FeltDB instance.
+These are required when connecting to an authenticated self-hosted or managed FeltDB instance.
 
 ## Development
 
@@ -1804,59 +1596,95 @@ npm run feltdb:validate
 npm run feltdb:status
 \`\`\`
 
-## Database Operations
-
-### Collections
+### Open FeltDB Studio
+\`\`\`bash
+npm run feltdb:studio
+\`\`\`
 
-The application includes pre-configured collections:
-- \`documents\`: Stores research documents
-- \`reports\`: Stores generated reports
+## Database Schema
 
-### Schema
+### Collections
 
-Review \`feltdb.flow\` for the complete schema and workflow definitions.
+#### projects
+- **id** (string): Unique project identifier
+- **name** (string): Project name
+- **description** (string): Project description
+- **status** (string): 'active' | 'archived' | 'completed'
+- **createdAt** (string): ISO timestamp
+- **updatedAt** (string): ISO timestamp
+- **metadata** (object, optional): Custom metadata
+
+**Indexes:** status
+
+#### tasks
+- **id** (string): Unique task identifier
+- **projectId** (string): Foreign key to projects
+- **title** (string): Task title
+- **description** (string): Task description
+- **status** (string): 'todo' | 'in-progress' | 'completed'
+- **priority** (string): 'low' | 'medium' | 'high'
+- **assignee** (string, optional): Assigned team member
+- **createdAt** (string): ISO timestamp
+- **updatedAt** (string): ISO timestamp
+
+**Indexes:** projectId, status, priority
+
+#### activity
+- **id** (string): Unique event identifier
+- **timestamp** (string): ISO timestamp
+- **type** (string): Event type
+- **entityType** (string): 'project' | 'task'
+- **entityId** (string): Reference to entity
+- **entityName** (string): Name of entity
+- **changes** (object, optional): Changed fields
+- **userId** (string, optional): User who made change
+
+**Indexes:** timestamp, (entityType, entityId)
 
 ## Agents
 
-${hasAgents ? `### Researcher Agent
-The \`researcher\` agent runs real private inference using \`@feltdb/webllm\`:
-- Runs entirely in the browser (no data sent to servers)
+${hasAgents ? `### Available Agents
+The application includes autonomous agents powered by \`@feltdb/webllm\`:
+- Runs entirely in the browser (private, no external APIs)
 - Model downloads on first use
 - Inference runs in a Web Worker
-- Generated reports are stored in FeltDB
-- Learn more: https://github.com/mlc-ai/web-llm` : 'No agents configured. Add agents by re-running create-feltdb.'}
-
-## Vector Search
-
-${capabilities.includes('vector') ? `Vector search is enabled. Configure your vector storage backend in \`feltdb.config.json\`.` : `Vector search is not enabled. To add it, update \`feltdb.config.json\` to include \`"vector-search": true\` in capabilities.`}
+- Learn more: https://github.com/mlc-ai/web-llm` : 'No agents configured. To enable agents, re-run create-feltdb or add them to feltdb.config.json.'}
 
 ## Troubleshooting
 
-### "Model not loaded" in Researcher
-If the WebLLM Researcher shows "Model not loaded":
+### Data not persisting
 1. Check browser console for errors
-2. Ensure sufficient disk space (models are ~2-3GB)
-3. Try in a private/incognito window if localStorage is full
+2. Verify IndexedDB is enabled (not in private mode)
+3. Check browser storage quota
 4. Clear browser cache and try again
 
+### Slow performance
+1. Check browser DevTools Performance tab
+2. Verify indexes are being used (check Data Inspector)
+3. Consider optimizing queries or collection size
+
 ### Self-Hosted Connection Issues
 If using self-hosted mode and connection fails:
 1. Ensure Docker is installed and running
-2. Check FELTDB_URL and API key in .env.local
+2. Check VITE_FELTDB_URL and API key in .env.local
 3. Run \`npm run feltdb:status\` to check server health
-4. View logs: \`docker logs feltdb\`
+4. View Docker logs: \`docker logs feltdb\`
 
-### API Key Errors
-If API key management fails in Studio:
-1. Verify VITE_FELTDB_URL is set correctly
-2. Ensure token has proper scopes
-3. Check CORS settings on self-hosted server
+### Port conflicts
+If port 5173 is in use:
+1. Change the port in \`vite.config.ts\`
+2. Or: \`npm run dev -- --port 3000\`
 
 ## Learn More
 
 - [FeltDB Documentation](https://github.com/rkendel1/feltdb)
-- [WebLLM Documentation](https://github.com/mlc-ai/web-llm)
-- [Distribution & Capabilities](https://github.com/rkendel1/feltdb/docs/capabilities.md)
+- [FeltDB Architecture](https://github.com/rkendel1/feltdb/blob/main/ARCHITECTURE.md)
+- [WebLLM (In-browser LLM)](https://github.com/mlc-ai/web-llm)
+- [Getting Started Guide](https://github.com/rkendel1/feltdb/blob/main/GETTING_STARTED.md)
+
+## License
+
+MIT
 `;
     fs.writeFileSync(path.join(projectDir, 'README.md'), readme);
 }