Listen and categorize changes

Show
1

hey Folks!

How can I listen to transactions and “translate” them to something more concrete like “moveNode”, “replaceNode” or “deleteNode”?

Long form question:

I’m starting to use PM for my startup https://mintter.com. in our editor, we do not save the whole state value in the backend, but we send the backend all the operations that happened at a specific node level: we have a block-based editor similar to notion, and we are just storing changes at the block level (moves, replace and delete).

I love the fact that PM is super versatile and low-level to control anything that happens in the editor, but I’m finding really hard to translate transactions and steps into our changes types:

- when a block is created -> moveBlock(blockNode, leftSiblingRef, parentRef)
- when text is inserted to a block -> replaceBlock(blockNode)
- when a block is removed -> deleteBlock(blockRef)
- when a block change position (dragged, nested, unnested) -> moveBlock(blockNode, leftSiblingRef, parentRef)

From what I’ve seen, I need to always create a new state and compare both the oldState and the newState of the whole document to determine what changed and what block changed. This sounds to much considering that we might need to control this operations for long documents with thousands of blocks. not sure if this is the right approach?

I tried creating a plugin that listens to all transactions, but maybe because I’m new I don’t know how to understand transactions or steps to translate to what I need.

I hope someone can give me some guidance into what to look for and what tools can help me achieve my goal.

thanks again!

2

ProseMirror’s steps take a completely different approach to describing modifications than the vocabulary you’re using, so yeah, diffing is probably the best approach. I don’t believe it’ll be that slow—you can just skip over nodes that were reused between the documents with an object equality check.

1 Like
3

from the documentation provided, the transaction provides a docChange keyword, you can compare it with the next transaction. The creation of a plugin to handle the entire doc, I don’t see how is feasible

4

I don’t see any reference to docChange in the reference manuall. can you share a link? I see only references to docChanged and that’s a boolean, it does not help me much in this situation.

thanks in advance!