syncing on new block

client/src/components/BlockEditor/BlockEditor.tsx

@@ -130,6 +130,21 @@ export default function BlockEditor() {
   // Set when the user changes the workspace during a drag while a remote XML
   // sync is deferred. Local edits must win over the older deferred snapshot.
   const localChangeDuringDragRef = useRef(false);
+  // Recent block creation id. A toolbox drag emits BLOCK_CREATE before
+  // BLOCK_DRAG start, so this lets us tell that the drag created the block.
+  const recentCreateBlockIdRef = useRef<string | null>(null);
+  // Remote XML that arrived while another remote update was still in flight.
+  // It must be retried instead of silently dropped.
+  const deferredRemoteSyncRef = useRef(false);
+  const [remoteSyncTick, setRemoteSyncTick] = useState(0);
+
+  const finishRemoteUpdate = useCallback(() => {
+    remoteUpdateRef.current = false;
+    if (deferredRemoteSyncRef.current) {
+      deferredRemoteSyncRef.current = false;
+      setRemoteSyncTick((tick) => tick + 1);
+    }
+  }, []);
 
   // Modal state for editing variable/function blocks
   const [editingModal, setEditingModal] = useState<BlockEditorModalState | null>(null);
@@ -328,16 +343,23 @@ export default function BlockEditor() {
           if (e.isStart) {
             dragEndId++;
             isDraggingRef.current = true;
-            blocksCreatedDuringDragRef.current = false;
+            // A toolbox drag emits BLOCK_CREATE just before BLOCK_DRAG start.
+            // Track that this drag introduced a new block, so its drop wins
+            // over any older XML that arrived while the drag was in progress.
+            blocksCreatedDuringDragRef.current = recentCreateBlockIdRef.current === e.blockId;
             localChangeDuringDragRef.current = false;
+            recentCreateBlockIdRef.current = null;
             draggedBlockId = e.blockId;
             emitBlockDragStart(e.blockId, xy.x, xy.y);
             // Poll block position during drag (BLOCK_MOVE may not fire)
             dragPoll = setInterval(() => {
-              if (remoteUpdateRef.current || !isDraggingRef.current) {
+              if (!isDraggingRef.current) {
                 if (dragPoll) { clearInterval(dragPoll); dragPoll = null; }
                 return;
               }
+              // Skip this tick while a remote apply is settling, but keep
+              // polling so later drag positions still reach collaborators.
+              if (remoteUpdateRef.current) return;
               const b = ws.getBlockById(draggedBlockId!);
               if (b) {
                 const pos = b.getRelativeToSurfaceXY();
@@ -355,41 +377,19 @@ export default function BlockEditor() {
             requestAnimationFrame(() => {
               if (thisId !== dragEndId) return;
               isDraggingRef.current = false;
-              saveBlocks();
-              // Apply any deferred XML sync that arrived during drag
-              const pendingXml = pendingSyncXmlRef.current;
-              if (pendingXml) {
+              const hadLocalChanges =
+                blocksCreatedDuringDragRef.current || localChangeDuringDragRef.current;
+              // The dropped block is a local edit. Force the save even when a
+              // remote update is being applied, otherwise a quick drag can be
+              // overwritten by the remote XML before it is broadcast.
+              saveBlocks(hadLocalChanges);
+              // Any XML that arrived while dragging was deferred. The store now
+              // holds either the forced local save above or the collaborator's
+              // latest XML, so let the reload effect reconcile the workspace
+              // with that single source of truth.
+              if (pendingSyncXmlRef.current) {
                 pendingSyncXmlRef.current = null;
-                const ws2 = workspaceRef.current;
-                if (ws2) {
-                  // If the user changed anything locally during the drag, the
-                  // deferred XML predates those edits. Keep the local state;
-                  // saveBlocks() above already broadcast it to collaborators.
-                  if (blocksCreatedDuringDragRef.current || localChangeDuringDragRef.current) {
-                    console.log('[WS Reload] drag-end SKIPPING deferred XML: local edits during drag take priority');
-                    return;
-                  }
-                  console.log('[WS Reload] applying deferred XML after drag end');
-                  remoteUpdateRef.current = true;
-                  try {
-                    ws2.clear();
-                    const dom = Blockly.utils.xml.textToDom(pendingXml);
-                    Blockly.Xml.domToWorkspace(dom, ws2);
-                    try { (ws2 as any).clearSelection(); } catch {}
-                    try { ws2.setScale(useEditorStore.getState().zoom); } catch {}
-                    // Regenerate the compiled code now that the workspace reflects
-                    // the collaborator's XML (saveBlocks skips during remote loads).
-                    const currentFileId = useEditorStore.getState().activeFileId;
-                    if (currentFileId) refreshCodeForWorkspace(ws2, currentFileId);
-                  } catch (e) {
-                    console.error('[WS Reload] FAILED to apply deferred XML:', e);
-                  }
-                  requestAnimationFrame(() => { setTimeout(() => { remoteUpdateRef.current = false; }, 0); });
-                  requestAnimationFrame(() => {
-                    try { syncCustomFunctionBlocks(ws2); } catch {}
-                    try { rebuildToolbox(ws2); } catch {}
-                  });
-                }
+                setRemoteSyncTick((tick) => tick + 1);
               }
             });
           }
@@ -418,30 +418,42 @@ export default function BlockEditor() {
       if (e.type === Blockly.Events.BLOCK_CHANGE && e.element === 'field' && !remoteUpdateRef.current) {
         emitBlockChange(e.blockId, e.name, e.newValue, e.element);
       }
-      // Broadcast block creation (toolbox drag-out, paste, duplicate) so collaborator
-      // screens can create the block immediately instead of waiting for XML sync.
+      // Broadcast block creation (toolbox drag-out, paste, duplicate) so
+      // collaborator screens can create the block immediately instead of
+      // waiting for the next full XML sync. BLOCK_CREATE fires from the block
+      // constructor, before Blockly has positioned a flyout block, so emit on
+      // a microtask to capture its real coordinates. blockToDomWithXY also
+      // preserves the block id that later drag/connect/change events use.
       if (e.type === Blockly.Events.BLOCK_CREATE && !remoteUpdateRef.current) {
+        recentCreateBlockIdRef.current = e.blockId;
         if (isDraggingRef.current) {
           blocksCreatedDuringDragRef.current = true;
         }
-        const block = ws.getBlockById(e.blockId);
-        console.log('[BLOCK_CREATE] received:', { blockId: e.blockId, hasBlock: !!block, blockType: block?.type, isShadow: block?.isShadow?.(), hasParent: !!block?.getParent?.(), isDragging: isDraggingRef.current });
-        if (block && !block.getParent()) {
+        const createdBlockId = e.blockId;
+        const createdFileId = activeFileId;
+        queueMicrotask(() => {
+          if (!createdFileId || workspaceRef.current !== ws) return;
+          // Never emit a block from a workspace that has already been replaced
+          // by another file or project.
+          if (projectIdRef.current !== workspaceProjectId) return;
+          if (useEditorStore.getState().activeFileId !== createdFileId) return;
+          const block = ws.getBlockById(createdBlockId);
+          if (!block || block.isShadow() || block.isInsertionMarker()) return;
           try {
-            const dom = Blockly.Xml.blockToDom(block, { xy: true } as any);
+            const dom = Blockly.Xml.blockToDomWithXY(block);
             const xml = Blockly.Xml.domToText(dom);
-            console.log('[BLOCK_CREATE] emitting block_create_event:', { blockId: e.blockId, activeFileId, xmlLen: xml.length });
-            if (activeFileId) emitBlockCreateEvent(e.blockId, activeFileId, xml);
+            emitBlockCreateEvent(createdBlockId, createdFileId, xml);
           } catch (err) {
             console.warn('[BLOCK_CREATE] failed to emit block_create_event:', err);
           }
-        } else if (block && block.getParent()) {
-          console.log('[BLOCK_CREATE] skipping: block has parent');
-        }
+        });
       }
     });
 
     // Restore saved blocks for this specific file
+    remoteUpdateRef.current = false;
+    deferredRemoteSyncRef.current = false;
+    pendingSyncXmlRef.current = null;
     const savedXml = getBlocksXml(activeFileId);
     if (savedXml) {
       try {
@@ -453,9 +465,9 @@ export default function BlockEditor() {
         // the restored blocks even if the persisted file content is older than
         // the saved XML (e.g. leftover code from a previous session).
         if (activeFileId) refreshCodeForWorkspace(ws, activeFileId);
-        requestAnimationFrame(() => { setTimeout(() => { remoteUpdateRef.current = false; }, 0); });
+        requestAnimationFrame(() => { setTimeout(finishRemoteUpdate, 0); });
       } catch (e) {
-        requestAnimationFrame(() => { setTimeout(() => { remoteUpdateRef.current = false; }, 0); });
+        requestAnimationFrame(() => { setTimeout(finishRemoteUpdate, 0); });
         // saved XML is invalid, ignore
       }
     }
@@ -465,22 +477,15 @@ export default function BlockEditor() {
     });
 
     // Auto-save blocks on change - per-file
-    const saveBlocks = () => {
+    const saveBlocks = (force = false) => {
       if (!workspaceProjectId || projectIdRef.current !== workspaceProjectId) return;
-      if (remoteUpdateRef.current || isDraggingRef.current) {
-        console.log('[saveBlocks] SKIPPING (remote:', remoteUpdateRef.current, 'dragging:', isDraggingRef.current, ') topBlocks:', ws.getTopBlocks(false).length);
-        return;
-      }
+      if ((remoteUpdateRef.current && !force) || isDraggingRef.current) return;
       const dom = Blockly.Xml.workspaceToDom(ws);
       const xml = Blockly.Xml.domToText(dom);
       const currentFileId = useEditorStore.getState().activeFileId;
-      if (!currentFileId) return;
+      if (!currentFileId || currentFileId !== activeFileId) return;
       const savedXml = getBlocksXml(currentFileId);
-      if (savedXml === xml) {
-        console.log('[saveBlocks] SKIPPING: XML unchanged for file:', currentFileId);
-        return;
-      }
-      console.log('[saveBlocks] SAVING blocks for file:', currentFileId, 'xml length:', xml.length, 'topBlocks:', ws.getTopBlocks(false).length, '(old:', savedXml?.length, ')');
+      if (savedXml === xml) return;
       setBlocksXml(currentFileId, xml);
       emitBlockStateSync(currentFileId, xml);
       const generatedCode = refreshCodeForWorkspace(ws, currentFileId);
@@ -493,7 +498,18 @@ export default function BlockEditor() {
         s.emit('file_changed', { projectId: pid, fileId: currentFileId, content: generatedCode });
       }
     };
-    ws.addChangeListener(saveBlocks);
+    // A toolbox drag fires BLOCK_CREATE from the block constructor, before
+    // Blockly has positioned the block. Saving there would broadcast a
+    // transient (0,0) position. Defer one microtask: if a drag starts, the
+    // save is suppressed until drop; paste/programmatic creates still save.
+    const handleWorkspaceChange = (e: any) => {
+      if (e?.type === Blockly.Events.BLOCK_CREATE && !remoteUpdateRef.current) {
+        queueMicrotask(() => saveBlocks());
+        return;
+      }
+      saveBlocks();
+    };
+    ws.addChangeListener(handleWorkspaceChange);
 
     return () => {
       resizeObserver.disconnect();
@@ -516,18 +532,25 @@ export default function BlockEditor() {
         delete (div as any).__pointerSvg;
       }
       isDraggingRef.current = false;
-      ws.removeChangeListener(saveBlocks);
+      ws.removeChangeListener(handleWorkspaceChange);
       ws.dispose();
       workspaceRef.current = null;
     };
-  }, [framework, activeFileId, currentProject?.id]);
+  }, [framework, activeFileId, currentProject?.id, finishRemoteUpdate]);
 
   // Apply remote block state changes (skip if workspace already matches)
   const blocksXmlForFile = useEditorStore((s) => s.blocksXml[activeFileId || '']);
   useEffect(() => {
-    if (!activeFileId || !workspaceRef.current || remoteUpdateRef.current) return;
-    const ws = workspaceRef.current;
+    if (!activeFileId || !workspaceRef.current) return;
     if (!blocksXmlForFile) return;
+    const ws = workspaceRef.current;
+    if (remoteUpdateRef.current) {
+      // A different remote update is still settling. Remember it and retry;
+      // dropping it here is what made quick updates (e.g. a block created and
+      // dropped while a create was being applied) disappear for collaborators.
+      deferredRemoteSyncRef.current = true;
+      return;
+    }
     // If the workspace already matches this XML, skip reload (avoid disrupting drag/edit)
     try {
       const currentDom = Blockly.Xml.workspaceToDom(ws);
@@ -537,7 +560,6 @@ export default function BlockEditor() {
     // If the user is currently dragging, defer the reload to avoid disrupting the drag.
     // Store the pending XML so the drag-end handler can apply it.
     if (isDraggingRef.current) {
-      console.log('[WS Reload] DEFERRING: user is dragging');
       pendingSyncXmlRef.current = blocksXmlForFile;
       return;
     }
@@ -545,7 +567,6 @@ export default function BlockEditor() {
     // has fewer top-level blocks than the local workspace: otherwise deleting
     // blocks remotely would never propagate. Concurrent local edits are sent
     // back through the same channel and converge on the last update.
-    console.log('[WS Reload] reloading workspace from XML (top blocks:', ws.getTopBlocks(false).length, ')');
     pendingSyncXmlRef.current = null;
     remoteUpdateRef.current = true;
     try {
@@ -562,17 +583,23 @@ export default function BlockEditor() {
     }
     // Blockly may fire events asynchronously (microtasks) after domToWorkspace.
     // Defer resetting the flag so those events see remoteUpdateRef=true.
-    requestAnimationFrame(() => { setTimeout(() => { remoteUpdateRef.current = false; }, 0); });
+    requestAnimationFrame(() => { setTimeout(finishRemoteUpdate, 0); });
     requestAnimationFrame(() => {
       try { syncCustomFunctionBlocks(ws); } catch {}
       try { rebuildToolbox(ws); } catch {}
     });
-  }, [activeFileId, blocksXmlForFile]);
+  }, [activeFileId, blocksXmlForFile, remoteSyncTick, finishRemoteUpdate]);
 
   // Move remote collaborator blocks to absolute positions during drag
   useEffect(() => {
     const ws = workspaceRef.current;
-    if (!ws || !activeFileId || remoteUpdateRef.current) return;
+    if (!ws || !activeFileId) return;
+    if (remoteUpdateRef.current) {
+      // Retry once the in-flight apply settles so the latest drag position is
+      // not skipped.
+      deferredRemoteSyncRef.current = true;
+      return;
+    }
     remoteUpdateRef.current = true;
     for (const [userId, drag] of Object.entries(remoteBlockDrags)) {
       const block = ws.getBlockById(drag.blockId);
@@ -588,12 +615,18 @@ export default function BlockEditor() {
         block.moveBy(dx, dy);
       }
     }
-    remoteUpdateRef.current = false;
-  }, [remoteBlockDrags, activeFileId]);
+    finishRemoteUpdate();
+  }, [remoteBlockDrags, activeFileId, blocksXmlForFile, remoteSyncTick, finishRemoteUpdate]);
 
   // Connect blocks on receiver when remote user snaps a block into a parent
   useEffect(() => {
     if (!pendingBlockConnects.length) return;
+    if (remoteUpdateRef.current) {
+      // Another apply is still settling; retry after it finishes so this
+      // connection is not applied against a half-updated workspace.
+      deferredRemoteSyncRef.current = true;
+      return;
+    }
     remoteUpdateRef.current = true;
     const ws = workspaceRef.current;
     if (ws) {
@@ -641,12 +674,16 @@ export default function BlockEditor() {
       // code explicitly after applying remote connections.
       if (activeFileId) refreshCodeForWorkspace(ws, activeFileId);
     }
-    remoteUpdateRef.current = false;
-  }, [pendingBlockConnects, blocksXmlForFile]);
+    finishRemoteUpdate();
+  }, [pendingBlockConnects, blocksXmlForFile, remoteSyncTick, finishRemoteUpdate]);
 
   // Apply field value changes from remote collaborators (dropdowns, text fields, etc.)
   useEffect(() => {
     if (!pendingBlockChanges.length) return;
+    if (remoteUpdateRef.current) {
+      deferredRemoteSyncRef.current = true;
+      return;
+    }
     remoteUpdateRef.current = true;
     const ws = workspaceRef.current;
     if (ws) {
@@ -660,61 +697,82 @@ export default function BlockEditor() {
         } catch {}
       }
     }
-    remoteUpdateRef.current = false;
+    finishRemoteUpdate();
     // saveBlocks skips while remoteUpdateRef is set, so refresh the compiled
     // code explicitly after applying remote field value changes.
     if (ws && activeFileId) refreshCodeForWorkspace(ws, activeFileId);
-  }, [pendingBlockChanges]);
+  }, [pendingBlockChanges, remoteSyncTick, finishRemoteUpdate]);
 
   // Create blocks on receiver when remote user drags a new block from the toolbox
   useEffect(() => {
-    if (!pendingBlockCreates.length) {
-      console.log('[PendingCreate] no pending creates, skipping');
+    if (!activeFileId || !pendingBlockCreates.length) return;
+    if (remoteUpdateRef.current) {
+      deferredRemoteSyncRef.current = true;
       return;
     }
-    console.log('[PendingCreate] processing', pendingBlockCreates.length, 'pending creates');
-    remoteUpdateRef.current = true;
     const ws = workspaceRef.current;
-    if (ws && activeFileId) {
-      let created = false;
-      while (useCollaborationStore.getState().pendingBlockCreates.length > 0) {
-        const create = useCollaborationStore.getState().shiftPendingBlockCreate();
-        if (!create) continue;
-        // Skip if block already exists (e.g. already created by XML sync)
-        if (ws.getBlockById(create.blockId)) {
-          console.log('[PendingCreate] block already exists:', create.blockId);
-          continue;
-        }
-        try {
-          console.log('[PendingCreate] creating block:', create.blockId);
-          const dom = Blockly.utils.xml.textToDom(create.xml);
-          Blockly.Xml.domToWorkspace(dom, ws);
-          created = true;
-          console.log('[PendingCreate] block created successfully:', create.blockId);
-        } catch (e) {
-          console.warn('[PendingCreate] failed to create block:', create.blockId, e);
+    if (!ws) return;
+    // Creates are queued together with their file id. Leave operations for
+    // other files untouched; they are recovered by the full XML sync (or
+    // applied when the user opens that file).
+    const forActiveFile = useCollaborationStore
+      .getState()
+      .pendingBlockCreates.filter((create) => create.fileId === activeFileId);
+    if (!forActiveFile.length) return;
+
+    remoteUpdateRef.current = true;
+    let created = false;
+    const processedBlockIds = new Set<string>();
+    for (const create of forActiveFile) {
+      processedBlockIds.add(create.blockId);
+      // Skip if block already exists (e.g. already created by XML sync)
+      if (ws.getBlockById(create.blockId)) continue;
+      try {
+        const dom = Blockly.utils.xml.textToDom(create.xml);
+        // `domToWorkspace` expects an <xml> wrapper; passing a bare <block>
+        // element silently creates nothing. Older payloads may also have lost
+        // the id (blockToDom's second argument is opt_noId), so restore it to
+        // keep later drag/connect/change events addressable.
+        const rootName = dom.nodeName.toLowerCase();
+        let wrapper: Element;
+        if (rootName === 'xml') {
+          wrapper = dom;
+        } else {
+          if (!dom.getAttribute('id')) dom.setAttribute('id', create.blockId);
+          wrapper = Blockly.utils.xml.createElement('xml');
+          wrapper.appendChild(dom);
         }
+        Blockly.Xml.domToWorkspace(wrapper, ws);
+        created = true;
+      } catch (e) {
+        console.warn('[Collaboration] failed to apply remote block create:', create.blockId, e);
       }
-      // Update blocksXml in the store so the blocksXmlForFile comparison
-      // in the workspace-reload effect matches the current workspace,
-      // preventing a destructive clear+reload that could conflict.
-      if (created) {
-        const dom = Blockly.Xml.workspaceToDom(ws);
-        const xml = Blockly.Xml.domToText(dom);
-        console.log('[PendingCreate] updating blocksXml after creating blocks');
-        useEditorStore.getState().setBlocksXml(activeFileId, xml);
-        // saveBlocks skips while remoteUpdateRef is set, so refresh the
-        // compiled code explicitly after creating collaborator blocks.
-        refreshCodeForWorkspace(ws, activeFileId);
-        requestAnimationFrame(() => {
-          try { syncCustomFunctionBlocks(ws); } catch {}
-          try { rebuildToolbox(ws); } catch {}
-        });
-      }
-      useCollaborationStore.setState({ pendingBlockCreates: [] });
     }
-    requestAnimationFrame(() => { setTimeout(() => { remoteUpdateRef.current = false; }, 0); });
-  }, [pendingBlockCreates, blocksXmlForFile]);
+    // Remove only the entries that were processed so newly queued creates are
+    // never dropped.
+    useCollaborationStore.setState((state) => ({
+      pendingBlockCreates: state.pendingBlockCreates.filter(
+        (create) =>
+          !(create.fileId === activeFileId && processedBlockIds.has(create.blockId))
+      ),
+    }));
+    // Update blocksXml in the store so the blocksXmlForFile comparison in the
+    // workspace-reload effect matches the current workspace, preventing a
+    // destructive clear+reload that could conflict.
+    if (created) {
+      const dom = Blockly.Xml.workspaceToDom(ws);
+      const xml = Blockly.Xml.domToText(dom);
+      useEditorStore.getState().setBlocksXml(activeFileId, xml);
+      // saveBlocks skips while remoteUpdateRef is set, so refresh the compiled
+      // code explicitly after creating collaborator blocks.
+      refreshCodeForWorkspace(ws, activeFileId);
+      requestAnimationFrame(() => {
+        try { syncCustomFunctionBlocks(ws); } catch {}
+        try { rebuildToolbox(ws); } catch {}
+      });
+    }
+    requestAnimationFrame(() => { setTimeout(finishRemoteUpdate, 0); });
+  }, [pendingBlockCreates, blocksXmlForFile, activeFileId, remoteSyncTick, finishRemoteUpdate]);
 
   // Collaborator block selection overlay
   const collaborators = useCollaborationStore((s) => s.collaborators);

client/src/components/ProjectEditor/ProjectEditor.tsx

@@ -74,13 +74,15 @@ export default function ProjectEditor() {
   // snapshot, silently discarding local and collaborator edits.
   const hydratedProjectIdRef = useRef<string | null>(null);
   const resetProjectState = useEditorStore((s) => s.resetProjectState);
+  const resetCollaborationState = useCollaborationStore((s) => s.resetTransientState);
 
   // Declared before `useProjectSocket` so it runs before the new room's initial
   // block state arrives. Per-file caches are keyed by id and default files
   // repeat across projects, so stale entries must be cleared first.
   useEffect(() => {
     resetProjectState();
-  }, [id, resetProjectState]);
+    resetCollaborationState();
+  }, [id, resetProjectState, resetCollaborationState]);
 
   const { emitFileChanged, emitActiveFileChanged, emitSave, emitCursorMove } = useProjectSocket(id);
 

client/src/hooks/useWebSocket.ts

@@ -228,15 +228,11 @@ export function useWebSocket() {
     s.on('collaborator_block_create_event', ({ projectId, blockId, fileId, xml }: { projectId?: string; blockId: string; fileId: string; xml: string }) => {
       if (!isCurrentProject(projectId)) return;
       const store = useEditorStore.getState();
-      console.log('[WS] collaborator_block_create_event received:', { blockId, fileId, activeFileId: store.activeFileId, xmlLength: xml?.length });
       // Only apply to the currently active file; otherwise the block would appear
       // on the wrong file's workspace. The full XML sync (block_state_synced) will
       // handle it when the collaborator switches to that file.
       if (store.activeFileId === fileId) {
-        console.log('[WS] pushing pending block create:', blockId);
-        useCollaborationStore.getState().pushPendingBlockCreate({ blockId, xml });
-      } else {
-        console.log('[WS] skipping block create - fileId mismatch:', { eventFileId: fileId, activeFileId: store.activeFileId });
+        useCollaborationStore.getState().pushPendingBlockCreate({ blockId, fileId, xml });
       }
     });
 

client/src/store/collaborationStore.ts

@@ -40,7 +40,7 @@ interface CollaborationStore {
   remoteBlockDrags: Record<string, RemoteBlockDrag>;
   pendingBlockConnects: Array<{ childId: string; parentId: string; inputName?: string }>;
   pendingBlockChanges: Array<{ blockId: string; name: string; value: any }>;
-  pendingBlockCreates: Array<{ blockId: string; xml: string }>;
+  pendingBlockCreates: Array<{ blockId: string; fileId: string; xml: string }>;
   setConnected: (connected: boolean) => void;
   setCollaborators: (collaborators: Collaborator[]) => void;
   setOwner: (owner: CollaboratorOwner) => void;
@@ -62,8 +62,8 @@ interface CollaborationStore {
   shiftPendingBlockConnect: () => { childId: string; parentId: string; inputName?: string } | undefined;
   pushPendingBlockChange: (data: { blockId: string; name: string; value: any }) => void;
   shiftPendingBlockChange: () => { blockId: string; name: string; value: any } | undefined;
-  pushPendingBlockCreate: (data: { blockId: string; xml: string }) => void;
-  shiftPendingBlockCreate: () => { blockId: string; xml: string } | undefined;
+  pushPendingBlockCreate: (data: { blockId: string; fileId: string; xml: string }) => void;
+  resetTransientState: () => void;
   getCollaboratorsOnFile: (fileId: string) => Collaborator[];
   getCollaboratorsOnBlock: (blockId: string) => Collaborator[];
   getCollaboratorsOnElement: (elementId: string) => Collaborator[];
@@ -152,6 +152,18 @@ export const useCollaborationStore = create<CollaborationStore>((set, get) => ({
 
   setSavedBy: (username) => set({ savedBy: username }),
 
+  // Queued block operations and remote drag markers are scoped to the project
+  // that produced them. Block ids and file ids are not globally unique enough
+  // to let them survive a project switch.
+  resetTransientState: () =>
+    set({
+      remotePointers: {},
+      remoteBlockDrags: {},
+      pendingBlockConnects: [],
+      pendingBlockChanges: [],
+      pendingBlockCreates: [],
+    }),
+
   getCollaboratorsOnFile: (fileId) => {
     return get().collaborators.filter((c) => c.activeFileId === fileId);
   },
@@ -234,12 +246,4 @@ export const useCollaborationStore = create<CollaborationStore>((set, get) => ({
     set((state) => ({
       pendingBlockCreates: [...state.pendingBlockCreates, data],
     })),
-  shiftPendingBlockCreate: () => {
-    const state = get();
-    const [first, ...rest] = state.pendingBlockCreates;
-    if (first) {
-      set({ pendingBlockCreates: rest });
-    }
-    return first;
-  },
 }));