Mentions and Suggestion

[davevilela]

Hey there, I'm just starting to use 10tap on a project and I was wondering if there's any compatibility with the suggestions and mentions plugin from tiptap. This is a must-have for me.

If this feature does not exist yet, I would be happy to make a contribution if you could share some general steps that I could follow to implement this.

Thanks in advance!

[GuySerfaty]

Hey @davevilela, mention/suggestion is something that a lot of our clients asked to add to 10tap core lib but we decided to keep it as a pro example because it requires other dependencies and does not feel like a core feature.

The advanced setup + adding https://tiptap.dev/docs/editor/api/nodes/mention as a tiptapExstention can be a great start

if you are using 10tap for a commercial project please consider subscribing to 10tap Pro get access to a mention/suggestion example (added here mentions example video) and keep 10tap running and maintained under an MIT License

In case you are a startup or a company that can't afford a subscription please get in touch with us at email@10play.dev

mentions.mp4

[davevilela]

Hey @davevilela, mention/suggestion is something that a lot of our clients asked to add to 10tap core lib but we decided to keep it as a pro example because it requires other dependencies and does not feel like a core feature.

The advanced setup + adding https://tiptap.dev/docs/editor/api/nodes/mention as a tiptapExstention can be a great start

if you are using 10tap for a commercial project please consider subscribing to 10tap Pro get access to a mention/suggestion example (added here mentions example video) and keep 10tap running and maintained under an MIT License

In case you are a startup or a company that can't afford a subscription please get in touch with us at email@10play.dev

mentions.mp4

Hey @GuySerfaty, thanks for clearing things up.

I think I missed the 10tap Pro in your docs 😂. I had no idea this was a thing.

I’m currently working on a pet project, so the subscription wouldn’t be an option for me right now, but I’ll definitely consider it for other commercial projects.

The demo you uploaded is close to what I need, but I guess the suggestion popover is rendered with Popper or something similar within the WebView, right?

I would like to be able to use the suggestion API on the native side, meaning that the state of the current suggestion would have to be reported back to native through the bridge. I guess this would be possible just by having access to the editor’s content and cursor, but Tiptap already has a nice suggestion API that I think could be extended to make this work. What do you think?

Is this something 10tap Pro solves, or would you be open to an open-source contribution on this matter?

[GuySerfaty]

hi @davevilela :)

I guess the suggestion popover is rendered with Popper or something similar within the WebView, right?

Actually, we're bridging the mention "query" to the native side and then filtering and rendering the suggestion component on RN side, we think it's better because:

1. You can query all the possible users to mention from the RN side (even from local cache or DB)
2. The UX is better in the video we show the mention options instead of the toolbar and there are no delay or glitches

Tiptap already has a nice suggestion API that I think could be extended to make this work

Yup! You can implement this (like we did) yourself with the advanced setup, by extending tiptaps mention plugin
This is a pro example we provide, and is not really a "core" feature, so we will not be implementing this in the lib

If you have more questions you are welcome to send mails to email@10play.dev