🤌 Rich text editor with real-time collaboration (Tiptap)

[haonguyen]

You got an infinite loop. @rico.trevisan

The plugin’s run updates the content when I select another note… It make the app got an infinite loop…

[rico.trevisan]

@rico.trevisan

I’m going to update the demo app.

Unfortunately I had to turn off the access to the app editor because it exposes my API keys. I’ll make a video tutorial on how to use the collaboration feature.

In short, it’s like this:

On collab.Tiptap.dev grab the :

• app id
• app secret — I believe this is in the settings page

On the plugin settings:

• add your app secret

On the page (or anywhere else you prefer)

• add a state of type text — the is where we will store the generated JWT key. Let’s call this generated JWT

Add a workflow when page loads

• use the action generate JWT token
• use a set state action to set the generated JWT state with the result of step 1

On the Tiptap element

• check the collaboration box
• add the app id app_id field
• add a document name to doc_id field
• add the reference to the generated JWT in the JWT field

Give it a go. Keep an eye on the console to see if any errors come up.

There are lots of (edge) cases that I need to handle but this should get you started.

[rico.trevisan]

I can’t remember who asked me for a way to extract the text with HTML. Someone just posted a solution in Github. I’ll give it a try soon.

[hugors00]

It was me , however, we figured out an alternative solution that works just as good.