fix: execute updateBlock as a transaction

Author: nperez0111

packages/core/src/api/blockManipulation/commands/updateBlock/updateBlock.ts

@@ -1,5 +1,5 @@
 import { Fragment, NodeType, Node as PMNode, Slice } from "prosemirror-model";
-import { EditorState } from "prosemirror-state";
+import { Transaction } from "prosemirror-state";
 
 import { ReplaceStep } from "prosemirror-transform";
 import { Block, PartialBlock } from "../../../../blocks/defaultBlocks.js";
@@ -34,33 +34,33 @@ export const updateBlockCommand =
     block: PartialBlock<BSchema, I, S>
   ) =>
   ({
-    state,
+    tr,
     dispatch,
   }: {
-    state: EditorState;
-    dispatch: ((args?: any) => any) | undefined;
+    tr: Transaction;
+    dispatch: (() => void) | undefined;
   }) => {
     const blockInfo = getBlockInfoFromResolvedPos(
-      state.doc.resolve(posBeforeBlock)
+      tr.doc.resolve(posBeforeBlock)
     );
 
     if (dispatch) {
       // Adds blockGroup node with child blocks if necessary.
 
-      const oldNodeType = state.schema.nodes[blockInfo.blockNoteType];
+      const oldNodeType = editor.pmSchema.nodes[blockInfo.blockNoteType];
       const newNodeType =
-        state.schema.nodes[block.type || blockInfo.blockNoteType];
+        editor.pmSchema.nodes[block.type || blockInfo.blockNoteType];
       const newBnBlockNodeType = newNodeType.isInGroup("bnBlock")
         ? newNodeType
-        : state.schema.nodes["blockContainer"];
+        : editor.pmSchema.nodes["blockContainer"];
 
       if (blockInfo.isBlockContainer && newNodeType.isInGroup("blockContent")) {
-        updateChildren(block, state, editor, blockInfo);
+        updateChildren(block, tr, editor, blockInfo);
         // The code below determines the new content of the block.
         // or "keep" to keep as-is
         updateBlockContentNode(
           block,
-          state,
+          tr,
           editor,
           oldNodeType,
           newNodeType,
@@ -70,7 +70,7 @@ export const updateBlockCommand =
         !blockInfo.isBlockContainer &&
         newNodeType.isInGroup("bnBlock")
       ) {
-        updateChildren(block, state, editor, blockInfo);
+        updateChildren(block, tr, editor, blockInfo);
         // old node was a bnBlock type (like column or columnList) and new block as well
         // No op, we just update the bnBlock below (at end of function) and have already updated the children
       } else {
@@ -88,15 +88,15 @@ export const updateBlockCommand =
           editor.schema.styleSchema,
           editor.blockCache
         );
-        state.tr.replaceWith(
+        tr.replaceWith(
           blockInfo.bnBlock.beforePos,
           blockInfo.bnBlock.afterPos,
           blockToNode(
             {
               children: existingBlock.children, // if no children are passed in, use existing children
               ...block,
             },
-            state.schema,
+            editor.pmSchema,
             editor.schema.styleSchema
           )
         );
@@ -106,7 +106,7 @@ export const updateBlockCommand =
 
       // Adds all provided props as attributes to the parent blockContainer node too, and also preserves existing
       // attributes.
-      state.tr.setNodeMarkup(blockInfo.bnBlock.beforePos, newBnBlockNodeType, {
+      tr.setNodeMarkup(blockInfo.bnBlock.beforePos, newBnBlockNodeType, {
         ...blockInfo.bnBlock.node.attrs,
         ...block.props,
       });
@@ -121,7 +121,7 @@ function updateBlockContentNode<
   S extends StyleSchema
 >(
   block: PartialBlock<BSchema, I, S>,
-  state: EditorState,
+  tr: Transaction,
   editor: BlockNoteEditor<BSchema, I, S>,
   oldNodeType: NodeType,
   newNodeType: NodeType,
@@ -140,7 +140,7 @@ function updateBlockContentNode<
       // Adds a single text node with no marks to the content.
       content = inlineContentToNodes(
         [block.content],
-        state.schema,
+        editor.pmSchema,
         editor.schema.styleSchema,
         newNodeType.name
       );
@@ -149,14 +149,14 @@ function updateBlockContentNode<
       // for each InlineContent object.
       content = inlineContentToNodes(
         block.content,
-        state.schema,
+        editor.pmSchema,
         editor.schema.styleSchema,
         newNodeType.name
       );
     } else if (block.content.type === "tableContent") {
       content = tableContentToNodes(
         block.content,
-        state.schema,
+        editor.pmSchema,
         editor.schema.styleSchema
       );
     } else {
@@ -186,9 +186,9 @@ function updateBlockContentNode<
   // content is being replaced or not.
   if (content === "keep") {
     // use setNodeMarkup to only update the type and attributes
-    state.tr.setNodeMarkup(
+    tr.setNodeMarkup(
       blockInfo.blockContent.beforePos,
-      block.type === undefined ? undefined : state.schema.nodes[block.type],
+      block.type === undefined ? undefined : editor.pmSchema.nodes[block.type],
       {
         ...blockInfo.blockContent.node.attrs,
         ...block.props,
@@ -198,7 +198,7 @@ function updateBlockContentNode<
     // use replaceWith to replace the content and the block itself
     // also  reset the selection since replacing the block content
     // sets it to the next block.
-    state.tr.replaceWith(
+    tr.replaceWith(
       blockInfo.blockContent.beforePos,
       blockInfo.blockContent.afterPos,
       newNodeType.createChecked(
@@ -218,21 +218,21 @@ function updateChildren<
   S extends StyleSchema
 >(
   block: PartialBlock<BSchema, I, S>,
-  state: EditorState,
+  tr: Transaction,
   editor: BlockNoteEditor<BSchema, I, S>,
   blockInfo: BlockInfo
 ) {
   if (block.children !== undefined && block.children.length > 0) {
     const childNodes = block.children.map((child) => {
-      return blockToNode(child, state.schema, editor.schema.styleSchema);
+      return blockToNode(child, editor.pmSchema, editor.schema.styleSchema);
     });
 
     // Checks if a blockGroup node already exists.
     if (blockInfo.childContainer) {
       // Replaces all child nodes in the existing blockGroup with the ones created earlier.
 
       // use a replacestep to avoid the fitting algorithm
-      state.tr.step(
+      tr.step(
         new ReplaceStep(
           blockInfo.childContainer.beforePos + 1,
           blockInfo.childContainer.afterPos - 1,
@@ -244,9 +244,9 @@ function updateChildren<
         throw new Error("impossible");
       }
       // Inserts a new blockGroup containing the child nodes created earlier.
-      state.tr.insert(
+      tr.insert(
         blockInfo.blockContent.afterPos,
-        state.schema.nodes["blockGroup"].createChecked({}, childNodes)
+        editor.pmSchema.nodes["blockGroup"].createChecked({}, childNodes)
       );
     }
   }
@@ -261,34 +261,38 @@ export function updateBlock<
   blockToUpdate: BlockIdentifier,
   update: PartialBlock<BSchema, I, S>
 ): Block<BSchema, I, S> {
-  const ttEditor = editor._tiptapEditor;
-
   const id =
     typeof blockToUpdate === "string" ? blockToUpdate : blockToUpdate.id;
+  return editor.transact(() => {
+    const tr = editor.transaction;
+    const posInfo = getNodeById(id, tr.doc);
+    if (!posInfo) {
+      throw new Error(`Block with ID ${id} not found`);
+    }
 
-  const posInfo = getNodeById(id, ttEditor.state.doc);
-  if (!posInfo) {
-    throw new Error(`Block with ID ${id} not found`);
-  }
-
-  ttEditor.commands.command(({ state, dispatch }) => {
     updateBlockCommand(
       editor,
       posInfo.posBeforeNode,
       update
-    )({ state, dispatch });
-    return true;
-  });
+    )({
+      tr,
+      dispatch: () => {
+        // no-op
+      },
+    });
+    // Actually dispatch that transaction
+    editor.dispatch(tr);
 
-  const blockContainerNode = ttEditor.state.doc
-    .resolve(posInfo.posBeforeNode + 1) // TODO: clean?
-    .node();
+    const blockContainerNode = tr.doc
+      .resolve(posInfo.posBeforeNode + 1) // TODO: clean?
+      .node();
 
-  return nodeToBlock(
-    blockContainerNode,
-    editor.schema.blockSchema,
-    editor.schema.inlineContentSchema,
-    editor.schema.styleSchema,
-    editor.blockCache
-  );
+    return nodeToBlock(
+      blockContainerNode,
+      editor.schema.blockSchema,
+      editor.schema.inlineContentSchema,
+      editor.schema.styleSchema,
+      editor.blockCache
+    );
+  });
 }