package-lock.json

@@ -14,8 +14,7 @@
         "next": "16.1.4",
         "react": "19.2.3",
         "react-dom": "19.2.3",
-        "reactflow": "^11.11.4",
+        "reactflow": "^11.11.4"
-        "yjs": "^13.6.29"
       },
       "devDependencies": {
         "@tailwindcss/postcss": "^4",
@@ -4976,16 +4975,6 @@
       "dev": true,
       "license": "ISC"
     },
-    "node_modules/isomorphic.js": {
-      "version": "0.2.5",
-      "resolved": "https://registry.npmjs.org/isomorphic.js/-/isomorphic.js-0.2.5.tgz",
-      "integrity": "sha512-PIeMbHqMt4DnUP3MA/Flc0HElYjMXArsw1qwJZcm9sqR8mq3l8NYizFMty0pWwE/tzIGH3EKK5+jes5mAr85yw==",
-      "license": "MIT",
-      "funding": {
-        "type": "GitHub Sponsors ❤",
-        "url": "https://github.com/sponsors/dmonad"
-      }
-    },
     "node_modules/iterator.prototype": {
       "version": "1.1.5",
       "resolved": "https://registry.npmjs.org/iterator.prototype/-/iterator.prototype-1.1.5.tgz",
@@ -5141,27 +5130,6 @@
         "node": ">= 0.8.0"
       }
     },
-    "node_modules/lib0": {
-      "version": "0.2.117",
-      "resolved": "https://registry.npmjs.org/lib0/-/lib0-0.2.117.tgz",
-      "integrity": "sha512-DeXj9X5xDCjgKLU/7RR+/HQEVzuuEUiwldwOGsHK/sfAfELGWEyTcf0x+uOvCvK3O2zPmZePXWL85vtia6GyZw==",
-      "license": "MIT",
-      "dependencies": {
-        "isomorphic.js": "^0.2.4"
-      },
-      "bin": {
-        "0ecdsa-generate-keypair": "bin/0ecdsa-generate-keypair.js",
-        "0gentesthtml": "bin/gentesthtml.js",
-        "0serve": "bin/0serve.js"
-      },
-      "engines": {
-        "node": ">=16"
-      },
-      "funding": {
-        "type": "GitHub Sponsors ❤",
-        "url": "https://github.com/sponsors/dmonad"
-      }
-    },
     "node_modules/lightningcss": {
       "version": "1.30.2",
       "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.30.2.tgz",
@@ -7218,23 +7186,6 @@
       "dev": true,
       "license": "ISC"
     },
-    "node_modules/yjs": {
-      "version": "13.6.29",
-      "resolved": "https://registry.npmjs.org/yjs/-/yjs-13.6.29.tgz",
-      "integrity": "sha512-kHqDPdltoXH+X4w1lVmMtddE3Oeqq48nM40FD5ojTd8xYhQpzIDcfE2keMSU5bAgRPJBe225WTUdyUgj1DtbiQ==",
-      "license": "MIT",
-      "dependencies": {
-        "lib0": "^0.2.99"
-      },
-      "engines": {
-        "node": ">=16.0.0",
-        "npm": ">=8.0.0"
-      },
-      "funding": {
-        "type": "GitHub Sponsors ❤",
-        "url": "https://github.com/sponsors/dmonad"
-      }
-    },
     "node_modules/yocto-queue": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",

package.json

@@ -16,8 +16,7 @@
     "next": "16.1.4",
     "react": "19.2.3",
     "react-dom": "19.2.3",
-    "reactflow": "^11.11.4",
+    "reactflow": "^11.11.4"
-    "yjs": "^13.6.29"
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4",

prd.json

@@ -216,7 +216,7 @@
         "Verify in browser using dev-browser skill"
       ],
       "priority": 12,
-      "passes": true,
+      "passes": false,
       "notes": "Dependencies: US-058, US-059, US-060, US-061"
     },
     {
@@ -232,7 +232,7 @@
         "Typecheck passes"
       ],
       "priority": 13,
-      "passes": true,
+      "passes": false,
       "notes": ""
     },
     {
@@ -251,7 +251,7 @@
         "Verify in browser using dev-browser skill"
       ],
       "priority": 14,
-      "passes": true,
+      "passes": false,
       "notes": "Dependencies: US-043"
     },
     {
@@ -269,7 +269,7 @@
         "Verify in browser using dev-browser skill"
       ],
       "priority": 15,
-      "passes": true,
+      "passes": false,
       "notes": "Dependencies: US-043"
     },
     {
@@ -287,7 +287,7 @@
         "Verify in browser using dev-browser skill"
       ],
       "priority": 16,
-      "passes": true,
+      "passes": false,
       "notes": "Dependencies: US-045"
     },
     {
@@ -306,7 +306,7 @@
         "Typecheck passes"
       ],
       "priority": 17,
