Best way to store nested XmlFragment

1

I have a Y Doc in the following structure

doc {
  common: {
     ...
  }
  blocks: [
     {
        id: 1, 
        data: {
           content: {
             hero: {
                 body: "some content"  <--- I want this to be collaborative XmlFragment
             } 
          }
        }
     }
   ....
   ]
}

the whole document is collaborative, and what is the best way to make blocks[0].data.content.hero.body a XmlFragment.

Currently, I create a new XmlFragment with a composite id 1-data-content-hero-body by doing doc.getXMLFragment("1-data-content-hero-body") and update the doc.blocks[0].data.content.hero.body with the full string value (prosemirror doc) when the body changed, this works fine, but now the doc has duplicated data.

Every time I made one letter change it adds a new Item will the full transformed json, as well as a Item with one character change for the XmlFragment. If i turn off the GC, the doc size is getting really large pretty quickly.

What are some ways I can solve this? I want full collboration on all items in the Map

2

If you want the entire structure to be collaborative, you should use nested shared types:

const blocks = doc.getArray()
const block = new Y.Map()
blocks.push(block)
block.set('id', 1)
const data = new Y.Map()
block.set('data', data)
const content = new Y.Map()
data.set('content', content)
const hero = new Y.Map()
content.set('hero', hero)
const body = new Y.XmlFragment()
hero.set('body', body)

For an easier way of interacting with deeply nested shared types, you can try SyncedStore.

3

Thanks. :slight_smile:

I’m using SyncedStore. :slight_smile:

4

So, it’s been tricky because the body content is a rich text editor using tiptap.

Seems like I have to manually load the xmlfragment using the prosemirrorjsontofragment, for the first time. It’s seems bit complicated…

Any other ways to avoid the duplications ?

5

I haven’t used ProseMirror, but maybe someone who has can offer a suggestion.