-      "passes": true,
+      "passes": false,
       "notes": "Dependencies: US-045"
     },
     {

progress.txt

@@ -43,23 +43,6 @@
 - `ChoiceOption` type includes optional `condition?: Condition`. When counting variable usage, check variable nodes + edge conditions + choice option conditions.
 - React Compiler lint forbids `setState` in effects and reading `useRef().current` during render. Use `useState(() => computeValue())` lazy initializer pattern for one-time initialization logic.
 - For detecting legacy data shape (pre-migration), pass a flag from the server component (page.tsx) to the client component, since only the server reads raw DB data.
-- Collaboration tables: `project_collaborators` (roles), `collaboration_sessions` (presence), `audit_trail` (history) — all with RLS scoped by project ownership or collaborator membership
-- RLS pattern for shared resources: check `projects.user_id = auth.uid()` OR `project_collaborators.user_id = auth.uid()` to cover both owners and collaborators
-- `RealtimeConnection` class at `src/lib/collaboration/realtime.ts` manages Supabase Realtime channel lifecycle (connect, heartbeat, reconnect, disconnect). Instantiate with (projectId, userId, callbacks).
-- FlowchartEditor receives `userId` prop from page.tsx server component for collaboration features
-- Toolbar accepts optional `connectionState` prop to show green/yellow/red connection indicator
-- `collaboration_sessions` table has UNIQUE(project_id, user_id) constraint to support upsert-based session management
-- Server actions for project-specific operations go in `src/app/editor/[projectId]/actions.ts` — use `'use server'` directive and return `{ success: boolean; error?: string }` pattern
-- Editor page.tsx supports both owner and collaborator access: first checks ownership, then falls back to `project_collaborators` lookup. Pass `isOwner` prop to client component.
-- `ShareModal` at `src/components/editor/ShareModal.tsx` manages collaborator invites/roles/removal via server actions. Only owners see invite form.
-- Dashboard shared projects use Supabase join query: `project_collaborators.select('role, projects(id, name, updated_at)')` to fetch projects shared with the user
-- `ProjectCard` supports optional `shared` and `sharedRole` props — when `shared=true`, hide edit/delete buttons and show role badge instead
-- `PresenceAvatars` at `src/components/editor/PresenceAvatars.tsx` renders connected collaborator avatars. Receives `PresenceUser[]` from `RealtimeConnection.onPresenceSync`.
-- `RealtimeConnection` constructor takes `(projectId, userId, displayName, callbacks)` — `displayName` is broadcast via Supabase Realtime presence tracking
-- User color for presence is derived from a hash of their userId, ensuring consistency across sessions. Use `getUserColor(userId)` pattern from PresenceAvatars.
-- `CRDTManager` at `src/lib/collaboration/crdt.ts` wraps a Yjs Y.Doc with Y.Map<string> for nodes and edges. Connects to Supabase Realtime channel for broadcasting updates.
-- CRDT sync pattern: local React Flow changes → `updateNodes`/`updateEdges` on CRDTManager → Yjs broadcasts to channel; remote broadcasts → Yjs applies update → callbacks set React Flow state. Use `isRemoteUpdateRef` to prevent echo loops.
-- For Supabase Realtime broadcast of binary data (Yjs updates), convert `Uint8Array` → `Array.from()` for JSON payload, and `new Uint8Array()` on receive.
 
 ---
 

src/app/dashboard/page.tsx

@@ -1,7 +1,6 @@
 import { createClient } from '@/lib/supabase/server'
 import NewProjectButton from '@/components/NewProjectButton'
 import ProjectList from '@/components/ProjectList'
-import ProjectCard from '@/components/ProjectCard'
 
 export default async function DashboardPage() {
   const supabase = await createClient()
@@ -20,21 +19,6 @@ export default async function DashboardPage() {
     .eq('user_id', user.id)
     .order('updated_at', { ascending: false })
 
-  // Fetch shared projects (projects where this user is a collaborator)
-  const { data: collaborations } = await supabase
-    .from('project_collaborators')
-    .select('role, projects(id, name, updated_at)')
-    .eq('user_id', user.id)
-
-  const sharedProjects = (collaborations || [])
-    .filter((c) => c.projects)
-    .map((c) => ({
-      ...(c.projects as unknown as { id: string; name: string; updated_at: string }),
-      shared: true,
-      role: c.role,
-    }))
-    .sort((a, b) => new Date(b.updated_at).getTime() - new Date(a.updated_at).getTime())
-
   if (error) {
     return (
       <div className="rounded-lg border border-red-200 bg-red-50 p-4 dark:border-red-800 dark:bg-red-900/20">
@@ -60,26 +44,6 @@ export default async function DashboardPage() {
       </div>
 
       <ProjectList initialProjects={projects || []} />
-
-      {sharedProjects.length > 0 && (
-        <div className="mt-10">
-          <h2 className="mb-4 text-xl font-bold text-zinc-900 dark:text-zinc-50">
-            Shared with me
-          </h2>
-          <div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
-            {sharedProjects.map((project) => (
-              <ProjectCard
-                key={project.id}
-                id={project.id}
-                name={project.name}
-                updatedAt={project.updated_at}
-                shared
-                sharedRole={project.role}
-              />
-            ))}
-          </div>
-        </div>
-      )}
     </div>
   )
 }

src/app/editor/[projectId]/FlowchartEditor.tsx

@@ -1,6 +1,11 @@
 'use client'
 
+<<<<<<< HEAD
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import { useRouter } from 'next/navigation'
+=======
 import React, { useCallback, useMemo, useState } from 'react'
+>>>>>>> ralph/collaboration-and-character-variables
 import ReactFlow, {
   Background,
   BackgroundVariant,
@@ -27,16 +32,37 @@ import { createClient } from '@/lib/supabase/client'
 import DialogueNode from '@/components/editor/nodes/DialogueNode'
 import ChoiceNode from '@/components/editor/nodes/ChoiceNode'
 import VariableNode from '@/components/editor/nodes/VariableNode'
+<<<<<<< HEAD
+import ConditionalEdge from '@/components/editor/edges/ConditionalEdge'
+import ContextMenu, { ContextMenuType } from '@/components/editor/ContextMenu'
+import ConditionEditor from '@/components/editor/ConditionEditor'
+import type { FlowchartData, FlowchartNode, FlowchartEdge, Condition } from '@/types/flowchart'
+
+// LocalStorage key prefix for draft saves
+const DRAFT_KEY_PREFIX = 'vnwrite-draft-'
+
+// Debounce delay in ms
+const AUTOSAVE_DEBOUNCE_MS = 1000
+
+type ContextMenuState = {
+  x: number
+  y: number
+  type: ContextMenuType
+  nodeId?: string
+  edgeId?: string
+} | null
+
+type ConditionEditorState = {
+  edgeId: string
+  condition?: Condition
+} | null
+=======
 import ProjectSettingsModal from '@/components/editor/ProjectSettingsModal'
 import ConditionEditor from '@/components/editor/ConditionEditor'
-import ExportValidationModal, { type ValidationIssue } from '@/components/editor/ExportValidationModal'
 import { EditorProvider } from '@/components/editor/EditorContext'
 import Toast from '@/components/Toast'
-import { RealtimeConnection, type ConnectionState, type PresenceUser } from '@/lib/collaboration/realtime'
-import { CRDTManager } from '@/lib/collaboration/crdt'
-import { createClient } from '@/lib/supabase/client'
-import ShareModal from '@/components/editor/ShareModal'
 import type { FlowchartData, FlowchartNode, FlowchartEdge, Character, Variable, Condition } from '@/types/flowchart'
+>>>>>>> ralph/collaboration-and-character-variables
 
 type FlowchartEditorProps = {
   projectId: string
@@ -71,6 +97,314 @@ function toReactFlowEdges(edges: FlowchartEdge[]): Edge[] {
   }))
 }
 
+<<<<<<< HEAD
+// Convert React Flow Node type back to our FlowchartNode type
+function fromReactFlowNodes(nodes: Node[]): FlowchartNode[] {
+  return nodes.map((node) => ({
+    id: node.id,
+    type: node.type as 'dialogue' | 'choice' | 'variable',
+    position: node.position,
+    data: node.data,
+  })) as FlowchartNode[]
+}
+
+// Convert React Flow Edge type back to our FlowchartEdge type
+function fromReactFlowEdges(edges: Edge[]): FlowchartEdge[] {
+  return edges.map((edge) => ({
+    id: edge.id,
+    source: edge.source,
+    sourceHandle: edge.sourceHandle ?? undefined,
+    target: edge.target,
+    targetHandle: edge.targetHandle ?? undefined,
+    data: edge.data,
+  }))
+}
+
+// Get LocalStorage key for a project
+function getDraftKey(projectId: string): string {
+  return `${DRAFT_KEY_PREFIX}${projectId}`
+}
+
+// Save draft to LocalStorage
+function saveDraft(projectId: string, data: FlowchartData): void {
+  try {
+    localStorage.setItem(getDraftKey(projectId), JSON.stringify(data))
+  } catch (error) {
+    console.error('Failed to save draft to LocalStorage:', error)
+  }
+}
+
+// Load draft from LocalStorage
+function loadDraft(projectId: string): FlowchartData | null {
+  try {
+    const draft = localStorage.getItem(getDraftKey(projectId))
+    if (!draft) return null
+    return JSON.parse(draft) as FlowchartData
+  } catch (error) {
+    console.error('Failed to load draft from LocalStorage:', error)
+    return null
+  }
+}
+
+// Clear draft from LocalStorage
+export function clearDraft(projectId: string): void {
+  try {
+    localStorage.removeItem(getDraftKey(projectId))
+  } catch (error) {
+    console.error('Failed to clear draft from LocalStorage:', error)
+  }
+}
+
+// Compare two FlowchartData objects for equality
+function flowchartDataEquals(a: FlowchartData, b: FlowchartData): boolean {
+  return JSON.stringify(a) === JSON.stringify(b)
+}
+
+// Validate imported flowchart data structure
+function isValidFlowchartData(data: unknown): data is FlowchartData {
+  if (!data || typeof data !== 'object') return false
+  const obj = data as Record<string, unknown>
+  if (!Array.isArray(obj.nodes)) return false
+  if (!Array.isArray(obj.edges)) return false
+  return true
+}
+
+// Ren'Py export types
+type RenpyDialogueNode = {
+  type: 'dialogue'
+  speaker: string
+  text: string
+  next?: string
+  condition?: Condition
+}
+
+type RenpyMenuChoice = {
+  label: string
+  next?: string
+  condition?: Condition
+}
+
+type RenpyMenuNode = {
+  type: 'menu'
+  prompt: string
+  choices: RenpyMenuChoice[]
+}
+
+type RenpyVariableNode = {
+  type: 'variable'
+  name: string
+  operation: 'set' | 'add' | 'subtract'
+  value: number
+  next?: string
+  condition?: Condition
+}
+
+type RenpyNode = RenpyDialogueNode | RenpyMenuNode | RenpyVariableNode
+
+type RenpyExport = {
+  projectName: string
+  exportedAt: string
+  sections: Record<string, RenpyNode[]>
+}
+
+// Find the first node (node with no incoming edges)
+function findFirstNode(nodes: FlowchartNode[], edges: FlowchartEdge[]): FlowchartNode | null {
+  const targetIds = new Set(edges.map((e) => e.target))
+  const startNodes = nodes.filter((n) => !targetIds.has(n.id))
+  // Return the first start node, or the first node if all have incoming edges
+  return startNodes[0] || nodes[0] || null
+}
+
+// Get outgoing edge from a node (for dialogue and variable nodes)
+function getOutgoingEdge(nodeId: string, edges: FlowchartEdge[], sourceHandle?: string): FlowchartEdge | undefined {
+  return edges.find((e) => e.source === nodeId && (sourceHandle === undefined || e.sourceHandle === sourceHandle))
+}
+
+// Get all outgoing edges from a node (for choice nodes)
+function getOutgoingEdges(nodeId: string, edges: FlowchartEdge[]): FlowchartEdge[] {
+  return edges.filter((e) => e.source === nodeId)
+}
+
+// Convert flowchart to Ren'Py format using graph traversal
+function convertToRenpyFormat(
+  nodes: FlowchartNode[],
+  edges: FlowchartEdge[],
+  projectName: string
+): RenpyExport {
+  const nodeMap = new Map<string, FlowchartNode>(nodes.map((n) => [n.id, n]))
+  const visited = new Set<string>()
+  const sections: Record<string, RenpyNode[]> = {}
+  let currentSectionName = 'start'
+  let currentSection: RenpyNode[] = []
+
+  // Helper to get or create a label for a node
+  const nodeLabels = new Map<string, string>()
+  let labelCounter = 0
+
+  function getNodeLabel(nodeId: string): string {
+    if (!nodeLabels.has(nodeId)) {
+      const node = nodeMap.get(nodeId)
+      if (node?.type === 'dialogue' && node.data.speaker) {
+        // Use speaker name as part of label if available
+        nodeLabels.set(nodeId, `section_${node.data.speaker.toLowerCase().replace(/\s+/g, '_')}_${labelCounter++}`)
+      } else {
+        nodeLabels.set(nodeId, `section_${labelCounter++}`)
+      }
+    }
+    return nodeLabels.get(nodeId)!
+  }
+
+  // Process a node and its successors
+  function processNode(nodeId: string): void {
+    if (visited.has(nodeId)) return
+    visited.add(nodeId)
+
+    const node = nodeMap.get(nodeId)
+    if (!node) return
+
+    if (node.type === 'dialogue') {
+      const outgoingEdge = getOutgoingEdge(nodeId, edges)
+      const renpyNode: RenpyDialogueNode = {
+        type: 'dialogue',
+        speaker: node.data.speaker || '',
+        text: node.data.text,
+      }
+
+      if (outgoingEdge) {
+        // Check if target node is already visited (creates a jump)
+        if (visited.has(outgoingEdge.target)) {
+          renpyNode.next = getNodeLabel(outgoingEdge.target)
+        } else {
+          renpyNode.next = outgoingEdge.target
+        }
+        if (outgoingEdge.data?.condition) {
+          renpyNode.condition = outgoingEdge.data.condition
+        }
+      }
+
+      currentSection.push(renpyNode)
+
+      // Process next node if not visited
+      if (outgoingEdge && !visited.has(outgoingEdge.target)) {
+        processNode(outgoingEdge.target)
+      }
+    } else if (node.type === 'choice') {
+      const outgoingEdges = getOutgoingEdges(nodeId, edges)
+
+      // Map options to their corresponding edges
+      const choices: RenpyMenuChoice[] = node.data.options.map((option, index) => {
+        // Find edge for this option handle
+        const optionEdge = outgoingEdges.find((e) => e.sourceHandle === `option-${index}`)
+        const choice: RenpyMenuChoice = {
+          label: option.label || `Option ${index + 1}`,
+        }
+
+        if (optionEdge) {
+          // If target is visited, use label; otherwise use target id
+          if (visited.has(optionEdge.target)) {
+            choice.next = getNodeLabel(optionEdge.target)
+          } else {
+            choice.next = optionEdge.target
+          }
+          if (optionEdge.data?.condition) {
+            choice.condition = optionEdge.data.condition
+          }
+        }
+
+        // Per-option condition (visibility condition) takes priority over edge condition
+        if (option.condition) {
+          choice.condition = option.condition
+        }
+
+        return choice
+      })
+
+      const renpyNode: RenpyMenuNode = {
+        type: 'menu',
+        prompt: node.data.prompt || '',
+        choices,
+      }
+
+      currentSection.push(renpyNode)
+
+      // Save current section before processing branches
+      sections[currentSectionName] = currentSection
+
+      // Process each branch in a new section
+      for (const choice of choices) {
+        if (choice.next && !visited.has(choice.next)) {
+          const targetNode = nodeMap.get(choice.next)
+          if (targetNode) {
+            // Start new section for this branch
+            currentSectionName = getNodeLabel(choice.next)
+            currentSection = []
+            processNode(choice.next)
+            if (currentSection.length > 0) {
+              sections[currentSectionName] = currentSection
+            }
+          }
+        }
+      }
+    } else if (node.type === 'variable') {
+      const outgoingEdge = getOutgoingEdge(nodeId, edges)
+      const renpyNode: RenpyVariableNode = {
+        type: 'variable',
+        name: node.data.variableName,
+        operation: node.data.operation,
+        value: node.data.value,
+      }
+
+      if (outgoingEdge) {
+        if (visited.has(outgoingEdge.target)) {
+          renpyNode.next = getNodeLabel(outgoingEdge.target)
+        } else {
+          renpyNode.next = outgoingEdge.target
+        }
+        if (outgoingEdge.data?.condition) {
+          renpyNode.condition = outgoingEdge.data.condition
+        }
+      }
+
+      currentSection.push(renpyNode)
+
+      if (outgoingEdge && !visited.has(outgoingEdge.target)) {
+        processNode(outgoingEdge.target)
+      }
+    }
+  }
+
+  // Find and process starting from the first node
+  const firstNode = findFirstNode(nodes, edges)
+  if (firstNode) {
+    processNode(firstNode.id)
+    // Save the final section if it has content
+    if (currentSection.length > 0 && !sections[currentSectionName]) {
+      sections[currentSectionName] = currentSection
+    }
+  }
+
+  // Replace node IDs in next fields with proper labels
+  for (const sectionNodes of Object.values(sections)) {
+    for (const renpyNode of sectionNodes) {
+      if (renpyNode.type === 'dialogue' || renpyNode.type === 'variable') {
+        if (renpyNode.next && nodeLabels.has(renpyNode.next)) {
+          renpyNode.next = nodeLabels.get(renpyNode.next)
+        }
+      } else if (renpyNode.type === 'menu') {
+        for (const choice of renpyNode.choices) {
+          if (choice.next && nodeLabels.has(choice.next)) {
+            choice.next = nodeLabels.get(choice.next)
+          }
+        }
+      }
+    }
+  }
+
+  return {
+    projectName,
+    exportedAt: new Date().toISOString(),
+    sections,
+=======
 const RANDOM_COLORS = [
   '#EF4444', '#F97316', '#F59E0B', '#10B981',
   '#3B82F6', '#8B5CF6', '#EC4899', '#14B8A6',
@@ -208,11 +542,16 @@ function computeMigration(initialData: FlowchartData, shouldMigrate: boolean) {
     nodes: migratedNodes,
     edges: migratedEdges,
     toastMessage: `Auto-imported ${parts.join(' and ')} from existing data`,
+>>>>>>> ralph/collaboration-and-character-variables
   }
 }
 
 // Inner component that uses useReactFlow hook
+<<<<<<< HEAD
+function FlowchartEditorInner({ projectId, projectName, initialData }: FlowchartEditorProps) {
+=======
 function FlowchartEditorInner({ projectId, initialData, needsMigration }: FlowchartEditorProps) {
+>>>>>>> ralph/collaboration-and-character-variables
   // Define custom node types - memoized to prevent re-renders
   const nodeTypes: NodeTypes = useMemo(
     () => ({
@@ -280,104 +619,8 @@ function FlowchartEditorInner({ projectId, initialData, needsMigration }: Flowch
   const [characters, setCharacters] = useState<Character[]>(migratedData.characters)
   const [variables, setVariables] = useState<Variable[]>(migratedData.variables)
   const [showSettings, setShowSettings] = useState(false)
-  const [showShare, setShowShare] = useState(false)
   const [selectedEdgeId, setSelectedEdgeId] = useState<string | null>(null)
   const [toastMessage, setToastMessage] = useState<string | null>(migratedData.toastMessage)
-  const [validationIssues, setValidationIssues] = useState<ValidationIssue[] | null>(null)
-  const [warningNodeIds, setWarningNodeIds] = useState<Set<string>>(new Set())
-  const [connectionState, setConnectionState] = useState<ConnectionState>('disconnected')
-  const [presenceUsers, setPresenceUsers] = useState<PresenceUser[]>([])
-  const realtimeRef = useRef<RealtimeConnection | null>(null)
-  const crdtRef = useRef<CRDTManager | null>(null)
-  const isRemoteUpdateRef = useRef(false)
-
-  // Initialize CRDT manager and connect to Supabase Realtime channel on mount
-  useEffect(() => {
-    const supabase = createClient()
-
-    const crdtManager = new CRDTManager({
-      onNodesChange: (crdtNodes: FlowchartNode[]) => {
-        isRemoteUpdateRef.current = true
-        setNodes(toReactFlowNodes(crdtNodes))
-        isRemoteUpdateRef.current = false
-      },
-      onEdgesChange: (crdtEdges: FlowchartEdge[]) => {
-        isRemoteUpdateRef.current = true
-        setEdges(toReactFlowEdges(crdtEdges))
-        isRemoteUpdateRef.current = false
-      },
-      onPersist: async (persistNodes: FlowchartNode[], persistEdges: FlowchartEdge[]) => {
-        try {
-          await supabase
-            .from('projects')
-            .update({
-              flowchart_data: {
-                nodes: persistNodes,
-                edges: persistEdges,
-                characters,
-                variables,
-              },
-            })
-            .eq('id', projectId)
-        } catch {
-          // Persistence failure is non-critical; will retry on next change
-        }
-      },
-    })
-
-    // Initialize CRDT document from initial data
-    crdtManager.initializeFromData(migratedData.nodes, migratedData.edges)
-    crdtRef.current = crdtManager
-
-    const connection = new RealtimeConnection(projectId, userId, userDisplayName, {
-      onConnectionStateChange: setConnectionState,
-      onPresenceSync: setPresenceUsers,
-      onChannelSubscribed: (channel) => {
-        crdtManager.connectChannel(channel)
-      },
-    })
-    realtimeRef.current = connection
-    connection.connect()
-
-    return () => {
-      connection.disconnect()
-      realtimeRef.current = null
-      crdtManager.destroy()
-      crdtRef.current = null
-    }
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [projectId, userId, userDisplayName])
-
-  // Sync local React Flow state changes to CRDT (skip remote-originated updates)
-  const nodesForCRDT = useMemo(() => {
-    return nodes.map((node) => ({
-      id: node.id,
-      type: node.type as 'dialogue' | 'choice' | 'variable',
-      position: node.position,
-      data: node.data,
-    })) as FlowchartNode[]
-  }, [nodes])
-
-  const edgesForCRDT = useMemo(() => {
-    return edges.map((edge) => ({
-      id: edge.id,
-      source: edge.source,
-      sourceHandle: edge.sourceHandle,
-      target: edge.target,
-      targetHandle: edge.targetHandle,
-      data: edge.data,
-    })) as FlowchartEdge[]
-  }, [edges])
-
-  useEffect(() => {
-    if (isRemoteUpdateRef.current) return
-    crdtRef.current?.updateNodes(nodesForCRDT)
-  }, [nodesForCRDT])
-
-  useEffect(() => {
-    if (isRemoteUpdateRef.current) return
-    crdtRef.current?.updateEdges(edgesForCRDT)
-  }, [edgesForCRDT])
 
   const handleAddCharacter = useCallback(
     (name: string, color: string): string => {
@@ -804,19 +1047,6 @@ function FlowchartEditorInner({ projectId, initialData, needsMigration }: Flowch
     [setEdges]
   )
 
-  // Apply warning styles to nodes with undefined references
-  const styledNodes = useMemo(
-    () =>
-      warningNodeIds.size === 0
-        ? nodes
-        : nodes.map((node) =>
-            warningNodeIds.has(node.id)
-              ? { ...node, className: 'export-warning-node' }
-              : node
-          ),
-    [nodes, warningNodeIds]
-  )
-
   // Get the selected edge's condition data
   const selectedEdge = useMemo(
     () => (selectedEdgeId ? edges.find((e) => e.id === selectedEdgeId) : null),
@@ -834,13 +1064,10 @@ function FlowchartEditorInner({ projectId, initialData, needsMigration }: Flowch
           onExport={handleExport}
           onImport={handleImport}
           onProjectSettings={() => setShowSettings(true)}
-          onShare={() => setShowShare(true)}
-          connectionState={connectionState}
-          presenceUsers={presenceUsers}
         />
         <div className="flex-1">
           <ReactFlow
-            nodes={styledNodes}
+            nodes={nodes}
             edges={edges}
             nodeTypes={nodeTypes}
             onNodesChange={onNodesChange}
@@ -867,13 +1094,6 @@ function FlowchartEditorInner({ projectId, initialData, needsMigration }: Flowch
             getVariableUsageCount={getVariableUsageCount}
           />
         )}
-        {showShare && (
-          <ShareModal
-            projectId={projectId}
-            isOwner={isOwner}
-            onClose={() => setShowShare(false)}
-          />
-        )}
         {selectedEdge && (
           <ConditionEditor
             edgeId={selectedEdge.id}
@@ -882,13 +1102,6 @@ function FlowchartEditorInner({ projectId, initialData, needsMigration }: Flowch
             onClose={() => setSelectedEdgeId(null)}
           />
         )}
-        {validationIssues && (
-          <ExportValidationModal
-            issues={validationIssues}
-            onExportAnyway={handleExportAnyway}
-            onCancel={handleExportCancel}
-          />
-        )}
         {toastMessage && (
           <Toast
             message={toastMessage}

src/app/editor/[projectId]/actions.ts

@@ -1,227 +0,0 @@
-'use server'
-
-import { createClient } from '@/lib/supabase/server'
-
-export type Collaborator = {
-  id: string
-  user_id: string
-  role: 'owner' | 'editor' | 'viewer'
-  invited_at: string
-  accepted_at: string | null
-  display_name: string | null
-  email: string | null
-}
-
-export async function getCollaborators(
-  projectId: string
-): Promise<{ success: boolean; data?: Collaborator[]; error?: string }> {
-  const supabase = await createClient()
-  const {
-    data: { user },
-  } = await supabase.auth.getUser()
-
-  if (!user) {
-    return { success: false, error: 'Not authenticated' }
-  }
-
-  // Verify user owns the project
-  const { data: project } = await supabase
-    .from('projects')
-    .select('id, user_id')
-    .eq('id', projectId)
-    .single()
-
-  if (!project) {
-    return { success: false, error: 'Project not found' }
-  }
-
-  const isOwner = project.user_id === user.id
-
-  // Check if user is a collaborator
-  if (!isOwner) {
-    const { data: collab } = await supabase
-      .from('project_collaborators')
-      .select('id')
-      .eq('project_id', projectId)
-      .eq('user_id', user.id)
-      .single()
-
-    if (!collab) {
-      return { success: false, error: 'Access denied' }
-    }
-  }
-
-  // Fetch collaborators with profile info
-  const { data: collaborators, error } = await supabase
-    .from('project_collaborators')
-    .select('id, user_id, role, invited_at, accepted_at, profiles(display_name, email)')
-    .eq('project_id', projectId)
-
-  if (error) {
-    return { success: false, error: error.message }
-  }
-
-  const result: Collaborator[] = (collaborators || []).map((c) => {
-    const profile = c.profiles as unknown as { display_name: string | null; email: string | null } | null
-    return {
-      id: c.id,
-      user_id: c.user_id,
-      role: c.role as 'owner' | 'editor' | 'viewer',
-      invited_at: c.invited_at,
-      accepted_at: c.accepted_at,
-      display_name: profile?.display_name || null,
-      email: profile?.email || null,
-    }
-  })
-
-  return { success: true, data: result }
-}
-
-export async function inviteCollaborator(
-  projectId: string,
-  email: string,
-  role: 'editor' | 'viewer'
-): Promise<{ success: boolean; error?: string }> {
-  const supabase = await createClient()
-  const {
-    data: { user },
-  } = await supabase.auth.getUser()
-
-  if (!user) {
-    return { success: false, error: 'Not authenticated' }
-  }
-
-  // Verify user owns the project
-  const { data: project } = await supabase
-    .from('projects')
-    .select('id, user_id')
-    .eq('id', projectId)
-    .eq('user_id', user.id)
-    .single()
-
-  if (!project) {
-    return { success: false, error: 'Only the project owner can invite collaborators' }
-  }
-
-  // Find the user by email in profiles
-  const { data: targetProfile } = await supabase
-    .from('profiles')
-    .select('id, email')
-    .eq('email', email)
-    .single()
-
-  if (!targetProfile) {
-    return { success: false, error: 'No user found with that email address' }
-  }
-
-  // Cannot invite yourself
-  if (targetProfile.id === user.id) {
-    return { success: false, error: 'You cannot invite yourself' }
-  }
-
-  // Check if already a collaborator
-  const { data: existing } = await supabase
-    .from('project_collaborators')
-    .select('id')
-    .eq('project_id', projectId)
-    .eq('user_id', targetProfile.id)
-    .single()
-
-  if (existing) {
-    return { success: false, error: 'This user is already a collaborator' }
-  }
-
-  // Insert collaborator
-  const { error: insertError } = await supabase
-    .from('project_collaborators')
-    .insert({
-      project_id: projectId,
-      user_id: targetProfile.id,
-      role,
-      invited_at: new Date().toISOString(),
-      accepted_at: new Date().toISOString(), // Auto-accept for now
-    })
-
-  if (insertError) {
-    return { success: false, error: insertError.message }
-  }
-
-  return { success: true }
-}
-
-export async function updateCollaboratorRole(
-  projectId: string,
-  collaboratorId: string,
-  role: 'editor' | 'viewer'
-): Promise<{ success: boolean; error?: string }> {
-  const supabase = await createClient()
-  const {
-    data: { user },
-  } = await supabase.auth.getUser()
-
-  if (!user) {
-    return { success: false, error: 'Not authenticated' }
-  }
-
-  // Verify user owns the project
-  const { data: project } = await supabase
-    .from('projects')
-    .select('id, user_id')
-    .eq('id', projectId)
-    .eq('user_id', user.id)
-    .single()
-
-  if (!project) {
-    return { success: false, error: 'Only the project owner can change roles' }
-  }
-
-  const { error } = await supabase
-    .from('project_collaborators')
-    .update({ role })
-    .eq('id', collaboratorId)
-    .eq('project_id', projectId)
-
-  if (error) {
-    return { success: false, error: error.message }
-  }
-
-  return { success: true }
-}
-
-export async function removeCollaborator(
-  projectId: string,
-  collaboratorId: string
-): Promise<{ success: boolean; error?: string }> {
-  const supabase = await createClient()
-  const {
-    data: { user },
-  } = await supabase.auth.getUser()
-
-  if (!user) {
-    return { success: false, error: 'Not authenticated' }
-  }
-
-  // Verify user owns the project
-  const { data: project } = await supabase
-    .from('projects')
-    .select('id, user_id')
-    .eq('id', projectId)
-    .eq('user_id', user.id)
-    .single()
-
-  if (!project) {
-    return { success: false, error: 'Only the project owner can remove collaborators' }
-  }
-
-  const { error } = await supabase
-    .from('project_collaborators')
-    .delete()
-    .eq('id', collaboratorId)
-    .eq('project_id', projectId)
-
-  if (error) {
-    return { success: false, error: error.message }
-  }
-
-  return { success: true }
-}

src/app/editor/[projectId]/page.tsx

@@ -19,52 +19,15 @@ export default async function EditorPage({ params }: PageProps) {
     return null
   }
 
-  // Fetch user's display name for presence
+  const { data: project, error } = await supabase
-  const { data: profile } = await supabase
-    .from('profiles')
-    .select('display_name')
-    .eq('id', user.id)
-    .single()
-
-  const userDisplayName = profile?.display_name || user.email || 'Anonymous'
-
-  // Try to load as owner first
-  const { data: ownedProject } = await supabase
     .from('projects')
     .select('id, name, flowchart_data')
     .eq('id', projectId)
     .eq('user_id', user.id)
     .single()
 
-  let project = ownedProject
+  if (error || !project) {
-  let isOwner = true
+    notFound()
-
-  // If not the owner, check if the user is a collaborator
-  if (!project) {
-    // RLS on projects allows collaborators to SELECT shared projects
-    const { data: collab } = await supabase
-      .from('project_collaborators')
-      .select('id, role')
-      .eq('project_id', projectId)
-      .eq('user_id', user.id)
-      .single()
-
-    if (!collab) {
-      notFound()
-    }
-
-    const { data: sharedProject } = await supabase
-      .from('projects')
-      .select('id, name, flowchart_data')
-      .eq('id', projectId)
-      .single()
-
-    if (!sharedProject) {
-      notFound()
-    }
-
-    project = sharedProject
-    isOwner = false
   }
 
   const rawData = project.flowchart_data || {}
@@ -79,7 +42,7 @@ export default async function EditorPage({ params }: PageProps) {
   // the project was created before these features existed and may need auto-migration
   const needsMigration = !rawData.characters && !rawData.variables
 
-  return (<>
+  return (
     <div className="flex h-screen flex-col">
       <header className="flex items-center justify-between border-b border-zinc-200 bg-white px-4 py-3 dark:border-zinc-700 dark:bg-zinc-900">
         <div className="flex items-center gap-4">
@@ -136,14 +99,10 @@ export default async function EditorPage({ params }: PageProps) {
       <div className="flex-1">
         <FlowchartEditor
           projectId={project.id}
-          userId={user.id}
-          userDisplayName={userDisplayName}
-          isOwner={isOwner}
           initialData={flowchartData}
           needsMigration={needsMigration}
         />
       </div>
-    </>
     )
   }
 

src/app/globals.css

@@ -24,16 +24,3 @@ body {
   color: var(--foreground);
   font-family: Arial, Helvetica, sans-serif;
 }
-
-/* Export validation warning highlighting for React Flow nodes */
-.react-flow__node.export-warning-node {
-  outline: 3px solid #f97316;
-  outline-offset: 2px;
-  border-radius: 6px;
-  animation: pulse-warning 1.5s ease-in-out infinite;
-}
-
-@keyframes pulse-warning {
-  0%, 100% { outline-color: #f97316; }
-  50% { outline-color: #fb923c; }
-}

src/components/ProjectCard.tsx

@@ -8,10 +8,8 @@ interface ProjectCardProps {
   id: string
   name: string
   updatedAt: string
-  onDelete?: (id: string) => void
+  onDelete: (id: string) => void
-  onRename?: (id: string, newName: string) => void
+  onRename: (id: string, newName: string) => void
-  shared?: boolean
-  sharedRole?: string
 }
 
 function formatDate(dateString: string): string {
@@ -31,8 +29,6 @@ export default function ProjectCard({
   updatedAt,
   onDelete,
   onRename,
-  shared,
-  sharedRole,
 }: ProjectCardProps) {
   const [showDeleteDialog, setShowDeleteDialog] = useState(false)
   const [isDeleting, setIsDeleting] = useState(false)
@@ -66,7 +62,7 @@ export default function ProjectCard({
 
     setIsDeleting(false)
     setShowDeleteDialog(false)
-    onDelete?.(id)
+    onDelete(id)
   }
 
   const handleCancelDelete = () => {
@@ -110,7 +106,7 @@ export default function ProjectCard({
 
     setIsRenaming(false)
     setShowRenameDialog(false)
-    onRename?.(id, newName.trim())
+    onRename(id, newName.trim())
   }
 
   const handleCancelRename = () => {
@@ -126,55 +122,46 @@ export default function ProjectCard({
         onClick={handleCardClick}
         className="group relative cursor-pointer rounded-lg border border-zinc-200 bg-white p-6 transition-all hover:border-blue-300 hover:shadow-md dark:border-zinc-700 dark:bg-zinc-800 dark:hover:border-blue-600"
       >
-        {!shared && onRename && onDelete && (
+        <div className="absolute right-3 top-3 flex gap-1 opacity-0 transition-opacity group-hover:opacity-100">
-          <div className="absolute right-3 top-3 flex gap-1 opacity-0 transition-opacity group-hover:opacity-100">
+          <button
-            <button
+            onClick={handleRenameClick}
-              onClick={handleRenameClick}
+            className="rounded p-1 text-zinc-400 hover:bg-blue-100 hover:text-blue-600 dark:hover:bg-blue-900/30 dark:hover:text-blue-400"
-              className="rounded p-1 text-zinc-400 hover:bg-blue-100 hover:text-blue-600 dark:hover:bg-blue-900/30 dark:hover:text-blue-400"
+            title="Rename project"
-              title="Rename project"
+          >
+            <svg
+              className="h-5 w-5"
+              fill="none"
+              viewBox="0 0 24 24"
+              stroke="currentColor"
             >
-              <svg
+              <path
-                className="h-5 w-5"
+                strokeLinecap="round"
-                fill="none"
+                strokeLinejoin="round"
-                viewBox="0 0 24 24"
+                strokeWidth={2}
-                stroke="currentColor"
+                d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
-              >
+              />
-                <path
+            </svg>
-                  strokeLinecap="round"
+          </button>
-                  strokeLinejoin="round"
+          <button
-                  strokeWidth={2}
+            onClick={handleDeleteClick}
-                  d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
+            className="rounded p-1 text-zinc-400 hover:bg-red-100 hover:text-red-600 dark:hover:bg-red-900/30 dark:hover:text-red-400"
-                />
+            title="Delete project"
-              </svg>
+          >
-            </button>
+            <svg
-            <button
+              className="h-5 w-5"
-              onClick={handleDeleteClick}
+              fill="none"
-              className="rounded p-1 text-zinc-400 hover:bg-red-100 hover:text-red-600 dark:hover:bg-red-900/30 dark:hover:text-red-400"
+              viewBox="0 0 24 24"
-              title="Delete project"
+              stroke="currentColor"
             >
-              <svg
+              <path
-                className="h-5 w-5"
+                strokeLinecap="round"
-                fill="none"
+                strokeLinejoin="round"
-                viewBox="0 0 24 24"
+                strokeWidth={2}
-                stroke="currentColor"
+                d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
-              >
+              />
-                <path
+            </svg>
-                  strokeLinecap="round"
+          </button>
-                  strokeLinejoin="round"
+        </div>
-                  strokeWidth={2}
-                  d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
-                />
-              </svg>
-            </button>
-          </div>
-        )}
-        {shared && (
-          <div className="absolute right-3 top-3">
-            <span className="rounded-full bg-blue-100 px-2 py-0.5 text-xs font-medium text-blue-700 dark:bg-blue-900/30 dark:text-blue-400">
-              {sharedRole === 'editor' ? 'Editor' : 'Viewer'}
-            </span>
-          </div>
-        )}
         <h2 className="pr-8 text-lg font-semibold text-zinc-900 group-hover:text-blue-600 dark:text-zinc-50 dark:group-hover:text-blue-400">
           {name}
         </h2>

src/components/editor/ExportValidationModal.tsx

@@ -1,131 +0,0 @@
-'use client'
-
-export type ValidationIssue = {
-  nodeId: string
-  nodeType: 'dialogue' | 'choice' | 'variable' | 'edge'
-  contentSnippet: string
-  undefinedReference: string
-  referenceType: 'character' | 'variable'
-}
-
-type ExportValidationModalProps = {
-  issues: ValidationIssue[]
-  onExportAnyway: () => void
-  onCancel: () => void
-}
-
-export default function ExportValidationModal({
-  issues,
-  onExportAnyway,
-  onCancel,
-}: ExportValidationModalProps) {
-  const characterIssues = issues.filter((i) => i.referenceType === 'character')
-  const variableIssues = issues.filter((i) => i.referenceType === 'variable')
-
-  return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
-      <div className="mx-4 w-full max-w-lg rounded-lg bg-white shadow-xl dark:bg-zinc-800">
-        <div className="border-b border-zinc-200 px-6 py-4 dark:border-zinc-700">
-          <div className="flex items-center gap-2">
-            <svg
-              className="h-5 w-5 text-orange-500"
-              fill="none"
-              viewBox="0 0 24 24"
-              stroke="currentColor"
-            >
-              <path
-                strokeLinecap="round"
-                strokeLinejoin="round"
-                strokeWidth={2}
-                d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L4.082 16.5c-.77.833.192 2.5 1.732 2.5z"
-              />
-            </svg>
-            <h2 className="text-lg font-semibold text-zinc-900 dark:text-zinc-100">
-              Export Validation Issues
-            </h2>
-          </div>
-          <p className="mt-1 text-sm text-zinc-500 dark:text-zinc-400">
-            {issues.length} undefined reference{issues.length !== 1 ? 's' : ''} found. These nodes/edges reference characters or variables that no longer exist.
-          </p>
-        </div>
-
-        <div className="max-h-[50vh] overflow-y-auto px-6 py-4">
-          {characterIssues.length > 0 && (
-            <div className="mb-4">
-              <h3 className="mb-2 text-sm font-medium text-zinc-700 dark:text-zinc-300">
-                Undefined Characters
-              </h3>
-              <ul className="space-y-2">
-                {characterIssues.map((issue, idx) => (
-                  <li
-                    key={`char-${idx}`}
-                    className="rounded border border-orange-200 bg-orange-50 p-3 dark:border-orange-800 dark:bg-orange-950"
-                  >
-                    <div className="flex items-start justify-between gap-2">
-                      <div className="min-w-0">
-                        <span className="inline-block rounded bg-blue-100 px-1.5 py-0.5 text-xs font-medium text-blue-700 dark:bg-blue-900 dark:text-blue-300">
-                          {issue.nodeType}
-                        </span>
-                        <p className="mt-1 truncate text-sm text-zinc-700 dark:text-zinc-300">
-                          {issue.contentSnippet}
-                        </p>
-                      </div>
-                      <span className="shrink-0 text-xs text-orange-600 dark:text-orange-400">
-                        ID: {issue.undefinedReference.slice(0, 8)}...
-                      </span>
-                    </div>
-                  </li>
-                ))}
-              </ul>
-            </div>
-          )}
-
-          {variableIssues.length > 0 && (
-            <div>
-              <h3 className="mb-2 text-sm font-medium text-zinc-700 dark:text-zinc-300">
-                Undefined Variables
-              </h3>
-              <ul className="space-y-2">
-                {variableIssues.map((issue, idx) => (
-                  <li
-                    key={`var-${idx}`}
-                    className="rounded border border-orange-200 bg-orange-50 p-3 dark:border-orange-800 dark:bg-orange-950"
-                  >
-                    <div className="flex items-start justify-between gap-2">
-                      <div className="min-w-0">
-                        <span className="inline-block rounded bg-blue-100 px-1.5 py-0.5 text-xs font-medium text-blue-700 dark:bg-blue-900 dark:text-blue-300">
-                          {issue.nodeType}
-                        </span>
-                        <p className="mt-1 truncate text-sm text-zinc-700 dark:text-zinc-300">
-                          {issue.contentSnippet}
-                        </p>
-                      </div>
-                      <span className="shrink-0 text-xs text-orange-600 dark:text-orange-400">
-                        ID: {issue.undefinedReference.slice(0, 8)}...
-                      </span>
-                    </div>
-                  </li>
-                ))}
-              </ul>
-            </div>
-          )}
-        </div>
-
-        <div className="flex justify-end gap-3 border-t border-zinc-200 px-6 py-4 dark:border-zinc-700">
-          <button
-            onClick={onCancel}
-            className="rounded border border-zinc-300 bg-white px-4 py-2 text-sm font-medium text-zinc-700 hover:bg-zinc-50 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:border-zinc-600 dark:bg-zinc-700 dark:text-zinc-200 dark:hover:bg-zinc-600 dark:focus:ring-offset-zinc-800"
-          >
-            Cancel
-          </button>
-          <button
-            onClick={onExportAnyway}
-            className="rounded bg-orange-500 px-4 py-2 text-sm font-medium text-white hover:bg-orange-600 focus:outline-none focus:ring-2 focus:ring-orange-500 focus:ring-offset-2 dark:focus:ring-offset-zinc-800"
-          >
-            Export anyway
-          </button>
-        </div>
-      </div>
-    </div>
-  )
-}

src/components/editor/PresenceAvatars.tsx

@@ -1,65 +0,0 @@
-'use client'
-
-import type { PresenceUser } from '@/lib/collaboration/realtime'
-
-type PresenceAvatarsProps = {
-  users: PresenceUser[]
-}
-
-const MAX_VISIBLE = 5
-
-// Generate a consistent color from a user ID hash
-function getUserColor(userId: string): string {
-  let hash = 0
-  for (let i = 0; i < userId.length; i++) {
-    hash = ((hash << 5) - hash + userId.charCodeAt(i)) | 0
-  }
-  const colors = [
-    '#EF4444', '#F97316', '#F59E0B', '#10B981',
-    '#3B82F6', '#8B5CF6', '#EC4899', '#14B8A6',
-    '#6366F1', '#F43F5E', '#84CC16', '#06B6D4',
-  ]
-  return colors[Math.abs(hash) % colors.length]
-}
-
-// Get initials from a display name (first letter of first two words)
-function getInitials(displayName: string): string {
-  const parts = displayName.trim().split(/\s+/)
-  if (parts.length >= 2) {
-    return (parts[0][0] + parts[1][0]).toUpperCase()
-  }
-  return displayName.slice(0, 2).toUpperCase()
-}
-
-export default function PresenceAvatars({ users }: PresenceAvatarsProps) {
-  if (users.length === 0) return null
-
-  const visibleUsers = users.slice(0, MAX_VISIBLE)
-  const overflow = users.length - MAX_VISIBLE
-
-  return (
-    <div className="flex items-center -space-x-2">
-      {visibleUsers.map((user) => {
-        const color = getUserColor(user.userId)
-        return (
-          <div
-            key={user.userId}
-            title={user.displayName}
-            className="relative flex h-7 w-7 items-center justify-center rounded-full border-2 border-white text-[10px] font-semibold text-white dark:border-zinc-800"
-            style={{ backgroundColor: color }}
-          >
-            {getInitials(user.displayName)}
-          </div>
-        )
-      })}
-      {overflow > 0 && (
-        <div
-          className="relative flex h-7 w-7 items-center justify-center rounded-full border-2 border-white bg-zinc-400 text-[10px] font-semibold text-white dark:border-zinc-800 dark:bg-zinc-500"
-          title={`${overflow} more collaborator${overflow > 1 ? 's' : ''}`}
-        >
-          +{overflow}
-        </div>
-      )}
-    </div>
-  )
-}

src/components/editor/ShareModal.tsx

@@ -1,224 +0,0 @@
-'use client'
-
-import { useState, useEffect, useCallback } from 'react'
-import {
-  getCollaborators,
-  inviteCollaborator,
-  updateCollaboratorRole,
-  removeCollaborator,
-  type Collaborator,
-} from '@/app/editor/[projectId]/actions'
-
-type ShareModalProps = {
-  projectId: string
-  isOwner: boolean
-  onClose: () => void
-}
-
-export default function ShareModal({ projectId, isOwner, onClose }: ShareModalProps) {
-  const [collaborators, setCollaborators] = useState<Collaborator[]>([])
-  const [loading, setLoading] = useState(true)
-  const [email, setEmail] = useState('')
-  const [role, setRole] = useState<'editor' | 'viewer'>('editor')
-  const [inviting, setInviting] = useState(false)
-  const [error, setError] = useState<string | null>(null)
-  const [successMessage, setSuccessMessage] = useState<string | null>(null)
-
-  const fetchCollaborators = useCallback(async () => {
-    const result = await getCollaborators(projectId)
-    if (result.success && result.data) {
-      setCollaborators(result.data)
-    }
-    setLoading(false)
-  }, [projectId])
-
-  useEffect(() => {
-    fetchCollaborators()
-  }, [fetchCollaborators])
-
-  const handleInvite = async (e: React.FormEvent) => {
-    e.preventDefault()
-    if (!email.trim()) return
-
-    setInviting(true)
-    setError(null)
-    setSuccessMessage(null)
-
-    const result = await inviteCollaborator(projectId, email.trim(), role)
-    if (result.success) {
-      setEmail('')
-      setSuccessMessage('Collaborator invited successfully')
-      fetchCollaborators()
-    } else {
-      setError(result.error || 'Failed to invite collaborator')
-    }
-    setInviting(false)
-  }
-
-  const handleRoleChange = async (collaboratorId: string, newRole: 'editor' | 'viewer') => {
-    setError(null)
-    const result = await updateCollaboratorRole(projectId, collaboratorId, newRole)
-    if (result.success) {
-      setCollaborators((prev) =>
-        prev.map((c) => (c.id === collaboratorId ? { ...c, role: newRole } : c))
-      )
-    } else {
-      setError(result.error || 'Failed to update role')
-    }
-  }
-
-  const handleRemove = async (collaboratorId: string) => {
-    setError(null)
-    const result = await removeCollaborator(projectId, collaboratorId)
-    if (result.success) {
-      setCollaborators((prev) => prev.filter((c) => c.id !== collaboratorId))
-    } else {
-      setError(result.error || 'Failed to remove collaborator')
-    }
-  }
-
-  return (
-    <div className="fixed inset-0 z-50 flex items-center justify-center">
-      <div
-        className="absolute inset-0 bg-black/50"
-        onClick={onClose}
-        aria-hidden="true"
-      />
-      <div className="relative w-full max-w-lg rounded-lg bg-white p-6 shadow-xl dark:bg-zinc-800">
-        <div className="flex items-center justify-between mb-4">
-          <h2 className="text-lg font-semibold text-zinc-900 dark:text-zinc-50">
-            Share Project
-          </h2>
-          <button
-            onClick={onClose}
-            className="rounded p-1 text-zinc-400 hover:text-zinc-600 dark:hover:text-zinc-200"
-          >
-            <svg className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
-            </svg>
-          </button>
-        </div>
-
-        {/* Invite Form - only for owners */}
-        {isOwner && (
-          <form onSubmit={handleInvite} className="mb-6">
-            <label className="block text-sm font-medium text-zinc-700 dark:text-zinc-300 mb-2">
-              Invite collaborator by email
-            </label>
-            <div className="flex gap-2">
-              <input
-                type="email"
-                value={email}
-                onChange={(e) => setEmail(e.target.value)}
-                placeholder="user@example.com"
-                disabled={inviting}
-                className="flex-1 rounded-md border border-zinc-300 bg-white px-3 py-2 text-sm text-zinc-900 placeholder-zinc-400 focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500 disabled:opacity-50 dark:border-zinc-600 dark:bg-zinc-700 dark:text-zinc-50 dark:placeholder-zinc-500"
-              />
-              <select
-                value={role}
-                onChange={(e) => setRole(e.target.value as 'editor' | 'viewer')}
-                disabled={inviting}
-                className="rounded-md border border-zinc-300 bg-white px-3 py-2 text-sm text-zinc-900 focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500 disabled:opacity-50 dark:border-zinc-600 dark:bg-zinc-700 dark:text-zinc-50"
-              >
-                <option value="editor">Editor</option>
-                <option value="viewer">Viewer</option>
-              </select>
-              <button
-                type="submit"
-                disabled={inviting || !email.trim()}
-                className="rounded-md bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 disabled:opacity-50 dark:focus:ring-offset-zinc-800"
-              >
-                {inviting ? 'Inviting...' : 'Invite'}
-              </button>
-            </div>
-          </form>
-        )}
-
-        {/* Messages */}
-        {error && (
-          <div className="mb-4 rounded-md bg-red-50 p-3 text-sm text-red-700 dark:bg-red-900/20 dark:text-red-400">
-            {error}
-          </div>
-        )}
-        {successMessage && (
-          <div className="mb-4 rounded-md bg-green-50 p-3 text-sm text-green-700 dark:bg-green-900/20 dark:text-green-400">
-            {successMessage}
-          </div>
-        )}
-
-        {/* Collaborators List */}
-        <div>
-          <h3 className="text-sm font-medium text-zinc-700 dark:text-zinc-300 mb-3">
-            Collaborators
-          </h3>
-          {loading ? (
-            <p className="text-sm text-zinc-500 dark:text-zinc-400">Loading...</p>
-          ) : collaborators.length === 0 ? (
-            <p className="text-sm text-zinc-500 dark:text-zinc-400">
-              No collaborators yet. Invite someone to get started.
-            </p>
-          ) : (
-            <div className="space-y-2 max-h-64 overflow-y-auto">
-              {collaborators.map((collab) => (
-                <div
-                  key={collab.id}
-                  className="flex items-center justify-between rounded-md border border-zinc-200 p-3 dark:border-zinc-700"
-                >
-                  <div className="flex-1 min-w-0">
-                    <p className="text-sm font-medium text-zinc-900 truncate dark:text-zinc-50">
-                      {collab.display_name || collab.email || 'Unknown user'}
-                    </p>
-                    {collab.display_name && collab.email && (
-                      <p className="text-xs text-zinc-500 truncate dark:text-zinc-400">
-                        {collab.email}
-                      </p>
-                    )}
-                  </div>
-                  <div className="flex items-center gap-2 ml-3">
-                    {isOwner ? (
-                      <>
-                        <select
-                          value={collab.role}
-                          onChange={(e) =>
-                            handleRoleChange(collab.id, e.target.value as 'editor' | 'viewer')
-                          }
-                          className="rounded border border-zinc-300 bg-white px-2 py-1 text-xs text-zinc-700 focus:border-blue-500 focus:outline-none dark:border-zinc-600 dark:bg-zinc-700 dark:text-zinc-300"
-                        >
-                          <option value="editor">Editor</option>
-                          <option value="viewer">Viewer</option>
-                        </select>
-                        <button
-                          onClick={() => handleRemove(collab.id)}
-                          className="rounded p-1 text-zinc-400 hover:text-red-600 dark:hover:text-red-400"
-                          title="Remove collaborator"
-                        >
-                          <svg className="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
-                          </svg>
-                        </button>
-                      </>
-                    ) : (
-                      <span className="rounded bg-zinc-100 px-2 py-0.5 text-xs font-medium text-zinc-600 dark:bg-zinc-700 dark:text-zinc-400">
-                        {collab.role}
-                      </span>
-                    )}
-                  </div>
-                </div>
-              ))}
-            </div>
-          )}
-        </div>
-
-        {/* Close button */}
-        <div className="mt-6 flex justify-end">
-          <button
-            onClick={onClose}
-            className="rounded-md border border-zinc-300 bg-white px-4 py-2 text-sm font-medium text-zinc-700 hover:bg-zinc-50 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:border-zinc-600 dark:bg-zinc-700 dark:text-zinc-300 dark:hover:bg-zinc-600 dark:focus:ring-offset-zinc-800"
-          >
-            Close
-          </button>
-        </div>
-      </div>
-    </div>
-  )
-}

src/components/editor/Toolbar.tsx

@@ -1,8 +1,5 @@
 'use client'
 
-import type { ConnectionState, PresenceUser } from '@/lib/collaboration/realtime'
-import PresenceAvatars from './PresenceAvatars'
-
 type ToolbarProps = {
   onAddDialogue: () => void
   onAddChoice: () => void
@@ -12,23 +9,6 @@ type ToolbarProps = {
   onExportRenpy: () => void
   onImport: () => void
   onProjectSettings: () => void
-  onShare: () => void
-  connectionState?: ConnectionState
-  presenceUsers?: PresenceUser[]
-}
-
-const connectionLabel: Record<ConnectionState, string> = {
-  connecting: 'Connecting…',
-  connected: 'Connected',
-  disconnected: 'Disconnected',
-  reconnecting: 'Reconnecting…',
-}
-
-const connectionColor: Record<ConnectionState, string> = {
-  connecting: 'bg-yellow-400',
-  connected: 'bg-green-400',
-  disconnected: 'bg-red-400',
-  reconnecting: 'bg-yellow-400',
 }
 
 export default function Toolbar({
@@ -40,9 +20,6 @@ export default function Toolbar({
   onExportRenpy,
   onImport,
   onProjectSettings,
-  onShare,
-  connectionState,
-  presenceUsers,
 }: ToolbarProps) {
   return (
     <div className="flex items-center justify-between border-b border-zinc-200 bg-zinc-50 px-4 py-2 dark:border-zinc-700 dark:bg-zinc-800">
@@ -71,31 +48,12 @@ export default function Toolbar({
       </div>
 
       <div className="flex items-center gap-2">
-        {presenceUsers && presenceUsers.length > 0 && (
-          <div className="mr-2">
-            <PresenceAvatars users={presenceUsers} />
-          </div>
-        )}
-        {connectionState && (
-          <div className="flex items-center gap-1.5 mr-2" title={connectionLabel[connectionState]}>
-            <span className={`inline-block h-2.5 w-2.5 rounded-full ${connectionColor[connectionState]}${connectionState === 'reconnecting' ? ' animate-pulse' : ''}`} />
-            <span className="text-xs text-zinc-500 dark:text-zinc-400">
-              {connectionLabel[connectionState]}
-            </span>
-          </div>
-        )}
         <button
           onClick={onProjectSettings}
           className="rounded border border-zinc-300 bg-white px-3 py-1.5 text-sm font-medium text-zinc-700 hover:bg-zinc-50 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:border-zinc-600 dark:bg-zinc-700 dark:text-zinc-200 dark:hover:bg-zinc-600 dark:focus:ring-offset-zinc-800"
         >
           Project Settings
         </button>
-        <button
-          onClick={onShare}
-          className="rounded border border-zinc-300 bg-white px-3 py-1.5 text-sm font-medium text-zinc-700 hover:bg-zinc-50 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 dark:border-zinc-600 dark:bg-zinc-700 dark:text-zinc-200 dark:hover:bg-zinc-600 dark:focus:ring-offset-zinc-800"
-        >
-          Share
-        </button>
         <button
           onClick={onSave}
           disabled={isSaving}

src/lib/collaboration/crdt.ts

@@ -1,198 +0,0 @@
-import * as Y from 'yjs'
-import type { RealtimeChannel } from '@supabase/supabase-js'
-import type { FlowchartNode, FlowchartEdge } from '@/types/flowchart'
-
-const PERSIST_DEBOUNCE_MS = 2000
-const BROADCAST_EVENT = 'yjs-update'
-
-export type CRDTCallbacks = {
-  onNodesChange: (nodes: FlowchartNode[]) => void
-  onEdgesChange: (edges: FlowchartEdge[]) => void
-  onPersist: (nodes: FlowchartNode[], edges: FlowchartEdge[]) => void
-}
-
-export class CRDTManager {
-  private doc: Y.Doc
-  private nodesMap: Y.Map<string> // node ID -> JSON string of FlowchartNode
-  private edgesMap: Y.Map<string> // edge ID -> JSON string of FlowchartEdge
-  private channel: RealtimeChannel | null = null
-  private callbacks: CRDTCallbacks
-  private persistTimer: ReturnType<typeof setTimeout> | null = null
-  private isApplyingRemote = false
-  private isDestroyed = false
-
-  constructor(callbacks: CRDTCallbacks) {
-    this.doc = new Y.Doc()
-    this.nodesMap = this.doc.getMap('nodes')
-    this.edgesMap = this.doc.getMap('edges')
-    this.callbacks = callbacks
-
-    // Listen for remote Yjs document changes
-    this.nodesMap.observe(() => {
-      if (this.isApplyingRemote) return
-      this.notifyNodesChange()
-      this.schedulePersist()
-    })
-
-    this.edgesMap.observe(() => {
-      if (this.isApplyingRemote) return
-      this.notifyEdgesChange()
-      this.schedulePersist()
-    })
-
-    // Broadcast local updates to other clients
-    this.doc.on('update', (update: Uint8Array, origin: unknown) => {
-      if (origin === 'remote') return // Don't re-broadcast remote updates
-      this.broadcastUpdate(update)
-    })
-  }
-
-  /** Initialize the Yjs document from database state */
-  initializeFromData(nodes: FlowchartNode[], edges: FlowchartEdge[]): void {
-    this.doc.transact(() => {
-      nodes.forEach((node) => {
-        this.nodesMap.set(node.id, JSON.stringify(node))
-      })
-      edges.forEach((edge) => {
-        this.edgesMap.set(edge.id, JSON.stringify(edge))
-      })
-    }, 'init')
-  }
-
-  /** Connect to a Supabase Realtime channel for syncing updates */
-  connectChannel(channel: RealtimeChannel): void {
-    this.channel = channel
-
-    // Listen for broadcast updates from other clients
-    channel.on('broadcast', { event: BROADCAST_EVENT }, (payload) => {
-      if (this.isDestroyed) return
-      const data = payload.payload as { update?: number[] } | undefined
-      if (data?.update) {
-        const update = new Uint8Array(data.update)
-        this.isApplyingRemote = true
-        Y.applyUpdate(this.doc, update, 'remote')
-        this.isApplyingRemote = false
-        // Notify React state of remote changes
-        this.notifyNodesChange()
-        this.notifyEdgesChange()
-        this.schedulePersist()
-      }
-    })
-  }
-
-  /** Apply local node changes to the Yjs document */
-  updateNodes(nodes: FlowchartNode[]): void {
-    if (this.isApplyingRemote) return
-
-    this.doc.transact(() => {
-      const currentIds = new Set(nodes.map((n) => n.id))
-
-      // Remove nodes no longer present
-      const existingIds = Array.from(this.nodesMap.keys())
-      existingIds.forEach((id) => {
-        if (!currentIds.has(id)) {
-          this.nodesMap.delete(id)
-        }
-      })
-
-      // Add or update nodes
-      nodes.forEach((node) => {
-        const serialized = JSON.stringify(node)
-        const existing = this.nodesMap.get(node.id)
-        if (existing !== serialized) {
-          this.nodesMap.set(node.id, serialized)
-        }
-      })
-    }, 'local')
-  }
-
-  /** Apply local edge changes to the Yjs document */
-  updateEdges(edges: FlowchartEdge[]): void {
-    if (this.isApplyingRemote) return
-
-    this.doc.transact(() => {
-      const currentIds = new Set(edges.map((e) => e.id))
-
-      // Remove edges no longer present
-      const existingIds = Array.from(this.edgesMap.keys())
-      existingIds.forEach((id) => {
-        if (!currentIds.has(id)) {
-          this.edgesMap.delete(id)
-        }
-      })
-
-      // Add or update edges
-      edges.forEach((edge) => {
-        const serialized = JSON.stringify(edge)
-        const existing = this.edgesMap.get(edge.id)
-        if (existing !== serialized) {
-          this.edgesMap.set(edge.id, serialized)
-        }
-      })
-    }, 'local')
-  }
-
-  /** Get current nodes from the Yjs document */
-  getNodes(): FlowchartNode[] {
-    const nodes: FlowchartNode[] = []
-    this.nodesMap.forEach((value) => {
-      try {
-        nodes.push(JSON.parse(value) as FlowchartNode)
-      } catch {
-        // Skip malformed entries
-      }
-    })
-    return nodes
-  }
-
-  /** Get current edges from the Yjs document */
-  getEdges(): FlowchartEdge[] {
-    const edges: FlowchartEdge[] = []
-    this.edgesMap.forEach((value) => {
-      try {
-        edges.push(JSON.parse(value) as FlowchartEdge)
-      } catch {
-        // Skip malformed entries
-      }
-    })
-    return edges
-  }
-
-  /** Clean up resources */
-  destroy(): void {
-    this.isDestroyed = true
-    if (this.persistTimer) {
-      clearTimeout(this.persistTimer)
-      this.persistTimer = null
-    }
-    this.doc.destroy()
-    this.channel = null
-  }
-
-  private notifyNodesChange(): void {
-    this.callbacks.onNodesChange(this.getNodes())
-  }
-
-  private notifyEdgesChange(): void {
-    this.callbacks.onEdgesChange(this.getEdges())
-  }
-
-  private broadcastUpdate(update: Uint8Array): void {
-    if (!this.channel || this.isDestroyed) return
-    this.channel.send({
-      type: 'broadcast',
-      event: BROADCAST_EVENT,
-      payload: { update: Array.from(update) },
-    })
-  }
-
-  private schedulePersist(): void {
-    if (this.persistTimer) {
-      clearTimeout(this.persistTimer)
-    }
-    this.persistTimer = setTimeout(() => {
-      if (this.isDestroyed) return
-      this.callbacks.onPersist(this.getNodes(), this.getEdges())
-    }, PERSIST_DEBOUNCE_MS)
-  }
-}

src/lib/collaboration/realtime.ts

@@ -1,195 +0,0 @@
-import { createClient } from '@/lib/supabase/client'
-import type { RealtimeChannel } from '@supabase/supabase-js'
-
-export type ConnectionState = 'connecting' | 'connected' | 'disconnected' | 'reconnecting'
-
-export type PresenceUser = {
-  userId: string
-  displayName: string
-}
-
-type RealtimeCallbacks = {
-  onConnectionStateChange: (state: ConnectionState) => void
-  onPresenceSync?: (users: PresenceUser[]) => void
-  onChannelSubscribed?: (channel: RealtimeChannel) => void
-}
-
-const HEARTBEAT_INTERVAL_MS = 30_000
-const RECONNECT_BASE_DELAY_MS = 1000
-const RECONNECT_MAX_DELAY_MS = 30_000
-
-export class RealtimeConnection {
-  private channel: RealtimeChannel | null = null
-  private heartbeatTimer: ReturnType<typeof setInterval> | null = null
-  private reconnectTimer: ReturnType<typeof setTimeout> | null = null
-  private reconnectAttempts = 0
-  private projectId: string
-  private userId: string
-  private displayName: string
-  private callbacks: RealtimeCallbacks
-  private isDestroyed = false
-  private supabase = createClient()
-
-  constructor(projectId: string, userId: string, displayName: string, callbacks: RealtimeCallbacks) {
-    this.projectId = projectId
-    this.userId = userId
-    this.displayName = displayName
-    this.callbacks = callbacks
-  }
-
-  async connect(): Promise<void> {
-    if (this.isDestroyed) return
-    this.callbacks.onConnectionStateChange('connecting')
-
-    this.channel = this.supabase.channel(`project:${this.projectId}`, {
-      config: { presence: { key: this.userId } },
-    })
-
-    this.channel
-      .on('presence', { event: 'sync' }, () => {
-        if (this.channel) {
-          const state = this.channel.presenceState()
-          const users: PresenceUser[] = []
-          for (const [key, presences] of Object.entries(state)) {
-            if (key === this.userId) continue // Exclude own presence
-            const presence = presences[0] as { userId?: string; displayName?: string } | undefined
-            if (presence?.userId) {
-              users.push({
-                userId: presence.userId,
-                displayName: presence.displayName || 'Anonymous',
-              })
-            }
-          }
-          this.callbacks.onPresenceSync?.(users)
-        }
-      })
-      .subscribe(async (status) => {
-        if (this.isDestroyed) return
-
-        if (status === 'SUBSCRIBED') {
-          this.reconnectAttempts = 0
-          this.callbacks.onConnectionStateChange('connected')
-          this.startHeartbeat()
-          await this.createSession()
-          // Track presence with user info
-          await this.channel?.track({
-            userId: this.userId,
-            displayName: this.displayName,
-          })
-          // Notify that the channel is ready for CRDT sync
-          if (this.channel) {
-            this.callbacks.onChannelSubscribed?.(this.channel)
-          }
-        } else if (status === 'CHANNEL_ERROR' || status === 'TIMED_OUT') {
-          this.callbacks.onConnectionStateChange('reconnecting')
-          this.scheduleReconnect()
-        } else if (status === 'CLOSED') {
-          this.callbacks.onConnectionStateChange('disconnected')
-        }
-      })
-  }
-
-  async disconnect(): Promise<void> {
-    this.isDestroyed = true
-    this.stopHeartbeat()
-    this.clearReconnectTimer()
-
-    if (this.channel) {
-      await this.deleteSession()
-      this.supabase.removeChannel(this.channel)
-      this.channel = null
-    }
-
-    this.callbacks.onConnectionStateChange('disconnected')
-  }
-
-  getChannel(): RealtimeChannel | null {
-    return this.channel
-  }
-
-  private async createSession(): Promise<void> {
-    try {
-      await this.supabase.from('collaboration_sessions').upsert(
-        {
-          project_id: this.projectId,
-          user_id: this.userId,
-          cursor_position: null,
-          selected_node_id: null,
-          connected_at: new Date().toISOString(),
-          last_heartbeat: new Date().toISOString(),
-        },
-        { onConflict: 'project_id,user_id' }
-      )
-    } catch {
-      // Fire-and-forget: session creation failure shouldn't block editing
-    }
-  }
-
-  private async deleteSession(): Promise<void> {
-    try {
-      await this.supabase
-        .from('collaboration_sessions')
-        .delete()
-        .eq('project_id', this.projectId)
-        .eq('user_id', this.userId)
-    } catch {
-      // Fire-and-forget: cleanup failure is non-critical
-    }
-  }
-
-  private startHeartbeat(): void {
-    this.stopHeartbeat()
-    this.heartbeatTimer = setInterval(async () => {
-      if (this.isDestroyed) {
-        this.stopHeartbeat()
-        return
-      }
-      try {
-        await this.supabase
-          .from('collaboration_sessions')
-          .update({ last_heartbeat: new Date().toISOString() })
-          .eq('project_id', this.projectId)
-          .eq('user_id', this.userId)
-      } catch {
-        // Heartbeat failure is non-critical
-      }
-    }, HEARTBEAT_INTERVAL_MS)
-  }
-
-  private stopHeartbeat(): void {
-    if (this.heartbeatTimer) {
-      clearInterval(this.heartbeatTimer)
-      this.heartbeatTimer = null
-    }
-  }
-
-  private scheduleReconnect(): void {
-    if (this.isDestroyed) return
-    this.clearReconnectTimer()
-
-    const delay = Math.min(
-      RECONNECT_BASE_DELAY_MS * Math.pow(2, this.reconnectAttempts),
-      RECONNECT_MAX_DELAY_MS
-    )
-    this.reconnectAttempts++
-
-    this.reconnectTimer = setTimeout(async () => {
-      if (this.isDestroyed) return
-      this.callbacks.onConnectionStateChange('reconnecting')
-
-      if (this.channel) {
-        this.supabase.removeChannel(this.channel)
-        this.channel = null
-      }
-
-      await this.connect()
-    }, delay)
-  }
-
-  private clearReconnectTimer(): void {
-    if (this.reconnectTimer) {
-      clearTimeout(this.reconnectTimer)
-      this.reconnectTimer = null
-    }
-  }
-}

src/types/flowchart.ts

@@ -4,6 +4,13 @@ export type Position = {
   y: number;
 };
 
+<<<<<<< HEAD
+// Condition type for conditional edges and choice options
+export type Condition = {
+  variableName: string;
+  operator: '>' | '<' | '==' | '>=' | '<=' | '!=';
+  value: number;
+=======
 // Character type: represents a defined character in the project
 export type Character = {
   id: string;
@@ -27,6 +34,7 @@ export type Condition = {
   variableId?: string;
   operator: '>' | '<' | '==' | '>=' | '<=' | '!=';
   value: number | string | boolean;
+>>>>>>> ralph/collaboration-and-character-variables
 };
 
 // DialogueNode type: represents character speech/dialogue

supabase/migrations/20260123100000_add_collaboration_and_audit_trail.sql

@@ -1,214 +0,0 @@
--- Migration: Add collaboration sessions and audit trail tables
--- Supports real-time multi-user editing with presence tracking and change history
-
--- =============================================================================
--- PROJECT COLLABORATORS TABLE
--- =============================================================================
--- Tracks which users have access to a project and their role
-CREATE TABLE IF NOT EXISTS project_collaborators (
-  id uuid PRIMARY KEY DEFAULT uuid_generate_v4(),
-  project_id uuid NOT NULL REFERENCES projects(id) ON DELETE CASCADE,
-  user_id uuid NOT NULL REFERENCES profiles(id) ON DELETE CASCADE,
-  role text NOT NULL CHECK (role IN ('owner', 'editor', 'viewer')),
-  invited_at timestamptz DEFAULT now(),
-  accepted_at timestamptz,
-  UNIQUE (project_id, user_id)
-);
-
--- Enable Row Level Security
-ALTER TABLE project_collaborators ENABLE ROW LEVEL SECURITY;
-
--- RLS: Users can view collaborators for projects they belong to
-CREATE POLICY "Users can view collaborators for their projects"
-  ON project_collaborators
-  FOR SELECT
-  USING (
-    auth.uid() = user_id
-    OR project_id IN (
-      SELECT project_id FROM project_collaborators WHERE user_id = auth.uid()
-    )
-    OR project_id IN (
-      SELECT id FROM projects WHERE user_id = auth.uid()
-    )
-  );
-
--- RLS: Project owners can insert collaborators
-CREATE POLICY "Owners can add collaborators"
-  ON project_collaborators
-  FOR INSERT
-  WITH CHECK (
-    project_id IN (
-      SELECT id FROM projects WHERE user_id = auth.uid()
-    )
-  );
-
--- RLS: Project owners can update collaborator roles
-CREATE POLICY "Owners can update collaborators"
-  ON project_collaborators
-  FOR UPDATE
-  USING (
-    project_id IN (
-      SELECT id FROM projects WHERE user_id = auth.uid()
-    )
-  )
-  WITH CHECK (
-    project_id IN (
-      SELECT id FROM projects WHERE user_id = auth.uid()
-    )
-  );
-
--- RLS: Project owners can remove collaborators
-CREATE POLICY "Owners can remove collaborators"
-  ON project_collaborators
-  FOR DELETE
-  USING (
-    project_id IN (
-      SELECT id FROM projects WHERE user_id = auth.uid()
-    )
-  );
-
--- =============================================================================
--- COLLABORATION SESSIONS TABLE
--- =============================================================================
--- Tracks active editing sessions for real-time presence
-CREATE TABLE IF NOT EXISTS collaboration_sessions (
-  id uuid PRIMARY KEY DEFAULT uuid_generate_v4(),
-  project_id uuid NOT NULL REFERENCES projects(id) ON DELETE CASCADE,
-  user_id uuid NOT NULL REFERENCES profiles(id) ON DELETE CASCADE,
-  cursor_position jsonb,
-  selected_node_id text,
-  connected_at timestamptz DEFAULT now(),
-  last_heartbeat timestamptz DEFAULT now()
-);
-
--- Enable Row Level Security
-ALTER TABLE collaboration_sessions ENABLE ROW LEVEL SECURITY;
-
--- RLS: Users can view sessions for projects they collaborate on
-CREATE POLICY "Collaborators can view sessions"
-  ON collaboration_sessions
-  FOR SELECT
-  USING (
-    project_id IN (
-      SELECT id FROM projects WHERE user_id = auth.uid()
-    )
-    OR project_id IN (
-      SELECT project_id FROM project_collaborators WHERE user_id = auth.uid()
-    )
-  );
-
--- RLS: Users can insert their own sessions
-CREATE POLICY "Users can create own sessions"
-  ON collaboration_sessions
-  FOR INSERT
-  WITH CHECK (auth.uid() = user_id);
-
--- RLS: Users can update their own sessions (heartbeat, cursor position)
-CREATE POLICY "Users can update own sessions"
-  ON collaboration_sessions
-  FOR UPDATE
-  USING (auth.uid() = user_id)
-  WITH CHECK (auth.uid() = user_id);
-
--- RLS: Users can delete their own sessions (disconnect)
-CREATE POLICY "Users can delete own sessions"
-  ON collaboration_sessions
-  FOR DELETE
-  USING (auth.uid() = user_id);
-
--- =============================================================================
--- AUDIT TRAIL TABLE
--- =============================================================================
--- Records all node and edge changes for history and revert functionality
-CREATE TABLE IF NOT EXISTS audit_trail (
-  id uuid PRIMARY KEY DEFAULT uuid_generate_v4(),
-  project_id uuid NOT NULL REFERENCES projects(id) ON DELETE CASCADE,
-  user_id uuid NOT NULL REFERENCES profiles(id) ON DELETE CASCADE,
-  action_type text NOT NULL CHECK (action_type IN ('node_add', 'node_update', 'node_delete', 'edge_add', 'edge_update', 'edge_delete')),
-  entity_id text NOT NULL,
-  previous_state jsonb,
-  new_state jsonb,
-  created_at timestamptz DEFAULT now()
-);
-
--- Enable Row Level Security
-ALTER TABLE audit_trail ENABLE ROW LEVEL SECURITY;
-
--- RLS: Users can view audit trail for projects they collaborate on
-CREATE POLICY "Collaborators can view audit trail"
-  ON audit_trail
-  FOR SELECT
-  USING (
-    project_id IN (
-      SELECT id FROM projects WHERE user_id = auth.uid()
-    )
-    OR project_id IN (
-      SELECT project_id FROM project_collaborators WHERE user_id = auth.uid()
-    )
-  );
-
--- RLS: Users can insert audit entries for projects they collaborate on
-CREATE POLICY "Collaborators can write audit entries"
-  ON audit_trail
-  FOR INSERT
-  WITH CHECK (
-    auth.uid() = user_id
-    AND (
-      project_id IN (
-        SELECT id FROM projects WHERE user_id = auth.uid()
-      )
-      OR project_id IN (
-        SELECT project_id FROM project_collaborators
-        WHERE user_id = auth.uid() AND role IN ('owner', 'editor')
-      )
-    )
-  );
-
--- =============================================================================
--- INDEXES
--- =============================================================================
--- Index for efficient history queries (paginated by time)
-CREATE INDEX IF NOT EXISTS idx_audit_trail_project_created
-  ON audit_trail(project_id, created_at DESC);
-
--- Index for session lookups by project
-CREATE INDEX IF NOT EXISTS idx_collaboration_sessions_project
-  ON collaboration_sessions(project_id);
-
--- Index for collaborator lookups by project
-CREATE INDEX IF NOT EXISTS idx_project_collaborators_project
-  ON project_collaborators(project_id);
-
--- Index for collaborator lookups by user (for "shared with me" queries)
-CREATE INDEX IF NOT EXISTS idx_project_collaborators_user
-  ON project_collaborators(user_id);
-
--- =============================================================================
--- UPDATE PROJECTS RLS: Allow collaborators to read/write
--- =============================================================================
--- Collaborators with 'editor' or 'owner' role can view the project
-CREATE POLICY "Collaborators can view shared projects"
-  ON projects
-  FOR SELECT
-  USING (
-    id IN (
-      SELECT project_id FROM project_collaborators WHERE user_id = auth.uid()
-    )
-  );
-
--- Collaborators with 'editor' or 'owner' role can update the project
-CREATE POLICY "Collaborators can update shared projects"
-  ON projects
-  FOR UPDATE
-  USING (
-    id IN (
-      SELECT project_id FROM project_collaborators
-      WHERE user_id = auth.uid() AND role IN ('owner', 'editor')
-    )
-  )
-  WITH CHECK (
-    id IN (
-      SELECT project_id FROM project_collaborators
-      WHERE user_id = auth.uid() AND role IN ('owner', 'editor')
-    )
-  );

supabase/migrations/20260123200000_add_collaboration_sessions_unique_constraint.sql

@@ -1,6 +0,0 @@
--- Add unique constraint on collaboration_sessions for (project_id, user_id)
--- This ensures a user can only have one active session per project,
--- and allows upsert operations for session management.
-ALTER TABLE collaboration_sessions
-  ADD CONSTRAINT collaboration_sessions_project_user_unique
-  UNIQUE (project_id, user_id);